前面呢,有写过TabLayout的博客,最近开发用到了AndroidX来解决前面的问题,不要工具类设置下划线的问题了,来总结一下
Android--------TabLayout实现新闻客户端顶部导航栏
Android中Tablayout设置下划线宽度 和 dp和px之间进行相互转换
AndroidX效果图
首先添加依赖:
以前的是
implementation 'com.android.support:design:28.0.0'
换成
implementation "com.google.android.material:material:1.0.0"
现在的TabLayout有2种添加Item的方式
第一种和以前的差不多
Java代码
public class MainActivityB extends AppCompatActivity { static final int NUM_ITEMS = 4; private List fragmentList = new ArrayList(); private String[] strings = new String[]{"A","B","C","D"};
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);
setContentView(R.layout.activity_mainb);
fragmentList.add(new FragmentA());
fragmentList.add(new FragmentB());
fragmentList.add(new FragmentC());
fragmentList.add(new FragmentD());
initView();
} private void initView(){
TabLayout tab_layout = findViewById(R.id.tab_layout);
ViewPager viewPager = findViewById(R.id.viewPager);
MyAdapter fragmentAdater = new MyAdapter(getSupportFragmentManager());
viewPager.setAdapter(fragmentAdater);
tab_layout.setupWithViewPager(viewPager);
} public class MyAdapter extends FragmentPagerAdapter { public MyAdapter(FragmentManager fm) { super(fm);
}
@Override public int getCount() { return NUM_ITEMS;
}
@Override public Fragment getItem(int position) { return fragmentList.get(position);
}
@Nullable
@Override public CharSequence getPageTitle(int position) { return strings[position];
}
}
}
如果你不需要点击后的阴影动画效果,可以使用下面2个属性取消
app:tabBackground="@android:color/transparent" app:tabRippleColor="@android:color/transparent"
看布局里面有一个这样的属性
tabIndicatorFullWidth (boolean)
默认为true ,是否使选择指示器的宽度适合选项卡项目的整个宽度(意思就是将选择指示器宽度将设置为最小宽度值,就是字体的宽度)
这样就解决了之前的问题了,
属性详细介绍请看文档:https://developer.android.google.cn/reference/com/google/android/material/tabs/TabItem
第二种写法
这种是TabLayout 增加了一个TabItem控件,直接把Item写在里面了
这种也是很方便的,需要添加一个TabLayout的选中回调
tab_layout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override public void onTabSelected(TabLayout.Tab tab) { //选中某个tab }
@Override public void onTabUnselected(TabLayout.Tab tab) { //当tab从选择到未选择
}
@Override public void onTabReselected(TabLayout.Tab tab) { //已经选中tab后的重复点击tab
}
});
其他属性
app:tabIndicatorColor :指示线的颜色
app:tabIndicatorHeight : 指示线的高度
app:tabIndicatorFullWidth="false" 指示线是否铺满宽度
app:tabSelectedTextColor : tab选中时的字体颜色
app:tabTextColor="@color/colorPrimary" :未选中字体颜色
app:tabBackground="color" : 整个tablayout颜色
app:tabMode="scrollable" : 默认是fixed,固定的;scrollable:可滚动的
参考的官方详细文档地址: https://developer.android.google.cn/reference/com/google/android/material/tabs/TabLayout
参考:https://www.cnblogs.com/zhangqie/p/11759690.html