当前位置: 首页 > 工具软件 > JPTabBar > 使用案例 >

(炫酷)比BottomTabBar还好用的底部导航栏(JPTabBar)

陆飞捷
2023-12-01

导入依赖:

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

 类似资料: