本文為大家分享了Tablayout簡單的使用方法，供大家參考，具體內(nèi)容如下
一、TabLayout普通用法
在項目中使用viewpager的時候大多數(shù)都是和TabPagerIndicator結(jié)合使用，TabPagerIndicator是第三方的，使用起來比較繁瑣；
2015谷歌大會官方發(fā)布了TabLayout，可以很簡單很完美的實現(xiàn)這種效果；
因為是官方發(fā)布的，所以使用起來不用任何第三方的東西；而且非常簡單明了；
同樣，如果想要使用Tablayout必須在build中配置：
dependencies { compile 'com.android.support:design:23.1.1' } 先看下布局：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="www.tablayout.com.tablayoutdemo.MainActivity"> <!-- app:tabIndicatorColor="@color/white" // 下方滾動的下劃線顏色 app:tabSelectedTextColor="@color/gray" // tab被選中后，文字的顏色 app:tabTextColor="@color/white" // tab默認的文字顏色 app:tabMode="scrollable" //設(shè)置標題滑動模式 --> <android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/holo_blue_light" app:tabIndicatorColor="@android:color/holo_red_dark" app:tabSelectedTextColor="@android:color/holo_red_dark" app:tabTextColor="@android:color/background_dark" app:tabMode="scrollable" /> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> </LinearLayout>
代碼使用起來也非常簡單
第一步：初始化ViewPager并設(shè)置adapter
第二步：給Tablayout設(shè)置標題
第三步：將Tablayout和ViewPager關(guān)聯(lián)到一起
//第一步：初始化ViewPager并設(shè)置adapter viewPager = (ViewPager) findViewById(R.id.viewpager); viewPager.setAdapter(new MyViewPagerAdapter(getSupportFragmentManager(), fragmentList)); //第二步：初始化Tablayout，給ViewPager設(shè)置標題（選項卡） tabLayout = (TabLayout) findViewById(R.id.tablayout); tabLayout.addTab(tabLayout.newTab().setText("UFC"));//添加tab選項卡 tabLayout.addTab(tabLayout.newTab().setText("武林風")); tabLayout.addTab(tabLayout.newTab().setText("昆侖決")); tabLayout.addTab(tabLayout.newTab().setText("榮耀")); tabLayout.addTab(tabLayout.newTab().setText("勇士的崛起")); tabLayout.addTab(tabLayout.newTab().setText("K-1")); //第三步：關(guān)聯(lián)ViewPager tabLayout.setupWithViewPager(viewPager); 好了，正常情況下就到此結(jié)束了，但是我在寫這個demo的時候碰到一個坑：
標題死活顯示不出來，浪費了很長時間，最后在Tablayout關(guān)聯(lián)Viewpager之后添加從新設(shè)置下標題即可：
//在關(guān)聯(lián)ViewPager之后添加如下代碼，前三步不用更改 tabLayout.getTabAt(0).setText("UFC"); tabLayout.getTabAt(1).setText("武林風"); tabLayout.getTabAt(2).setText("昆侖決"); tabLayout.getTabAt(3).setText("榮耀"); tabLayout.getTabAt(4).setText("勇士的崛起"); tabLayout.getTabAt(5).setText("K-1"); 總體來說Tablayout完全可以代替TabPagerIndicator，而且使用起來比較簡單，最重要的還是官方的；
二、Tablayout下劃線寬度更改方法：
首先說明：Google官方?jīng)]有給我們提供更改下劃線的寬度的方法；
我們可以通過其他方法更改：（兩步）
1.首先定義setIndicator()方法
public void setIndicator(TabLayout tabs,int leftDip,int rightDip){ Class<?> tabLayout = tabs.getClass(); Field tabStrip = null; try { tabStrip = tabLayout.getDeclaredField("mTabStrip"); } catch (NoSuchFieldException e) { e.printStackTrace(); } tabStrip.setAccessible(true); LinearLayout llTab = null; try { llTab = (LinearLayout) tabStrip.get(tabs); } catch (IllegalAccessException e) { e.printStackTrace(); } int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics()); int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics()); for (int i = 0; i < llTab.getChildCount(); i++) { View child = llTab.getChildAt(i); child.setPadding(0, 0, 0, 0); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1); params.leftMargin = left; params.rightMargin = right; child.setLayoutParams(params); child.invalidate(); } } 2.在關(guān)聯(lián)ViewPager之前添加
tabLayout.post(new Runnable() { @Override public void run() { setIndicator(tabLayout,25,25); } }); 最后記得更改滑動方式： app:tabMode="fixed"
左右距離可根據(jù)自己項目設(shè)置；（更改下劃線寬度需在第一步（Tablayout普通用法）的基礎(chǔ)上更改使用）
三、更改標簽對齊方式
在xml文件中：
刪除 app:tabMode="" ；
添加 app:tabGravity="center" ；
還可以通過 app:tabMaxWidth="150dp" 限制標簽寬度
（更改更改標簽對齊方式需在第一步（Tablayout普通用法）的基礎(chǔ)上更改使用）
四、標題之間添加分割線；
1.在drawable文件夾下創(chuàng)建 shape
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#aa00ff00" /> <size android:width="1dp"/> </shape>
2,在主類設(shè)置完tablayout后添加如下代碼：
LinearLayout linearLayout = (LinearLayout) tabLayout.getChildAt(0); linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE); linearLayout.setDividerDrawable(ContextCompat.getDrawable(this, R.drawable.layout_divider_vertical)); linearLayout.setDividerPadding(15);
點擊打開鏈接免費下載源碼
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持VEVB武林網(wǎng)。
新聞熱點
疑難解答
圖片精選
