一、效果展示
1. 效果图
a.2. 关联ViewPage
3. TabLayout固定选项卡或可滚动选项卡
4. TabLayout动态添加移除选项卡
5. 显示选项卡Badge
二、项目中使用
1. 在Gradle中引入(最新版本)
implementation 'com.liang.jtab:jtablayout:2.1.1'
2. 在Layout.xml中添加JTabLayout(2.x以上版本大多数属性对应原生TabLayout属性)
tabDividerColor 分割线颜色
tabDividerHeight 分割高度
tabDividerWidth 分割宽度 (默认为0，不显示分割线)
tabMode="fixed" 固定选项卡(fixed)或可滚动选项卡(scrollable)
tabTextColor 选项卡切换状态时的字体颜色
tabTextColorTransitionScroll 字体颜色改变方式: normal为默认 ,shadow为渐变
tabTextSize 选项卡字体大小
tabTextBold 选项卡选中时字体是否变粗
tabScaleTransitionScroll 选项卡选中时大小
tabIndicator 指示器
tabIndicatorColor 指示器颜色
tabIndicatorFullWidth 指示器宽度是否占满Item
tabIndicatorHeight 指示器高
tabIndicatorTransitionScroll 指示器滚动方式
tabIndicatorWidth 指示器宽
tabIndicatorTier 指示器在Item之上(front)或之下(back)
tabIndicatorAnimationDuration 指示器滚动时间(毫秒)
tabIndicatorGravity 指示器位置
tabIndicatorMargin 指示器外边距(对应tabIndicatorGravity->top 就是MarginTop 其余类似)
3. 添加选项卡(TabView)
1.添加默认TabView
Tab tabItem = tabLayout.newTab();//或 TabView tabItem = new TabView (context);
tabItem.setIcon(R.mipmap.tab_icon_hall_normal, R.mipmap.tab_icon_hall_selected);
tabItem.setTitle("娱乐");
tabLayout.addTab(tabItem );
2.添加自定义TabView
只是布局的改变可以直接继承TabView，重写initTabView()、setTabTitleView()、 setTabIconView()、setTabBadgeView()这三个方法即可
public class CustomTabView extends TabView {
private View tabView;
public CustomTabView (@NonNull Context context) {
super(context);
}
@Override
protected View initTabView() {
tabView = LayoutInflater.from(getContext()).inflate(R.layout.tab_menul,null,true);
return tabView;
}
@Override
protected TextView setTabTitleView() {
TextView title =tabView.findViewById(R.id.navigation_title);
return title;
}
@Override
protected ImageView setTabIconView() {
return null;
}
@Override
protected BadgeView setTabBadgeView() {
BadgeView badge =tabView.findViewById(R.id.navigation_badge);
return badge;
}
}
如果是要深度自定义就要继承Tab这个类，重写其对应的方法
4. 添加监听(addOnTabSelectedListener)
tabLayout.addOnTabSelectedListener(new OnTabSelectedListener() {
@Override
public void onTabSelected(int position) {
当切换时回调
}
@Override
public void onTabReselected(int position) {
当重复选中时回调
}
});
5. 添加指示器(这种添加指示器方式会覆盖掉xml中设置的属性)
val indicator = JIndicator()
tabLayout.setIndicator(indicator)
6. 显示角标(BadgeView)
tabLayout.showBadgeMsg(int position);只显示对应选项卡角标为圆点
tabLayout.showBadgeMsg(int position,int count); count大于0显示否则隐藏
tabLayout.showBadgeMsg(int position, String msg); msg不为""显示否则隐藏
三、属性说明
1.TabView
TabView.setIcon(R.mipmap.tab_icon_normal, R.mipmap.tab_icon_selected);选项卡图标
TabView.setTitle("娱乐");选项卡文本
TabView.setObject(Object);选项卡自定义内容
TabView.setTitleColor(); 选项卡切换状态时的字体颜色
TabView.setBackgroundRes(); 选项卡背景
TabView.setSelected(); 选项卡状态
TabView.setTextTransitionMode();字体颜色改变方式
TabView.setBold();选项卡选中时字体是否变粗
TabView.setTextSize();选项卡字体大小
TabView.setBadgeTextColor();选项卡角标的字体颜色
TabView.setBadgeTextSize();选项卡角标的字体大小
TabView.setBadgeColor();选项卡角标的背景颜色
TabView.setBadgeStroke(width,color);选项卡角标的边框宽度和边框颜色
2.JIndicator
JIndicator.setGravity(int gravity);设置Indicator的位置（上、中、下）
JIndicator.setWidthScale(float widthScale);设置Indicator的宽度占选项卡宽度的比列
JIndicator.setWidth(int width);设置Indicator的宽度
JIndicator.setHeight(int height);设置Indicator的高度
JIndicator.setTransitionScroll(boolean transitionScroll);设置Indicator移动方式
JIndicator.setColor(@ColorInt int color);设置Indicator的颜色
此项目根据官方TabLayout实现并进行扩展，项目地址JTabLayout