项目中有个模块某个页面需求是两个tab切换,刚好上篇文章也是写的是tablayout+viewpager+fragment问题,自然想到用tablayout来实现,UI的效果图是这样的。
吧啦吧啦代码实现了,还实现了滑动功能的,可效果却是这样的。
好吧,这效果我都不能忍,设计师肯定不过,于是google了一下,发现有 tabGravity这个属性,默认是app:tabGravity="fill",代码中改为app:tabGravity="center",见效果
嗯,这效果基本上我自己也满意了,然后设计师要要跟我撕逼了,她要的效果上“All products”和“My list”下滑动条长度跟字体长度相适应,而我这实现的滑动条都是一样长的,视觉上不协调,且这两个单词也不是均分位于中间而是都向中间靠拢显示。好吧,由于设计师太能撕逼说服不了她,我开始了自定义tablayout,结果也是失败告终。具体原因是滑动条textview都是先addview进去,滑动过程中去取下个textview宽度来动态改变滑动条长度不好处理。
于是打算换思路实现。之前的导航栏很多是使用radiogroup实现的。于是我试了试
android:id="@+id/radbtn_all_products"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:drawableBottom="@drawable/layer_list_favorite_tab"
android:button="@null"
android:checked="true"
android:text="@string/all_products"
android:textColor="@drawable/selector_tv_favorite_tab"
android:textSize="16sp"/>
可是可是,他妈做不到滑动条紧紧爱着底边的,于是于是想到将滑动条作为整体背景android:background="@drawable/layer_list_favorite_tab"而不要android:drawableBottom属性的。最终终于实现了UI需要的效果。
在这过程中有两个小插曲:
1.当最后那滑条用backgroud方式实现,要设计师给切图,然而设计师又撕逼,说之前也没切过图啊,这个你们肯定能不用切图自己实现,好吧,我又妥协了,找代码怎么实现这种效果,最直接看项目中有没有现成的了。黄天不负有心人看到个layer-list类型文件,不是很清楚这是干嘛的,google了下能实现。
2.用readiogroup实现那个单选时候,代码如下因为要radiobutton有背景花条又居中显示,所以只能采用在Readiogroup和RadioButton中间嵌套层布局,如下:
<ReadioGroup
<Linarlayout
<RadioButton
然而问题来了,readiogroup的监听不起作用,当时也是too young以为是其它问题,甚至怀疑到as升级到新版本问题,后来debug监听才发觉代码根本没进来,没时间折腾只能自己实现互斥监听了。
ps:其实在自己开发经验不是特别丰富时候,很多时候都是在试错的过程,然后一步步实现它解决它。