溫馨提示

寫博客是為了記錄在開發(fā)過程中所涉及到的技術(shù)以及遇到的問題的解決饵婆，如果該博客對(duì)您有所幫助伍宦，希望可以點(diǎn)個(gè)關(guān)注/喜歡给猾；如果您對(duì)文章中的內(nèi)容有什么不同的見解丙号，歡迎留言進(jìn)行討論先朦。謝謝！

OneBottomNavigationBar 使用說明

簡(jiǎn)介：

OneBottomNavigationBar 是自定義的一個(gè)實(shí)現(xiàn)App應(yīng)用底部導(dǎo)航欄功能的View,可以實(shí)現(xiàn)底部 2-5 個(gè)導(dǎo)航菜單（一般不會(huì)有更多）犬缨，可以實(shí)現(xiàn)某一個(gè)菜單凸起的效果喳魏，如，有5個(gè)菜單怀薛，可以選擇讓第三個(gè)菜單凸起（floating）刺彩，這是很多App都有的功能; 可以根據(jù)編寫的顏色變化的資源文件來更改圖標(biāo)和文字選中時(shí)和未選中時(shí)的顏色，可以自由控制是否需要選中（checkable）,選擇開啟時(shí)枝恋，可變換為選中顏色创倔，選擇關(guān)閉時(shí)，不能更改為選擇顏色;可以控制默認(rèn)選中哪一項(xiàng)焚碌；可以設(shè)置某一個(gè)導(dǎo)航菜單的未讀消息數(shù)（數(shù)字或者小紅點(diǎn)）畦攘。

先看一組效果圖

五個(gè)菜單，沒有凸起的十电，都是可選中的

正常菜單

<center>圖1</center>

中間有凸起知押，并且中間的不能選中，但點(diǎn)擊事件可以響應(yīng)

中間凸起

<center>圖2</center>

引入方法

jcenter

VERSION: VERSION

• 在model 中的build.gradle 中增加依賴

dependencies {
    implementation 'cn.onestravel.one:one_bottom_navigationbar:VERSION'
}

例如：

dependencies {
    implementation 'cn.onestravel.one:one_bottom_navigationbar:1.1.1'
}

jitPack

VERSION: VERSION

• 在項(xiàng)目中的根目錄下的 build.gradle (與model同級(jí)的) 中增加如下配置

    allprojects {
        repositories {
            ...
            maven { url 'https://jitpack.io' }
        }
    }

• 在model 中的build.gradle 中增加依賴

dependencies {
    implementation 'com.github.onestravel:OneBottomNavigationBar:VERSION'
}

例如：

dependencies {
     implementation 'com.github.onestravel:OneBottomNavigationBar:1.1.1'
}

屬性說明

OneBottomNavigationBar 屬性說明

示例1:不需要浮動(dòng)（凸起）的菜單杯矩，圖1效果

    <cn.onestravel.navigation.view.OneBottomNavigationBar
        android:id="@+id/BottomLayout"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:background="@android:color/white"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        app:menu="@menu/navigation_menu">

    </cn.onestravel.navigation.view.OneBottomNavigationBar>
    

示例2:需要浮動(dòng)（凸起）的菜單栈虚，圖2效果

 <cn.onestravel.navigation.view.OneBottomNavigationBar
        android:id="@+id/BottomLayout"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:background="@android:color/white"
        android:paddingTop="5dp"
        android:paddingBottom="5dp"
        app:floatingEnable="true"
        app:floatingUp="25dp"
        app:menu="@menu/navigation_menu">

    </cn.onestravel.navigation.view.OneBottomNavigationBar>

menu 菜單屬性值說明

示例1:不需要浮動(dòng)（凸起）的菜單丐膝，圖1效果

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/tab1"
        android:icon="@drawable/bar_news"
        android:title="首頁(yè)"></item>
    <item
        android:id="@+id/tab2"
        android:icon="@drawable/bar_constact"
        android:title="聯(lián)系人"></item>
    <item
        android:id="@+id/tab5"
        android:icon="@drawable/tab_manage_selected"
        android:title="拍照"></item>
    <item
        android:id="@+id/tab3"
        android:icon="@drawable/bar_invite"
        android:title="發(fā)現(xiàn)"></item>
    <item
        android:id="@+id/tab4"
        android:icon="@drawable/bar_my"
        android:title="我的"></item>
</menu>

示例2:需要浮動(dòng)（凸起）的菜單量愧，圖2效果

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/tab1"
        android:icon="@drawable/bar_news"
        android:title="首頁(yè)"></item>
    <item
        android:id="@+id/tab2"
        android:icon="@drawable/bar_constact"
        android:title="聯(lián)系人"></item>
    <item
        android:id="@+id/tab5"
        android:icon="@drawable/tab_manage_selected"
        android:title="拍照"
        app:floating="true"
        android:checkable="false"></item>
    <item
        android:id="@+id/tab3"
        android:icon="@drawable/bar_invite"
        android:title="發(fā)現(xiàn)"></item>
    <item
        android:id="@+id/tab4"
        android:icon="@drawable/bar_my"
        android:title="我的"></item>
</menu>

設(shè)置點(diǎn)擊切換監(jiān)聽

在NavigationBar的Tab進(jìn)行切換時(shí)钾菊，會(huì)回調(diào)改方法，可進(jìn)行相應(yīng)處理偎肃，如：未讀消息數(shù)設(shè)置

        bottomView.setOnItemSelectedListener(new OneBottomNavigationBar.OnItemSelectedListener() {
                    @Override
                    public void onItemSelected(OneBottomNavigationBar.Item item, int position) {
                        if(position==2){
                            bottomView.setFloatingEnable(true);
                        }else {
                            bottomView.setFloatingEnable(false);
                        }
                    }
                });

添加Fragment進(jìn)行管理煞烫，點(diǎn)擊自動(dòng)切換

需要先設(shè)置FragmentManager管理器和加載Fragment的ViewGroup,一般為FrameLayout ,需要設(shè)置id;之后調(diào)用addFragment，為對(duì)應(yīng)的Tab添加Fragment,

        bottomView.setFragmentManager(getFragmentManager(),mainFragment);
        bottomView.addFragment(R.id.tab1,new FirstFragment());
        bottomView.addFragment(R.id.tab2,new SecondFragment());
        bottomView.addFragment(R.id.tab3,new ThirdFragment());
        bottomView.addFragment(R.id.tab4,new FourFragment());
        bottomView.addFragment(R.id.tab5,new FiveFragment());

版本更新說明

1.0.2

• 初版實(shí)現(xiàn)自定義底部導(dǎo)航欄

1.0.3

• 在原基礎(chǔ)上對(duì)封裝進(jìn)行優(yōu)化累颂，支持代碼實(shí)現(xiàn)導(dǎo)航欄

1.0.4

• 優(yōu)化選中突出效果滞详，支持選中放大，支持導(dǎo)航欄背景圓角

1.0.5

• 可以自定義導(dǎo)航欄文字大小
• 可以自定義圖標(biāo)的寬度和高度
• 自定義圖標(biāo)和文字間隔高度

1.0.6

• 可以Java Api 設(shè)置導(dǎo)航欄文字大小
• 可以Java Api 設(shè)置圖標(biāo)的寬度和高度
• Java Api 設(shè)置圖標(biāo)和文字間隔高度
• 支持管理Fragment ,實(shí)現(xiàn)Fragment點(diǎn)擊自動(dòng)切換

1.1.0

• 更換屬性紊馏，部分屬性前增加one前綴料饥，解決屬性沖突問題
• BottomNavigationBar 更換為 OneBottomNavigationBar
• 增加頂部分割線顏色屬性，可設(shè)置分割線顏色(或透明色)

1.1.1

• 開發(fā)語(yǔ)言更換為 kotlin
• 新增使用androidx.fragment.app.Fragment和androidx.fragment.app.FragmentManager管理fragment的支持朱监，
  包路徑為：cn.onestravel.one.navigation.androidx.OneBottomNavigationBar
• 在jcenter上發(fā)布新包

溫馨提示：

在使用過程中岸啡，如遇到任何問題，可進(jìn)行留言赫编，發(fā)送簡(jiǎn)信或發(fā)送郵件至server@onestravel.cn說明相關(guān)問題巡蘸，我在看到問題的第一時(shí)間，會(huì)針對(duì)相應(yīng)問題進(jìn)行溝通解決擂送，謝謝支持悦荒！

個(gè)人博客：https://blog.onestravel.cn
Github: https://github.com/onestravel