Android 自定义底部导航栏BottomNavigation

作者: sugarkawhi | 来源:发表于2018-08-17 16:40 被阅读698次

    BottomNavigationbar

    源码地址

    使用

    dependencies {
      compile 'me.sugarkawhi:BottomNavigationBar:1.2.1'
    }
    

    功能

    • 支持 图片+文字 组合
    • 支持 仅图片
    • 支持 未读消息
    • 支持 自定义布局
    • 支持 切换动画(可关闭)
    • 支持 选中tab再次点击事件(多用于返回顶部或刷新)

    预览

    图片+文字
    图片+文字

    仅图片

    仅图片

    支持消息

    支持消息

    支持切换动画

    切换动画

    使用

      <me.sugarkawhi.bottomnavigationbar.BottomNavigationBar
            android:id="@+id/bottomNavigationBar"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_gravity="bottom"
            app:bnb_layoutId="@layout/bnb_item_view"
            app:bnb_selectedColor="#000000"
            app:bnb_unSelectedColor="#999999"
            app:bnb_anim="false"
            app:bnb_scale_ratio="1.1" />
    

    属性说明

    属性名 描述
    bnb_layoutId 自定义Item布局文件 此项必须设置
    bnb_selectedColor 选中字体颜色 默认#000000
    bnb_unSelectedColor 未选中字体颜色 默认#999999
    bnb_anim 是否开启动画 默认false
    bnb_scale_ratio 开启动画后缩放程度 默认1.1f anim为false不生效

    说明: bnb_layoutId 布局文件有严格的要求,否则出错

    • ImageView id 必须为 bnb_item_icon
    • 如果是图片+文字 添加TextView 并且其id 必须为 bnb_item_text
    • 如果是未读消息 添加 TextView 并且其id 必须为bnb_item_badge

    步骤

    STEP1 创建BottomNavigationEntity的列表
     List<BottomNavigationEntity> mEntities = new ArrayList<>();
    
            mEntities.add(new BottomNavigationEntity(
                    "图片",
                    R.drawable.ic_tab_album_default,
                    R.drawable.ic_tab_album_selected));
            mEntities.add(new BottomNavigationEntity(
                    "视频",
                    R.drawable.ic_tab_img_default,
                    R.drawable.ic_tab_img_selected));
            mEntities.add(new BottomNavigationEntity(
                    "关注",
                    R.drawable.ic_tab_news_default,
                    R.drawable.ic_tab_news_selected));
            mEntities.add(new BottomNavigationEntity(
                    "我的",
                    R.drawable.ic_tab_avatar_default,
                    R.drawable.ic_tab_avatar_selected, 10));        
    
    STEP2 创建BottomNavigationEntity的列表
     bottomNavigationBar.setEntities(mEntities);
    
    
    STEP3 设置监听
        //点击item
         bottomNavigationBar.setBnbItemSelectListener(new BottomNavigationBar.IBnbItemSelectListener() {
    
                @Override
                public void onBnbItemSelect(int position) {
    
                }
            });
            //重复点击
            bottomNavigationBar.setBnbItemDoubleClickListener(new BottomNavigationBar.IBnbItemDoubleClickListener() {
                @Override
                public void onBnbItemDoubleClick(int position) {
                }
            });
            
    

    相关文章

      网友评论

        本文标题:Android 自定义底部导航栏BottomNavigation

        本文链接:https://www.haomeiwen.com/subject/vhdtiftx.html