Android TabLayout基本使用及完美调整指示器位置的技巧

在应用中,我们经常遇到多个页签切换的需求,这个时候往往使用viewPager+TabLayout实现,但官方的TabLayout使用时往往不满足我们的需求,例如不能修改指示器长度的问题,本文利用巧妙的方法来解决

  • 基本使用
    在XML里这样用

     	 
     
     
     
     
    
    
      
    

一个TabLayout 包含你需要的若干个TabItem 可以直接在TabItem里定义每个Item的标题text,也可以在代码里使用重写的Adapter的getpageTitle设置

TabItem没有什么特殊设置,指示器以及每个页签的设置都在TabLayout里

  1. 特殊用法
    修改item宽度:通常使用时,每个item都是拥挤在中间紧挨着的,如果想让每个item平分宽度可以这样使用,在TabLayout里设置如下属性:

    app:tabMaxWidth="0dp"
    app:tabGravity="fill"
    app:tabMode="fixed"
    

然后TabLayout的宽度是match_parent
ItemLayout的宽度是wrap_content
修改文字颜色和大小
在TabLayout里无法直接用属性设置字体大小,可以使用app:tabTextAppearance属性来设置字体的属性

在style里设置


 然后在TabLayout里引用
 app:tabTextAppearance="@style/TabLayoutTextStyle"

textAllCaps为设置文字是英文的时候全部大写
android:textStyle设置文字加粗
文字颜色可以在style里设置也可以直接在TabLayout里进行设置

tabTextColor=""

通常情况下会设置一个TabLayout的Style



tabIndicatorColor设置指示器颜色
tabIndicatorHeight设置指示器高度
tabTextColor 设置文字颜色

修改指示器宽度:
默认情况下,指示器是跟着文字宽度来调整的,如果想铺满每个宽度则
有很多人喜欢用反射的方法去进行设置指示器的宽度,但是反射的方法用到了TabLayout的成员变量命名,新的TabLayout已经换了,经过测试无效,也懒得研究新的实现方法,这里采用一个投机取巧的方法来设置指示器的宽度

在TabLayout里有一个属性tabIndicatorFullWidth=true/false 当为true的时候,指示器的宽度为每个Item的宽度,如果是false的话,指示器的宽度是文字的宽度,这里设置为false,就是指示器的宽度是文字的宽度

然后在文字定义的地方使用空格占位符

 

在string资源文件内使用占位符的方法为

Notice  

需要几个空格就添加几个占位符
这里在文字的左右两端都添加相同数量的空格占位符
然后就可以实现指示器比文字宽又比每个Item的总宽度窄的现象

有时候每个Item之间有间距,也可以通过这种方式让视觉上出现间距的现象,实际上每个Item还是紧挨着的

你可能感兴趣的:(Android,android)