当前位置:   article > 正文

Android 使用TabLayout实现可水平滑动的标签选择布局_android 滑动布局

android 滑动布局

一说到标签布局,一般都会想到是流式布局FlowLayout,流式布局网上有太多的demo可参考了,但是今天产品上有个横向水平滑动的标签布局,有选中和未选中的状态,并且初始状态是不选中任何一个标签。折腾了一番,最终在TabLayout上修饰了一阵,解决了需求和想要的效果。具体如下:

1.先附上效果截图:(默认都是未选中的)

2.xml中使用如下所示:

因为tabLayout有个默认的点击效果,可使用app:tabBackground="@color/transparent"去掉;

app:tabPaddingEnd和app:tabPaddingStart属性就是每个item左右的间距;

app:tabSelectedTextColor:选中时,textView的字体颜色;

app:tabTextColor :未选中时,textView的字体颜色;

app:tabMode="scrollable":表示TabLayout中有子view超出屏幕边界时候,可以通过滑动滑出不可见的其他子view。

 3.代码中动态添加每个item标签:

(1)动态添加的代码如下:

(2)每个item标签其实就是一个textView,xml如下:

(3)选中和未选中的drawable.xml如下:

  1. 未选中的shape:
  2. <?xml version="1.0" encoding="utf-8"?>
  3. <shape xmlns:android="http://schemas.android.com/apk/res/android">
  4. <corners android:radius="20dp" />
  5. <stroke
  6. android:width="1dp"
  7. android:color="@color/gray" />
  8. <solid android:color="@color/white" />
  9. </shape>
  1. 选中的shape:
  2. <?xml version="1.0" encoding="utf-8"?>
  3. <shape xmlns:android="http://schemas.android.com/apk/res/android">
  4. <corners android:radius="20dp" />
  5. <stroke
  6. android:width="1dp"
  7. android:color="@color/gray" />
  8. <solid android:color="@color/red" />
  9. </shape>

(4)tabLayout的item点击事件:注意:可以通过截图中的curSelectPosition,来获取当前选中的值;

(5)取出当前选中的值:即:labelId,进行想要的操作。

  1. int labelId = 0;
  2. for (int i = 0; i < labels.size(); i++) {
  3. if (curSelectPosition == i) {
  4. labelId = labels.get(i).id;
  5. }
  6. }

结束~

若有更好的建议和想法,可以互相交流学习哦~

[转载请注明出处,谢谢~]

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

闽ICP备14008679号