選項卡 新聞導航

2021-08-01 05:42:16 字數 1227 閱讀 4762

compile 'com.androidkun:xtablayout:1.0.9'
2.在布局檔案中設定xtablayout屬性:

.androidkun

.xtablayout

.xtablayout

android:id="@+id/xtablayout"

android:layout_width="match_parent"

android:layout_height="50dp"

tablayout有的屬性,在xtablayout中都會有,屬性名稱都是前面加個x,後面的t變成大寫。

其中增加了xtabindicatorwidth用於設定指示器長度,xtabtextsize用於設定未選中項的字型大小,xtabselectedtextsize用於設定選中項的字型大小。

此外1.0.1以及後面的版本中新增如下屬性可以設定螢幕範圍內顯示的tab個數

或則在**中新增

tablayout.setxtabdisplaynum(6);//需要寫在setupwithviewpager前

tablayout.setupwithviewpager(viewpager);

這裡我們限制為6個,則每個tab的寬度為螢幕的1/6,顯示效果如下:

由於後面加了乙個加號擋住了乙個。

3.初始化:

xtablayout的使用方式和tablayout是一樣的,**如下:

//將tablayout和viewpager關聯起來。

xtablayout tablayout = (xtablayout) findviewbyid(r.id

.xtablayout);

tablayout.setupwithviewpager(viewpager);

使用方式:

a.明確指定指示器為某個長度則設定xtabindicatorwidth

b.指定指示器長度跟隨文字變化則設定xtabdividerwidthwidthtext

c.如果需要指示器長度佔滿,則兩個屬性都不設定,預設佔滿。

其他的具體使用關注原著吧。

原著位址 :

選項卡套選項卡

實現 項卡套小選項卡 項卡切換同時小選項卡也進行切換,且每次 項卡的切換是在小選項卡切換完後進行 大的外層的選項卡 大的選項卡內部有乙個小的選項卡 功能 自動切換 滑鼠經過切換 方案一 不可行 開兩個定時器,乙個控制外層選卡,乙個控制內層選卡。仔細分析發現,外層選項卡的切換是需要在內層選卡全部切換完...

vue 選項卡 typecho tabs選項卡外掛程式

在看技術文件的時候發現使用選項卡來呈現示例 是個很不錯的方式,既可以節約版面空間還清晰明了,比如下面這個簡單的vue宣告式渲染demo 實際執行效果 明顯比順序排下來好多了,剛開始在網上搜尋typecho此類外掛程式一直沒有找到,所以乾脆自己動手擼乙個,最後就在typecho的預設helloworl...

微信小程式 導航欄選項卡(MUI頂部選項卡)

已獲得賞金text data id 1 bindtap changetabbar class tui tabbar cell 賞金在路上text data id 2 bindtap changetabbar class tui tabbar cell 邀請失敗text view view class...