（炫酷）比BottomTabBar还好用的底部导航栏（JPTabBar）

最新推荐文章于 2025-10-22 13:11:22 发布

原创最新推荐文章于 2025-10-22 13:11:22 发布 · 856 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Android

本文详细介绍了如何在Android应用中使用JPTabBar库创建自定义的底部导航栏，包括导入依赖、布局配置、代码实现及属性设置等关键步骤。

导入依赖：

compile 'com.jpeng:JPTabBar:1.1.4'

添加JPTabBar到你的主界面布局：

<com.jpeng.jptabbar.JPTabBar

android:id="@+id/jptab"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="#fff"

app:TabNormalColor="#000"

app:TabSelectColor="#EC0D0D"

app:TabTextSize="15sp"

app:TabIconSize="34dp"

app:TabHeight="65dp"

在主界面使用注解声明数组变量,内部通过反射来生成TabItem

（注意的是:NorIcons和Titles是必须的,每个数组长度要保持一致）

@Titles

private static final String[] mTitles = {"资讯","记录","商品街","我的"};

@SeleIcons

private static final int[] mSeleIcons = {R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher,R.mipmap.ic_launcher};

@NorIcons

private static final int[] mNormalIcons = {R.mipmap.f1, R.mipmap.f2, R.mipmap.f3, R.mipmap.f4};

如果要实现Wechat那种渐变还有自动让ViewPager改变页面的功能的话,只需要在Activity oncreate方法里面,添加一行代码:

//传入一定要集成继承ViewPager

mTabbar.setContainer(mPager);

public class Adapter extends FragmentPagerAdapter {
    private List<Fragment> list;

    public Adapter(FragmentManager fm, List<Fragment> list) {
        super(fm);
        this.list = list;
    }

    @Override
    public Fragment getItem(int position) {
        return list.get(position);
    }


    @Override
    public int getCount() {
        return list.size();
    }
}

具体属性：

结点名字	结点说明	参数类型	默认值
TabHeight	TabBar的高度,将会覆盖layout_height的设置	dimension	56dp
TabNormalColor	字体和图标的未选中颜色	color	0xffAEAEAE(灰色)
TabSelectColor	字体和图标的选中的颜色	color	0xff59D9B9(青色)
TabTextSize	Tab底部文件大小	dimension	14sp
TabIconSize	Tab图标的大小	dimension	24dp
TabIconFilter	设置图标是否随着字体颜色而改变	boolean	true
TabMargin	设置图标距离上面和文字距离下面的距离	dimension	8dp
TabSelectBg	设置TabBarItem选中的背景颜色	color	透明
TabAnimate	Tab切换的动画类型	enum	Scale
TabMiddleIcon	Tab中间的图标	drawable	无
BadgeColor	徽章的背景颜色	color	#f00(红色)
BadgeDraggable	徽章是否可以拖动	boolean	false
BadgePadding	徽章的背景扩展距离	dimension	4dp
BadgeTextSize	徽章显示的字体大小	dimension	11dp
BadgeMargin	徽章距离右边边缘的间隔	dimension	9dp