博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
底部导航栏使用BottomNavigationBar
阅读量:7122 次
发布时间:2019-06-28

本文共 7883 字,大约阅读时间需要 26 分钟。

1.github地址

2.基本使用

2,1添加依赖

implementation 'com.ashokvarma.android:bottom-navigation-bar:2.0.5'

  

2.2布局中使用

  

2.3代码中设置

/**         * 导航基础设置 包括按钮选中效果 导航栏背景色等         */        bottomNavigationBar.setTabSelectedListener(this)                .setMode(BottomNavigationBar.MODE_FIXED)                .setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC)                .setActiveColor("#ffffff")//选中颜色                .setInActiveColor("#2B2B2B")//未选中颜色                .setBarBackgroundColor("#EDC18E");//导航栏背景色        badgeItem = new TextBadgeItem()                .setBorderWidth(2)                .setTextColor(Color.BLACK)                .setBackgroundColor(Color.RED)                .setText("99");         /**         *添加导航按钮         */        bottomNavigationBar.addItem(new BottomNavigationItem(R.mipmap.home,"首页"))                .addItem(new BottomNavigationItem(R.mipmap.setting,"设置"))                .addItem(new BottomNavigationItem(R.mipmap.menu,"菜单").setInActiveColor("#ffff00"))                .addItem(new BottomNavigationItem(R.mipmap.person,"个人").setBadgeItem(badgeItem))//添加小红点数据                .initialise();//initialise 一定要放在 所有设置的最后一项

  

2.4添加监听

bottomNavigationBar.setTabSelectedListener(new BottomNavigationBar.OnTabSelectedListener() {//这里也可以使用SimpleOnTabSelectedListener         @Override         public void onTabSelected(int position) {//未选中 -> 选中         }         @Override         public void onTabUnselected(int position) {//选中 -> 未选中         }         @Override         public void onTabReselected(int position) {//选中 -> 选中         }     });

  

3.知识点,用法说明。

3.1设置导航栏模式:setMode()

setMode() 内的参数有三种模式类型:     MODE_DEFAULT 自动模式:导航栏Item的个数<=3 用 MODE_FIXED 模式,否则用 MODE_SHIFTING 模式     MODE_FIXED 固定模式:未选中的Item显示文字,无切换动画效果。     MODE_SHIFTING 切换模式:未选中的Item不显示文字,选中的显示文字,有切换动画效果。

  

 

3.2设置导航栏背景模式:setBackgroundStyle()

setBackgroundStyle() 内的参数有三种样式   BACKGROUND_STYLE_DEFAULT: 默认样式 如果设置的Mode为MODE_FIXED,将使用BACKGROUND_STYLE_STATIC,如果Mode为MODE_SHIFTING将使用BACKGROUND_STYLE_RIPPLE。   BACKGROUND_STYLE_STATIC: 静态样式 点击无波纹效果,航条的背景色是白色,加上setBarBackgroundColor()可以设置成你所需要的任何背景颜色   BACKGROUND_STYLE_RIPPLE: 波纹样式 点击有波纹效果,导航条的背景色是你设置的处于选中状态的 Item的颜色(ActiveColor),也就是setActiveColorResource这个设置的颜色

  

3.3设置默认颜色

bottomNavigationBar              .setActiveColor("#ff0000") //设置选中的颜色              .setInActiveColor("#FFFFFF")//设置选中的颜色              .setBarBackgroundColor("#000000");//设置bar背景in-active color:表示未选中Item中的图标和文本颜色。默认为 Color.LTGRAYactive color :在BACKGROUND_STYLE_STATIC下,表示选中Item的图标和文本颜色。而在BACKGROUND_STYLE_RIPPLE下,表示整个容器的背景色。默认Theme's Primary Colorbackground color :在BACKGROUND_STYLE_STATIC下,表示整个容器的背景色。而在BACKGROUND_STYLE_RIPPLE下,表示选中Item的图标和文本颜色。默认 Color.WHITE

  

3.4定制Item的选中未选中颜色

//设置Item未选中颜色方法new BottomNavigationItem().setInActiveColorResource(R.color.white)) 或者new BottomNavigationItem().setInActiveColor() //设置Item选中颜色方法new BottomNavigationItem().setActiveColorResource()或者new BottomNavigationItem().setActiveColor()

  

3.5Icon的定制

如果使用颜色的变化不足以展示一个选项Item的选中与非选中状态,可以使用BottomNavigationItem.setInActiveIcon()方法来设置。

.addItem(new BottomNavigationItem(R.mipmap.menu,"菜单").setInActiveColor("#ffff00"))

 

3.6手动隐藏与显示

bottomNavigationBar.hide();//隐藏bottomNavigationBar.hide(true);//隐藏是否启动动画,这里并不能自定义动画bottomNavigationBar.unHide();//显示bottomNavigationBar.hide(true);//隐藏是否启动动画,这里并不能自定义动画

  

 

3.7为Item添加Badge,一般用作消息提醒的

badgeItem = new TextBadgeItem()                .setBorderWidth(2)//Badge的Border(边界)宽度                .setBorderColor(Color.BLUE)//Badge的Border颜色                .setBackgroundColor(Color.RED)                .setTextColor(Color.BLACK)//文本颜色                .setGravity(Gravity.RIGHT| Gravity.TOP)//位置,默认右上角                .setAnimationDuration(2000)                .setHideOnSelect(true)//当选中状态时消失,非选中状态显示                .setText("99");
shapeBadgeItem=new ShapeBadgeItem()         .setShape(SHAPE_OVAL) //形状         .setShapeColor(Color.BLUE) //颜色         .setShapeColorResource(R.color.colorPrimaryDark) //颜色,资源文件获取         .setEdgeMarginInDp(this,0) //距离Item的margin,dp         .setEdgeMarginInPixels(20) //距离Item的margin,px         .setSizeInDp(this,10,10) //宽高,dp         .setSizeInPixels(5,5) //宽高,px         .setAnimationDuration(200) //隐藏和展示的动画速度,单位毫秒,和setHideOnSelect一起使用         .setGravity(Gravity.LEFT) //位置,默认右上角         .setHideOnSelect(true); //true:当选中状态时消失,非选中状态显示,moren false

  

4案例

public class MainActivity extends AppCompatActivity implements BottomNavigationBar.OnTabSelectedListener {    private BottomNavigationBar bottomNavigationBar;    private HomeFragment homeFragment;    private PersonFragment personFragment;    private SettingFragment settingFragment;    private MenuFragment menuFragment;    private FragmentManager fm;    private TextBadgeItem badgeItem;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        bottomNavigationBar=findViewById(R.id.bottom_nav_bar);        fm=getFragmentManager();        initBottomBar();    }    private void initBottomBar() {        /**         * 导航基础设置 包括按钮选中效果 导航栏背景色等         */        bottomNavigationBar.setTabSelectedListener(this)                .setMode(BottomNavigationBar.MODE_FIXED)                .setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC)                .setActiveColor("#ffffff")//选中颜色                .setInActiveColor("#2B2B2B")//未选中颜色                .setBarBackgroundColor("#EDC18E");//导航栏背景色        badgeItem = new TextBadgeItem()                .setBorderWidth(2)//Badge的Border(边界)宽度                .setBorderColor(Color.BLUE)//Badge的Border颜色                .setBackgroundColor(Color.RED)                .setTextColor(Color.BLACK)//文本颜色                .setGravity(Gravity.RIGHT| Gravity.TOP)//位置,默认右上角                .setAnimationDuration(2000)                .setHideOnSelect(true)//当选中状态时消失,非选中状态显示                .setText("99");         /**         *添加导航按钮         */        bottomNavigationBar.addItem(new BottomNavigationItem(R.mipmap.home,"首页"))                .addItem(new BottomNavigationItem(R.mipmap.setting,"设置"))                .addItem(new BottomNavigationItem(R.mipmap.menu,"菜单").setInActiveColor("#ffff00"))                .addItem(new BottomNavigationItem(R.mipmap.person,"个人").setBadgeItem(badgeItem))//添加小红点数据                .initialise();//initialise 一定要放在 所有设置的最后一项        //设置默认导航栏        homeFragment=HomeFragment.newInstance("首页");        fm.beginTransaction().replace(R.id.fl,homeFragment).commit();    }    /**     * 设置选中逻辑     */    @Override    public void onTabSelected(int position) {        FragmentTransaction transaction = fm.beginTransaction();        switch (position){            case 0:                if(homeFragment==null){                    homeFragment=new HomeFragment();                }                transaction.replace(R.id.fl,homeFragment);                break;            case 1:                if(settingFragment==null){                    settingFragment=new SettingFragment();                }                transaction.replace(R.id.fl,settingFragment);                break;            case 2:                if(menuFragment==null){                    menuFragment=new MenuFragment();                }                badgeItem.setText("4");                transaction.replace(R.id.fl,menuFragment);                break;            case 3:                if(personFragment==null){                    personFragment=new PersonFragment();                }                transaction.replace(R.id.fl,personFragment);                break;            default:                break;        }        transaction.commit();    }    /**     * 设置未选中逻辑     */    @Override    public void onTabUnselected(int position) {    }    /**     * 设置释放逻辑     */    @Override    public void onTabReselected(int position) {    }}

  

 

参考:

1.

2.

3.

 

转载于:https://www.cnblogs.com/wangjiaghe/p/9742921.html

你可能感兴趣的文章
AWK中的位操作
查看>>
如何养成良好的c++编程习惯(1)——内存管理
查看>>
利用代理实现SSL劫持的一点猜想
查看>>
ReSharper制作Template帮助我们快速输入代码
查看>>
《深入浅出数据分析》读书笔记
查看>>
使用 HttpModel与现有基于共享登录信息( Cookie )的网站进行集成
查看>>
TCC : Tiny C Compiler
查看>>
分享:Verizon 的程序员将自己的工作外包给中国
查看>>
SQL Server误区30日谈-Day22-资源调控器可以调控IO
查看>>
Log4j创建日志服务器 解决集群日志问题及话单文件
查看>>
sdut 1451 括号东东 DP
查看>>
WCF服务在高负载下可能会变慢
查看>>
【sas notes】proc sgplot
查看>>
c++中 typename 和 class 的区别
查看>>
Script:诊断MTS shared server
查看>>
Oracle Partitioning分区技术历年新特性回顾
查看>>
oracle 好书 03 ( 数据字典 )
查看>>
sqlserver 时间格式转换 以及字符串转日期
查看>>
协议与委托
查看>>
InfoQ 《架构师》电子刊4月刊推荐《windows 8应用开发权威指南》
查看>>