項目中經(jīng)常用到的一個模塊，有需要自己get喲Ｔ毒恕Ｈ蚧住痕钢！
二話不說先上圖，沒圖說個czＰ蛄Ｈ瘟！
如果有幫到你难咕，那么請繼續(xù)课梳！
項目的GitHub地址：https://github.com/roughike/BottomBar
需要示例中沉浸式狀態(tài)欄效果的請移步：http://www.reibang.com/p/c93cf1f07ab4
1.添加依賴
在build.gradle(app)的dependencies中添加
compile? 'com.roughike:bottom-bar:2.3.1'
2.編寫MainActivity的布局文件
```
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
? ? xmlns:app="http://schemas.android.com/apk/res-auto"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? >
<android.support.v7.widget.Toolbar
? ? ? ? android:id="@+id/toolbar1"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="30dp"
? ? ? ? android:background="@color/colorAccent"
? ? ? ? >
? ? </android.support.v7.widget.Toolbar>
? ? <TextView
? ? ? ? android:id="@+id/top_tv"
? ? ? ? android:layout_below="@id/toolbar1"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="wrap_content"
? ? ? ? android:textSize="16sp"
? ? ? ? android:text="首頁"
? ? ? ? android:textColor="#fff"
? ? ? ? android:gravity="center"
? ? ? ? android:background="@color/colorAccent"/>
? ? <FrameLayout
? ? ? ? android:id="@+id/contentContainer"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="match_parent"
? ? ? ? android:layout_above="@+id/bottomBar" />
? ? <com.roughike.bottombar.BottomBar
? ? ? ? android:id="@+id/bottomBar"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="60dp"
? ? ? ? android:layout_alignParentBottom="true"
? ? ? ? app:bb_tabXmlResource="@xml/bottombar_tabs"
? ? ? ? android:background="#fff"
? ? ? ? app:bb_behavior="shifting"
? ? ? ? app:bb_inActiveTabColor="#888888"
? ? ? ? app:bb_activeTabColor="#000000"
? ? ? ? />
</RelativeLayout>
```
如果不需要點擊時的動畫效果，在布局文件中刪除?app:bb_behavior="shifting"此行即可余佃！
3.編寫bottombar_tabs.xml (底部導(dǎo)航的布局文件暮刃，即第二步的?app:bb_tabXmlResource="@xml/bottombar_tabs")
在res下面新建名為xml的文件夾，新建bottombar_tabs.xml文件
<tabs>
? ? <tab
? ? ? ? id="@+id/tab_home"
? ? ? ? icon="@mipmap/ic_home"
? ? ? ? title="首頁"
? ? ? ? badgeHidesWhenActive="true"
? ? ? ? />
? ? ? ? id="@+id/tab_vip"
? ? ? ? icon="@mipmap/ic_vip"
? ? ? ? title="會員"
? ? ? ? badgeHidesWhenActive="true"
? ? ? ? />
? ? ? ? id="@+id/tab_msg"
? ? ? ? icon="@mipmap/ic_msg"
? ? ? ? title="消息"
? ? ? ? badgeHidesWhenActive="true"
? ? ? ? />
? ? ? ? id="@+id/tab_my"
? ? ? ? icon="@mipmap/ic_my"
? ? ? ? title="我的"
? ? ? ? />
4.初始化控件以及監(jiān)聽事件
4.1 BottomBar?bottomBar = findViewById(R.id.bottomBar);
4.2 監(jiān)聽事件
代碼中case后面的控件id為bottombar_tabs.xml中的id
private void initBottomBar() {
bottomBar.setOnTabSelectListener(new OnTabSelectListener() {
@Override
? ? ? ? ? ? public void onTabSelected(@IdRes int tabId) {
switch (tabId) {
case R.id.tab_home:
if (null ==fragmentHome) {
fragmentHome = FragmentHome.newInstance();
? ? ? ? ? ? ? ? ? ? ? ? }
replaceFragment(fragmentHome);
? ? ? ? ? ? ? ? ? ? ? ? tv.setText("首頁");
//? ? ? ? ? ? ? ? ? ? ? ? Utils.PalyMusic(getApplication());
//? ? ? ? ? ? ? ? ? ? ? ? Utils.vibrate(getApplication());
? ? ? ? ? ? ? ? ? ? ? ? break;
? ? ? ? ? ? ? ? ? ? case R.id.tab_vip:
if (null ==fragmentVip) {
fragmentVip = FragmentVip.newInstance();
? ? ? ? ? ? ? ? ? ? ? ? }
replaceFragment(fragmentVip);
? ? ? ? ? ? ? ? ? ? ? ? tv.setText("會員精選");
break;
? ? ? ? ? ? ? ? ? ? case R.id.tab_msg:
if (null ==fragmentMsg) {
fragmentMsg = FragmentMsg.newInstance();
? ? ? ? ? ? ? ? ? ? ? ? }
replaceFragment(fragmentMsg);
? ? ? ? ? ? ? ? ? ? ? ? tv.setText("消息");
break;
? ? ? ? ? ? ? ? ? ? case R.id.tab_my:
if (null ==fragmentMy) {
fragmentMy = FragmentMy.newInstance();
? ? ? ? ? ? ? ? ? ? ? ? }
replaceFragment(fragmentMy);
? ? ? ? ? ? ? ? ? ? ? ? tv.setText("個人中心");
break;
? ? ? ? ? ? ? ? }
}
});
? ? }
5.編寫Fragment
public class FragmentMsgextends Fragment {
private PhotoViewpv;
? ? public FragmentMsg(){
}
public static FragmentMsgnewInstance(){
FragmentMsg fragmentHome =new FragmentMsg();
? ? ? ? return fragmentHome;
? ? }
@Override
? ? public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
? ? }
@Nullable
@Override
? ? public ViewonCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.msg_fragment,container,false);
//? ? ? ? pv = view.findViewById(R.id.photo_view);
//? ? ? ? pv.setImageResource(R.drawable.a);
? ? ? ? return view;
? ? }
}
以上就完成了底部導(dǎo)航欄模塊爆土， 快運行起來瞧一瞧Ｍ职谩！步势！
