您好,登錄后才能下訂單哦!
TabLayout和ViewPager搭配使用,是有很多方便性,但是TabLayout這東西還是有很多被人吐槽的地方。
這里只講怎么設(shè)置tab之間的間隔,網(wǎng)上找了一堆方法,什么padding和margin的啥都沒(méi)用,沒(méi)辦法,想用TabLayout只能自己想辦法了。效果如下:
一、實(shí)現(xiàn)方法,既然這東西不好設(shè)置,那就直接在背景上做點(diǎn)事情,布局代碼如下:
<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"/>
二、其中關(guān)鍵的地方就在背景的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內(nèi)部的Tab有間隔,暫時(shí)找不到其他設(shè)置方法,只能在背景圖形里面設(shè)置間隔--> <layer-list> <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> </layer-list> </item> <item android:state_selected="false"> <!--<shape> <solid android:color="#bcbcbc"/> <corners android:topLeftRadius="10dp" android:topRightRadius="10dp" /> </shape>--> <layer-list> <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> </layer-list> </item> </selector>
注釋掉的地方是原來(lái)沒(méi)間隔的selector,這里直接給背景設(shè)置了個(gè)左右的padding,效果杠杠的。
缺點(diǎn):如果間隔過(guò)大的話,那這種方式就有一點(diǎn)的缺陷了,就是點(diǎn)擊到空白處,也能選中tab。
不過(guò)對(duì)于間隔不是很大的,基本是感覺(jué)不出來(lái)的。
三、Activity的使用就很簡(jiǎn)單了:
TabLayout mTabLayout = (TabLayout) findViewById(R.id.tl_download_tabs); mTabLayout.addTab(mTabLayout.newTab().setText("已下載")); mTabLayout.addTab(mTabLayout.newTab().setText("下載中")); mTabLayout.setupWithViewPager(mViewPager);
四、原來(lái)是線性布局下,放著TabLayout和ViewPager,試著在TabLayout外嵌套多一個(gè)RelativeLayout,發(fā)現(xiàn)出來(lái)的效果Tab的文字不顯示了,至于網(wǎng)上說(shuō)的調(diào)換addTab和setupWithViewPager的順序也是坑,可以看到顯示,但是出現(xiàn)了更離譜的情況,前面兩個(gè)空白,后面還多了兩個(gè)正常的,反正是很奇葩。
最后還是得在Adapter中去處理,把以下方法重寫下就可以了,其實(shí)這樣可能更合理些,至少能保證Tab的數(shù)量和ViewPager的頁(yè)數(shù)是一致的。
@Override public CharSequence getPageTitle(int position) { if(position == 0){ return "已下載"; }else if(position == 1){ return "下載中"; } return ""; }
以上這篇基于TabLayout中的Tab間隔設(shè)置方法(實(shí)例講解)就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持億速云。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。