第三方BottomBar的使用

地址:https://github.com/roughike/BottomBar
使用方式: compile ‘com.roughike:bottom-bar:2.0.2’
布局中使用

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.yanruifeng.myapplication.TestThirdBottomBarActivity">
<com.roughike.bottombar.BottomBar
    android:id="@+id/bb_bar"
    android:layout_alignParentBottom="true"
    android:layout_width="match_parent"
    app:bb_tabXmlResource="@xml/nav"
    app:bb_activeTabAlpha="1"
    app:bb_activeTabColor="@color/color_checked"
    android:layout_height="56dp"></com.roughike.bottombar.BottomBar>
</RelativeLayout>

在res下新建xml目录,并且在xml目录下建立一个名叫nav.xml的文件

<?xml version="1.0" encoding="utf-8" ?>
<tabs>
    <tab
        id="@+id/home"
        icon="@drawable/nav_homeicon_change"
        title="首页" />
    <tab
        id="@+id/message"
        icon="@drawable/nav_msgicon_change"
        title="消息" />

    <tab
        id="@+id/my"
        icon="@drawable/nav_myicon_change"
        title="我的"/>

</tabs>
  • 以上需要注意的问题是 你的tab 属性不能用 andoroid:id android:icon android:title 否则后果自负
  • 即不能引入xmlns:android=”http://schemas.android.com/apk/res/android” 命名空间
    在drawable目录下建立各个相应选中与不选中的导航 菜单 例如 我写了三个
    nav_homeicon_change.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/home_selected"></item>
    <item android:state_selected="false" android:drawable="@drawable/home"></item>
</selector>

nav_msgicon_change.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/msg_selected"></item>
    <item android:state_selected="false" android:drawable="@drawable/msg"></item>
</selector>

nav_myicon_change.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:drawable="@drawable/my_selected"></item>
    <item android:state_selected="false" android:drawable="@drawable/my"></item>
</selector>

在activity中使用如下代码即可完成 动态切换底部导航图标icon

public class TestThirdBottomBarActivity extends AppCompatActivity {
    @BindView(R.id.bb_bar)
    BottomBar bbbar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test_third_bottom_bar);
        ButterKnife.bind(this);
        bbbar.setOnTabSelectListener(new OnTabSelectListener() {
            @Override
            public void onTabSelected(int tabId) {
                for(int i=0;i<bbbar.getTabCount();i++){
                    bbbar.getTabAtPosition(i).setSelected(false);
                }
                switch (tabId){
                    case R.id.home:
                        bbbar.getTabAtPosition(0).setSelected(true);
                        break;
                    case R.id.message:
                        bbbar.getTabAtPosition(1).setSelected(true);
                        break;
                    case R.id.my:
                        bbbar.getTabAtPosition(2).setSelected(true);
                        break;
                }
            }
        });
    }
}

觉得好的话 就给我点个赞吧! 谢谢了

猜你喜欢

转载自blog.csdn.net/qq_21937107/article/details/80157695