当前位置:   article > 正文

Android开发之可修改字体大小和指示器长度的XTabLayout_android tablayout 设置文字长度和指示器长度等宽

android tablayout 设置文字长度和指示器长度等宽

GitHub:https://github.com/AndroidKun/XTabLayout

集成步骤:

1.添加XTabLayout依赖库

在app目录下的build.gradle的dependencies中添加如下引用:

compile 'com.androidkun:XTabLayout:1.1.3'

2.在布局文件中设置XTabLayout属性:

  1. <com.androidkun.xtablayout.XTabLayout
  2. android:id="@+id/xTablayout"
  3. android:layout_width="match_parent"
  4. android:layout_height="130px"
  5. app:xTabBackgroundColor="@color/white"
  6. app:xTabDisplayNum="2"
  7. app:xTabDividerColor="#eee"
  8. app:xTabDividerHeight="130px"
  9. app:xTabDividerWidth="0.5dp"
  10. app:xTabIndicatorColor="@color/blue"
  11. app:xTabIndicatorHeight="2dp"
  12. app:xTabMode="fixed"
  13. app:xTabSelectedTextColor="@color/blue"
  14. app:xTabSelectedTextSize="15sp"
  15. app:xTabTextBold="false"
  16. app:xTabTextColor="#000"
  17. app:xTabTextSelectedBold="false"
  18. app:xTabTextSize="14sp" />

TabLayout有的属性,在XTabLayout中都会有,属性名称都是前面加个x,后面的t变成大写。

其中增加了xTabIndicatorWidth用于设置指示器长度,xTabTextSize用于设置未选中项的字体大小,xTabSelectedTextSize用于设置选中项的字体大小。

此外1.0.1以及后面的版本中添加如下属性可以设置屏幕范围内显示的Tab个数

app:xTabDisplayNum="3"

或则在代码中添加

  1. tabLayout.setxTabDisplayNum(3);//需要写在setupWithViewPager前
  2. tabLayout.setupWithViewPager(viewPager);

需要注意显示的个数会受Adapter的ItemCount影响,例如ItemCount为3,但是我们设置app:xTabDisplayNum=“4”,那么显示出来的Tab的宽度其实是屏幕的1/3,并非1/4。

3.初始化:

XTabLayout的使用方式和TabLayout是一样的,代码如下:

  1. //将TabLayout和ViewPager关联起来。
  2. XTabLayout tabLayout = (XTabLayout) findViewById(R.id.xTablayout);
  3. tabLayout.setupWithViewPager(viewPager);

更新日志

1.0.3

修改只有一个Tab时Tab未占满屏幕的bug。

1.0.4

增加设置Tab背景色的功能。

  1. app:xTabBackgroundColor="#fff"
  2. app:xTabSelectedBackgroundColor="#ff0"

两个属性分别对应Tab未选中和被选中的背景色,效果图如下:

这里写图片描述

1.0.5 & 1.0.6

增加设置指示器长度随Tab文本内容长度变化的功能。

使用方式:不设置xTabIndicatorWidth属性即可

1.0.7

增加设置标题字母大小写转换功能,默认小写不自动转大写

使用方式:在xml文件中添加app:xTabTextAllCaps=”false”或者在代码中调用xTabLayout.setAllCaps(false).

1.0.8

增加设置分割线功能

这里写图片描述

使用方式:

1.xml:

  1. app:xTabDividerWidth="2dp"
  2. app:xTabDividerHeight="15dp"
  3. app:xTabDividerColor="#000"
  4. app:xTabDividerGravity="center"

不设置xTabDividerHeight属性或者赋值为0时则分割线高度占满

2.java:

  1. tabLayout.setDividerSize(5,20);
  2. tabLayout.setDividerColor(Color.BLACK);
  3. tabLayout.setDividerGravity(DividerDrawable.CENTER);

setDividerSize方法中第二个参数为高度,如果设置为0时则分割线高度占满

1.0.9

优化设置指示器长度功能

使用方式:

a.明确指定指示器为某个长度则设置xTabIndicatorWidth

b.指定指示器长度跟随文本变化则设置xTabDividerWidthWidthText

c.如果需要指示器长度占满,则两个属性都不设置,默认占满。

1.1.0

增加设置字体粗体功能

这里写图片描述

使用方式:

  1. <!-- 设置选中Tab的文本是否粗体显示-->
  2. app:xTabTextSelectedBold="true"
  3. <!-- 设置未选中Tab的文本是否粗体显示-->
  4. app:xTabTextBold="true"

1.1.2

兼容最低SDK版本为8

1.1.3

优化xTabDispalyNum属性功能

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/秋刀鱼在做梦/article/detail/984608
推荐阅读
相关标签
  

闽ICP备14008679号