基于TabLayout中的Tab间隔设置方法(实例讲解)

基于TabLayout中的Tab间隔设置方法(实例讲解),第1张

概述TabLayout和ViewPager搭配使用,是有很多方便性,但是TabLayout这东西还是有很多被人吐槽的地方。

TabLayout和VIEwPager搭配使用,是有很多方便性,但是TabLayout这东西还是有很多被人吐槽的地方。

这里只讲怎么设置tab之间的间隔,网上找了一堆方法,什么padding和margin的啥都没用,没办法,想用TabLayout只能自己想办法了。效果如下:

一、实现方法,既然这东西不好设置,那就直接在背景上做点事情,布局代码如下:

<androID.support.design.Widget.TabLayout  xmlns:app="http://schemas.androID.com/apk/res-auto"  androID:ID="@+ID/tl_download_tabs"  androID:layout_wIDth="wrap_content"  androID:layout_height="30dp"  androID:layout_margintop="10dp"  androID:layout_gravity="center_horizontal"  androID:overScrollMode="never"  app:tabMode="fixed"  app:tabpaddingStart="30dp"  app:tabpaddingEnd="30dp"  app:tabIndicatorHeight="0dp"  app:tabBackground="@drawable/download_tab_bg_selector"  app:tabSelectedTextcolor="#000000"  app:tabTextcolor="#ffffff"/>

二、其中关键的地方就在背景的selector上,代码如下:

<?xml version="1.0" enCoding="utf-8"?><selector xmlns:androID="http://schemas.androID.com/apk/res/androID"> <item androID:state_selected="true">  <!--<shape>   <solID androID:color="#ffffff"/>   <corners androID:topLefTradius="10dp" androID:topRighTradius="10dp" />  </shape>-->  <!--为了让TabLayout内部的Tab有间隔,暂时找不到其他设置方法,只能在背景图形里面设置间隔-->  <@R_106_3419@>   <item>    <shape>     <solID androID:color="@androID:color/transparent"/>    </shape>   </item>   <item androID:left="5dp" androID:right="5dp">    <shape>     <corners androID:topLefTradius="10dp" androID:topRighTradius="10dp" />     <solID androID:color="#ffffff"/>    </shape>   </item>  </@R_106_3419@> </item> <item androID:state_selected="false">  <!--<shape>   <solID androID:color="#bcbcbc"/>   <corners androID:topLefTradius="10dp" androID:topRighTradius="10dp" />  </shape>-->  <@R_106_3419@>   <item>    <shape>     <solID androID:color="@androID:color/transparent"/>    </shape>   </item>   <item androID:left="5dp" androID:right="5dp">    <shape>     <corners androID:topLefTradius="10dp" androID:topRighTradius="10dp" />     <solID androID:color="#bcbcbc"/>    </shape>   </item>  </@R_106_3419@> </item></selector>

注释掉的地方是原来没间隔的selector,这里直接给背景设置了个左右的padding,效果杠杠的。

缺点:如果间隔过大的话,那这种方式就有一点的缺陷了,就是点击到空白处,也能选中tab。

不过对于间隔不是很大的,基本是感觉不出来的。

三、Activity的使用就很简单了:

TabLayout mTabLayout = (TabLayout) findVIEwByID(R.ID.tl_download_tabs);  mTabLayout.addTab(mTabLayout.newTab().setText("已下载"));  mTabLayout.addTab(mTabLayout.newTab().setText("下载中"));  mTabLayout.setupWithVIEwPager(mVIEwPager);

四、原来是线性布局下,放着TabLayout和VIEwPager,试着在TabLayout外嵌套多一个relativeLayout,发现出来的效果Tab的文字不显示了,至于网上说的调换addTab和setupWithVIEwPager的顺序也是坑,可以看到显示,但是出现了更离谱的情况,前面两个空白,后面还多了两个正常的,反正是很奇葩。

最后还是得在Adapter中去处理,把以下方法重写下就可以了,其实这样可能更合理些,至少能保证Tab的数量和VIEwPager的页数是一致的。

@OverrIDe  public CharSequence getPageTitle(int position) {   if(position == 0){    return "已下载";   }else if(position == 1){    return "下载中";   }   return "";  }

以上这篇基于TabLayout中的Tab间隔设置方法(实例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的基于TabLayout中的Tab间隔设置方法(实例讲解)全部内容,希望文章能够帮你解决基于TabLayout中的Tab间隔设置方法(实例讲解)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1143298.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-31
下一篇2022-05-31

发表评论

登录后才能评论

评论列表(0条)

    保存