前言

Android的底部导航栏,如下图

其实有多种实现方式,可以用RadioGroup,LinearLayout+TextVIew,也可以用TabHost实现。Google官方一直没有现成的导航组件。但是Google在自己推出的Material design中增加了Bottom Navigation导航控制,下面附上Google官方的BottomNavigationBar的链接https://github.com/Ashok-Varma/BottomNavigation

本文现在用BottomNavigationBar来实现,先看一下效果图:

项目源码:https://github.com/baojie0327/SsrjMvp

1 引入BottomNavigationBar
  compile 'com.ashokvarma.android:bottom-navigation-bar:2.0.3'
2 在xml文件中引入布局
 <com.ashokvarma.bottomnavigation.BottomNavigationBar        android:id="@+id/bottom_navigation_bar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true">com.ashokvarma.bottomnavigation.BottomNavigationBar>
3 设置状态,背景颜色等
 // TODO 设置模式        mBottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);        // TODO 设置背景色样式        mBottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_STATIC);        mBottomNavigationBar.setBarBackgroundColor(R.color.background_gray_color);
三种模式:
  • MODE_DEFAULT
    如果Item的个数<=3就会使用MODE_FIXED模式,否则使用MODE_SHIFTING模式

  • MODE_FIXED (固定大小)
    填充模式,未选中的Item会显示文字,没有换挡动画。
    宽度=总宽度/action个数
    最大宽度: 168dp
    最小宽度: 80dp
    Padding:6dp(8dp)、10dp、12dp
    字体大小:12sp、14sp

  • MODE_SHIFTING (不固定大小)
    换挡模式,未选中的Item不会显示文字,选中的会显示文字。在切换的时候会有一个像换挡的动画

三种Style
  • 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这个设置的颜色

MODE_FIXED MODE_SHIFTING
BACKGROUND_STYLE_STATIC
BACKGROUND_STYLE_RIPPLE
4 设置Badges,一般用于消息提醒
 mTextBadgeItem = new TextBadgeItem()                .setBorderWidth(4)                .setBackgroundColorResource(R.color.main_color)                .setText("5")                .setTextColorResource(R.color.white)                .setBorderColorResource(R.color.colorPrimaryDark)  //外边界颜色                .setHideOnSelect(false);        mShapeBadgeItem = new ShapeBadgeItem()                .setShape(ShapeBadgeItem.SHAPE_OVAL)                .setShapeColor(R.color.main_color)                .setShapeColorResource(R.color.main_color)                .setSizeInDp(this,10,10)                .setEdgeMarginInDp(this,2)//                .setSizeInPixels(30,30)//                .setEdgeMarginInPixels(-1)                .setGravity(Gravity.TOP | Gravity.END)                .setHideOnSelect(false);
5 设置BottomNavigationBar
 mBottomNavigationBar                .addItem(new BottomNavigationItem(R.mipmap.tab_home_pressed, "首页").setActiveColorResource(R.color.main_color).setInactiveIconResource(R.mipmap.tab_home_normal).setInActiveColorResource(R.color.icon_color))                .addItem(new BottomNavigationItem(R.mipmap.tab_benefits_check, "资讯").setActiveColorResource(R.color.main_color).setInactiveIconResource(R.mipmap.tab_benefits_check_no).setInActiveColorResource(R.color.icon_color).setBadgeItem(mShapeBadgeItem))                .addItem(new BottomNavigationItem(R.mipmap.tab_mine, "我的").setActiveColorResource(R.color.main_color).setInactiveIconResource(R.mipmap.tab_mine_off).setInActiveColorResource(R.color.icon_color).setBadgeItem(mTextBadgeItem))                .setFirstSelectedPosition(lastSelectedPosition)                .initialise();
6设置监听
  mBottomNavigationBar.setTabSelectedListener(this);
 @Override    public void onTabSelected(int position) {        lastSelectedPosition = position;        //开启事务        mTransaction = mManager.beginTransaction();        hideFragment(mTransaction);        /**         * fragment 用 add + show + hide 方式         * 只有第一次切换会创建fragment,再次切换不创建         *         * fragment 用 replace 方式         * 每次切换都会重新创建         *         */        switch (position){            case 0:                if (mNearbyFragment == null) {                    mNearbyFragment = new NearbyFragment();                    mTransaction.add(R.id.ll_content,                            mNearbyFragment);                } else {                    mTransaction.show(mNearbyFragment);                }                break;            case 1:                if (mDisCountFragment == null) {                    mDisCountFragment = new DisCountFragment();                    mTransaction.add(R.id.ll_content,                            mDisCountFragment);                } else {                    mTransaction.show(mDisCountFragment);                }                break;            case 2:                isLogin=mSharedPreferencesUtil.getBoolean(SharedPreferencesUtil.LOGIN_STATUS, false);                if (isLogin==false){                    Intent intent=new Intent(MainActivity.this, LoginActivity.class);                    startActivity(intent);                }else {                    if (mMineFragment == null) {                        mMineFragment = new MineFragment();                        mTransaction.add(R.id.ll_content,                                mMineFragment);                    } else {                        mTransaction.show(mMineFragment);                    }                }                break;        }        // 事务提交        mTransaction.commit();      //  mTransaction.commitAllowingStateLoss();    }    @Override    public void onTabUnselected(int position) {    }    @Override    public void onTabReselected(int position) {    }

代码下载:https://github.com/baojie0327/SsrjMvp

更多相关文章

  1. android EditText设置不可写
  2. Android系统配置数据库注释(settings.db)
  3. android“设置”里的版本号
  4. 在Fragment中设置控件点击方法,执行失败。
  5. Android(安卓)闹钟管理类的使用
  6. Android设置通知栏/状态栏透明改变通知栏颜色和app最上部分颜色
  7. android 设置中划线 下划线等
  8. Andorid Dialog 示例【慢慢更新】
  9. android图表ichartjs

随机推荐

  1. Android日志收集
  2. 开机动画(闪动的ANDROID字样的动画图片)
  3. textview中加链接
  4. Android中同时选择日期和时间
  5. [Android] AsyncTask使用实例---加载网络
  6. Android(安卓)TextView中文字通过Spannab
  7. Android的SQLite----重新认识Android(10)
  8. Android之TextView
  9. seekBar,RatingBar拖动条
  10. Android图形显示系统——一张图片的显示