Google官方在14年 I/O大會上推出了全新的設(shè)計(jì)語言——Material Design，
Material Design讓Android界面在體驗(yàn)上更加鮮艷和簡潔，正在逐步成為APP設(shè)計(jì)的趨勢.
而與Material Design相關(guān)的是一系列實(shí)現(xiàn)Material Design效果的控件庫Android Design Support Library,從今天開始將一一介紹他們的用法.
這一系列控件庫在使用時(shí)都需要在gradle中添加依賴：
compile 'com.android.support:design:25.3.1'
一、TabLayout介紹
官方地址：TabLayout
需要翻墻
TabLayout1
TabLayout2
像上面這種選項(xiàng)卡切換的效果，幾乎所有應(yīng)用中都有涉及到，這種效果實(shí)現(xiàn)方式很多，TabHost實(shí)現(xiàn)、RadioGroup+RadioButton實(shí)現(xiàn)、ViewPager+PagerTabStrip或者種種第三方庫（Viewpageindicator…）來實(shí)現(xiàn)、HorizontalScrollView+LinearLayout動態(tài)實(shí)現(xiàn)……
而在Android Design Support Library中就有這樣一個(gè)控件：TabLayout，繼承自HorizontalScrollView，通過TabLayout我們可以很輕松的實(shí)現(xiàn)這種效果.
二、TabLayout簡單使用
布局文件：
? ? xmlns:tools="http://schemas.android.com/tools"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/tablayout"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="wrap_content">
Activity中：
package com.my;
import android.support.design.widget.TabLayout;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
? ? private TabLayout mTablayout;
? ? @Override
? ? protected void onCreate(Bundle savedInstanceState) {
? ? ? ? super.onCreate(savedInstanceState);
? ? ? ? setContentView(R.layout.activity_main);
? ? ? ? mTablayout = (TabLayout) findViewById(R.id.tablayout);
? ? ? ? mTablayout.addTab(mTablayout.newTab().setText("A"));
? ? ? ? mTablayout.addTab(mTablayout.newTab().setText("B"));
? ? ? ? mTablayout.addTab(mTablayout.newTab().setText("C"));
? ? }
}
效果圖：
簡單的選項(xiàng)卡效果就實(shí)現(xiàn)了，當(dāng)然，你也可以在布局文件中寫死，像下面這樣：
? ? xmlns:tools="http://schemas.android.com/tools"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/tablayout"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="wrap_content">
? ? ? ? ? ? android:layout_width="wrap_content"
? ? ? ? ? ? android:layout_height="wrap_content"
? ? ? ? ? ? android:text="A" />
? ? ? ? ? ? android:layout_width="wrap_content"
? ? ? ? ? ? android:layout_height="wrap_content"
? ? ? ? ? ? android:text="B" />
? ? ? ? ? ? android:layout_width="wrap_content"
? ? ? ? ? ? android:layout_height="wrap_content"
? ? ? ? ? ? android:text="C" />
效果和上面是一樣的，不過一般沒人這么使用.
三、TabLayout的常用屬性
app:tabIndicatorColor=""? 指示器顏色
app:tabIndicatorHeight=""? 指示器高度，設(shè)置為0就是沒有指示器
app:tabTextColor=""? ? Tab文本默認(rèn)顏色
app:tabSelectedTextColor=""? ? Tab文本被選中后的顏色
app:tabTextAppearance=""? ? ? 為Tab文本設(shè)置樣式，一般是需要為Tab加圖標(biāo)時(shí)使用
app:tabMode=""? 只有兩個(gè)值：fixed、scrollable
? ? fixed用于標(biāo)題欄少的情況，每個(gè)Tab可以平分屏幕寬度
? ? scrollable用于標(biāo)題欄多出屏幕的情況，如果標(biāo)題欄少的時(shí)候用很難看，占不滿屏幕
app:tabBackground=""? ? TabLayout背景，和android:background=""效果一樣
app:tabGravity=""? ? 對齊方式:? 居中顯示center、fill填滿
app:tabGravity=”center”
app:tabGravity=”fill”
還有一些很少使用的：
從左邊開始偏移距離,tabMode值必須為scrollable才會生效
app:tabContentStart="150dp"
app:tabContentStart
選項(xiàng)卡寬度限制
app:tabMaxWidth=""? 最大寬度
app:tabMinWidth=""? 最小寬度
Tab內(nèi)邊距
app:tabPaddingStart=""
app:tabPaddingBottom=""
app:tabPaddingEnd=""
app:tabPaddingTop=""
app:tabPadding=""
三、TabLayout方法
Tablayout.newTab()? ? ? ? 創(chuàng)建標(biāo)簽
Tablayout.addTab()? ? ? ? 添加標(biāo)簽
Tablayout.removeTab()? ? ? 刪除標(biāo)簽
Tablayout.removeTabAt()? ? 通過索引刪除標(biāo)簽
Tablayout.removeAllTabs()? 刪除全部標(biāo)簽
因?yàn)門abLayout繼承自HorizontalScrollView，所以可以直接添加View
addView ()
添加監(jiān)聽器，取消監(jiān)聽器，清楚所有的監(jiān)聽器
Tablayout.addOnTabSelectedListener()
Tablayout.removeOnTabSelectedListener()
Tablayout.clearOnTabSelectedListeners()
Tablayout.getSelectedTabPosition()? ? 獲取當(dāng)前選中的Tab位置
Tablayout.getTabAt()? ? ? 根據(jù)索引獲取Tab
Tablayout.getTabCount()? ? 獲取Tab總數(shù)
對應(yīng)tabGravity屬性
Tablayout.getTabGravity()
Tablayout.setTabGravity()
對應(yīng)tabMode屬性
Tablayout.getTabMode()
Tablayout.setTabMode()
對應(yīng)tabTextColor屬性
Tablayout.setTabTextColors()
Tablayout.getTabTextColors()
和ViewPager關(guān)聯(lián)，隨著ViewPager滑動而滑動
TabLayout和ViewPager配合使用是最常見的運(yùn)用方式
兩者關(guān)聯(lián)后：
1)TabLayout之前創(chuàng)建的Tab并不能正常顯示，但可以在關(guān)聯(lián)后通過 getTabAt() 得到標(biāo)簽之后進(jìn)行修改
但其實(shí)沒有必要，我們一般由2）和3）決定Tab的數(shù)量和內(nèi)容
2)TabLayout的Tab數(shù)量由ViewPager分頁數(shù)量決定
3)TabLayout的Tab內(nèi)容由ViewPager的Adapter中 getPagerTitle() 方法返回的內(nèi)容決定
Tablayout.setupWithViewPager()
TabLayout中的內(nèi)部類：Tab，表示TabLayout中的每一個(gè)標(biāo)簽
Tab的方法
boolean is Selected()? Tab是否被選中
void setSelected()? 設(shè)置Tab為被選中狀態(tài)
setText ()? ? 設(shè)置Tab文本內(nèi)容
getText ()? ? 獲取Tab文本內(nèi)容
getIcon ()? 獲取Tab的圖標(biāo)
setIcon ()? 為Tab添加圖標(biāo)
setCustomView()? ? 設(shè)置用戶自定義的Tab，參數(shù)為資源id或者View對象
getPosition() 獲取當(dāng)前位置
四、TabLayout搭配ViewPager使用
1、MainActivity布局文件的兩種方式
? ? xmlns:app="http://schemas.android.com/apk/res-auto"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/viewpager"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="match_parent">
? ? ? ? ? ? android:id="@+id/tablayout"
? ? ? ? ? ? app:tabMode="scrollable"
? ? ? ? ? ? app:tabBackground="@android:color/holo_blue_dark"
? ? ? ? ? ? app:tabIndicatorColor="@android:color/white"
? ? ? ? ? ? app:tabTextColor="@android:color/black"
? ? ? ? ? ? app:tabSelectedTextColor="@android:color/white"
? ? ? ? ? ? android:layout_width="match_parent"
? ? ? ? ? ? android:layout_height="wrap_content"/>
? ? xmlns:app="http://schemas.android.com/apk/res-auto"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/tablayout"
? ? ? ? app:tabMode="scrollable"
? ? ? ? app:tabBackground="@android:color/holo_blue_dark"
? ? ? ? app:tabIndicatorColor="@android:color/white"
? ? ? ? app:tabTextColor="@android:color/black"
? ? ? ? app:tabSelectedTextColor="@android:color/white"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="wrap_content"/>
? ? ? ? android:id="@+id/viewpager"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="match_parent">
2、MainActivity.java
package com.my;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
? ? private TabLayout mTablayout;
? ? private ViewPager mViewPager;
? ? private List mDatas;
? ? private List fragments;
? ? @Override
? ? protected void onCreate(Bundle savedInstanceState) {
? ? ? ? super.onCreate(savedInstanceState);
? ? ? ? setContentView(R.layout.activity_main);
? ? ? ? initData();
? ? ? ? initFragments();
? ? ? ? mTablayout = (TabLayout) findViewById(R.id.tablayout);
? ? ? ? mViewPager = (ViewPager) findViewById(R.id.viewpager);
? ? ? mViewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager(), mDatas, fragments));
//? ? ? ? mTablayout.setupWithViewPager(mViewPager);
//注意：我的布局文件中ViewPager和TabLayout 是嵌套的，所以不需要這一步
//? ? ? ? ? 如果沒有嵌套，則需要在ViewPager設(shè)置Adapter之后加上這一步
//另外，只能是ViewPager嵌套Tablayout，反了會報(bào)錯(cuò)的，因?yàn)門ablayout中只能嵌套TabItem
? ? }
? ? private void initData() {
? ? ? ? mDatas = new ArrayList<>();
? ? ? ? for (int i = 'A'; i < 'I'; i++) {
? ? ? ? ? ? mDatas.add("" + (char) i);
? ? ? ? }
? ? }
? ? private void initFragments() {
? ? ? ? fragments = new ArrayList<>();
? ? ? ? for (int i = 0; i < mDatas.size(); i++) {
? ? ? ? ? ? MyFragment fragment = MyFragment.newInstance(mDatas.get(i));
? ? ? ? ? ? fragments.add(fragment);
? ? ? ? }
? ? }
}
3、MyPagerAdapter.java
package com.my;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import java.util.List;
/**
* Created by fgq on 2017/5/9.
*/
public class MyPagerAdapter extends FragmentStatePagerAdapter {
? ? private List mDatas;
? ? private List mFragments;
? ? public MyPagerAdapter(FragmentManager fm, List mDatas, List fragments) {
? ? ? ? super(fm);
? ? ? ? this.mDatas = mDatas;
? ? ? ? this.mFragments = fragments;
? ? }
? ? @Override
? ? public Fragment getItem(int position) {
? ? ? ? return mFragments.get(position);
? ? }
? ? @Override
? ? public int getCount() {
? ? ? ? return mDatas.size()==mFragments.size()?mFragments.size():0;
? ? }
? ? /**
? ? * 重寫此方法，返回TabLayout的內(nèi)容
? ? */
? ? @Override
? ? public CharSequence getPageTitle(int position) {
? ? ? ? return mDatas.get(position);
? ? }
}
4、MyFragment.java
package com.my;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
/**
* Created by fgq on 2017/5/9.
*/
public class MyFragment extends Fragment {
? ? public static MyFragment newInstance(String data) {
? ? ? ? Bundle args = new Bundle();
? ? ? ? args.putString("key", data);
? ? ? ? MyFragment fragment = new MyFragment();
? ? ? ? fragment.setArguments(args);
? ? ? ? return fragment;
? ? }
? ? @Override
? ? public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
? ? ? ? View view = inflater.inflate(R.layout.fragment, container, false);
? ? ? ? TextView tv = (TextView) view.findViewById(R.id.tv);
? ? ? ? tv.setText("Fragment------" + getArguments().getString("key"));
? ? ? ? return view;
? ? }
}
5、Fragment布局文件
? ? xmlns:tools="http://schemas.android.com/tools"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent">
? ? ? ? android:id="@+id/tv"
? ? ? ? android:layout_width="wrap_content"
? ? ? ? android:layout_height="wrap_content"
? ? ? ? android:layout_centerInParent="true"
? ? ? ? tools:text="別看了，我就是一個(gè)TextView" />
5、效果圖
五、TabLayout之自定義Tab布局
我們的Tab上有時(shí)候不僅僅只有文字，還會有圖標(biāo)，那么這時(shí)候我們的getPageTitle（）方法就不應(yīng)該僅僅返回一個(gè)文本了.
方式1：通過SpannableString為Tab添加圖標(biāo)
SpannableString基本上與String差不多，也是用來存儲字符串，但它們倆的特殊就在于SpannableString有一個(gè)SetSpan()方法，能給這些存儲的String添加各種格式或者稱樣式(Span)，將原來的String以不同的樣式顯示出來，比如在原來String上加下劃線、加背景色、改變字體顏色、用圖片把指定的文字給替換掉，等等.
MainActivity中的修改
private int[] imageRes = {
? ? ? ? ? ? R.mipmap.a,R.mipmap.b, R.mipmap.c,R.mipmap.d,
? ? ? ? ? ? R.mipmap.e, R.mipmap.f,R.mipmap.g,R.mipmap.h
};
mViewPager.setAdapter(new MyPagerAdapter(MainActivity.this,getSupportFragmentManager(), mDatas, fragments,imageRes));
添加了一個(gè)裝有圖片資源的數(shù)組，然后通過構(gòu)造傳給MyPagerAdapter，當(dāng)然，其實(shí)標(biāo)題mDatas和圖標(biāo)資源imageRes你直接聲明在MyPagerAdapter中也是可以的.
MyPagerAdapter中的修改
? ? private int[] imageRes;
? ? private Context mContext;
? ? public MyPagerAdapter(Context context, FragmentManager fm, List mDatas, List fragments, int[] imageRes) {
? ? ? ? super(fm);
? ? ? ? this.mContext = context;
? ? ? ? this.mDatas = mDatas;
? ? ? ? this.mFragments = fragments;
? ? ? ? this.imageRes = imageRes;
? ? }
? ? /**
? ? * 通過SpannableString 為Tab添加各種樣式，這里就添加了一個(gè)圖標(biāo)
? ? */
? ? @Override
? ? public CharSequence getPageTitle(int position) {
? ? ? ? SpannableString sb = new SpannableString("? "+mDatas.get(position));
? ? ? ? Drawable image = mContext.getResources().getDrawable(imageRes[position]);
? ? ? image.setBounds(0,0,image.getIntrinsicWidth(), image.getIntrinsicHeight());
? ? ? ? ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BOTTOM);
? ? ? ? sb.setSpan(imageSpan, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
? ? ? ? return sb;
? ? }
運(yùn)行之后你會發(fā)現(xiàn)效果沒變，這是因?yàn)門abLayout創(chuàng)建的tab默認(rèn)樣式textAllCaps屬性為true，這阻止了ImageSpan被渲染出來，可以通過下面的樣式文件定義來改變：
在res/values/styles中定義我們自己的樣式，把textAllCaps屬性設(shè)為false
? ?
? ? ? ? false
TabLayout中Tab的文字大小無法在布局文件中更改，也是在這里更改的
在布局文件中為TabLayout引用我們自己的樣式
? app:tabTextAppearance="@style/MyTabTextAppearance"
效果圖
方式2：通過Tab的setCustomView()方法自定義Tab布局
上面已經(jīng)介紹了，Tab有一個(gè)方法，setCustomView()，參數(shù)為一個(gè)資源id或者一個(gè)View對象，我們通過這個(gè)方法來自定義Tab的布局.
1）MainActivity布局文件
? ? xmlns:app="http://schemas.android.com/apk/res-auto"
? ? android:layout_width="match_parent"
? ? android:layout_height="match_parent"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/tablayout"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="wrap_content"
? ? ? ? app:tabBackground="@android:color/holo_blue_dark"
? ? ? ? app:tabIndicatorColor="@android:color/white"
? ? ? ? app:tabMode="scrollable"
? ? ? ? app:tabSelectedTextColor="@android:color/white"
? ? ? ? app:tabTextAppearance="@style/MyTabTextAppearance"
? ? ? ? app:tabTextColor="@android:color/black" />
? ? ? ? android:id="@+id/viewpager"
? ? ? ? android:layout_width="match_parent"
? ? ? ? android:layout_height="match_parent">
2）MainActivity.java
package com.my;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
? ? private TabLayout mTablayout;
? ? private ViewPager mViewPager;
? ? private List mDatas;
? ? private List fragments;
? ? private MyPagerAdapter mAdapter;
? ? private int[] imageRes = {
? ? ? ? ? ? R.mipmap.a,R.mipmap.b, R.mipmap.c,R.mipmap.d,
? ? ? ? ? ? R.mipmap.e, R.mipmap.f,R.mipmap.g,R.mipmap.h
? ? };
? ? @Override
? ? protected void onCreate(Bundle savedInstanceState) {
? ? ? ? super.onCreate(savedInstanceState);
? ? ? ? setContentView(R.layout.activity_main);
? ? ? ? initData();
? ? ? ? initFragments();
? ? ? ? mTablayout = (TabLayout) findViewById(R.id.tablayout);
? ? ? ? mViewPager = (ViewPager) findViewById(R.id.viewpager);
? ? ? ? mAdapter = new MyPagerAdapter(MainActivity.this,getSupportFragmentManager(), mDatas, fragments,imageRes);
? ? ? ? mViewPager.setAdapter(mAdapter);
? ? ? ? mTablayout.setupWithViewPager(mViewPager);
? ? ? ? /**
? ? ? ? * 為每一個(gè)Tab設(shè)置自定義布局
? ? ? ? */
? ? ? ? for (int i = 0; i
? ? ? ? ? ? TabLayout.Tab tab = mTablayout.getTabAt(i);
? ? ? ? ? ? tab.setCustomView(mAdapter.getTabView(i));
? ? ? ? }
? ? }
? ? private void initData() {
? ? ? ? mDatas = new ArrayList<>();
? ? ? ? for (int i = 'A'; i < 'I'; i++) {
? ? ? ? ? ? mDatas.add("" + (char) i);
? ? ? ? }
? ? }
? ? private void initFragments() {
? ? ? ? fragments = new ArrayList<>();
? ? ? ? for (int i = 0; i < mDatas.size(); i++) {
? ? ? ? ? ? MyFragment fragment = MyFragment.newInstance(mDatas.get(i));
? ? ? ? ? ? fragments.add(fragment);
? ? ? ? }
? ? }
}
3）MyPagerAdapter.java
package com.my;
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
/**
* Created by fgq on 2017/5/9.
*/
public class MyPagerAdapter extends FragmentStatePagerAdapter {
? ? private List mDatas;
? ? private List mFragments;
? ? private int[] imageRes;
? ? private Context mContext;
? ? public MyPagerAdapter(Context context, FragmentManager fm, List mDatas, List fragments, int[] imageRes) {
? ? ? ? super(fm);
? ? ? ? this.mContext = context;
? ? ? ? this.mDatas = mDatas;
? ? ? ? this.mFragments = fragments;
? ? ? ? this.imageRes = imageRes;
? ? }
? ? @Override
? ? public Fragment getItem(int position) {
? ? ? ? return mFragments.get(position);
? ? }
? ? @Override
? ? public int getCount() {
? ? ? ? return mDatas.size()==mFragments.size()?mFragments.size():0;
? ? }
? ? /**
? ? * 要使用我們自定義的布局，這里返回null
? ? */
? ? @Override
? ? public CharSequence getPageTitle(int position) {
? ? ? ? return null;
? ? }
? ? /**
? ? * 定義一個(gè)方法，來返回Tab的內(nèi)容
? ? */
? ? public View getTabView(int position){
? ? ? View view = LayoutInflater.from(mContext).inflate(R.layout.tab_layout, null);
? ? ? ? TextView tv= (TextView) view.findViewById(R.id.tv);
? ? ? ? ImageView iv = (ImageView) view.findViewById(R.id.iv);
? ? ? ? tv.setText(mDatas.get(position));
? ? ? ? iv.setImageResource(imageRes[position]);
? ? ? ? return view;
? ? }
}
4）每一個(gè)Tab的布局文件
? ? xmlns:tools="http://schemas.android.com/tools"
? ? android:layout_width="match_parent"
? ? android:layout_height="wrap_content"
? ? android:orientation="vertical">
? ? ? ? android:id="@+id/iv"
? ? ? ? android:layout_width="wrap_content"
? ? ? ? android:layout_height="wrap_content"
? ? ? ? android:layout_gravity="center"
? ? ? ? tools:src="@mipmap/a" />
? ? ? ? android:id="@+id/tv"
? ? ? ? android:layout_width="wrap_content"
? ? ? ? android:layout_height="wrap_content"
? ? ? ? android:layout_gravity="center"
? ? ? ? android:layout_marginTop="5dp"
? ? ? ? tools:text="別看了，我就是一個(gè)TextView" />
其它的文件沒有發(fā)生改變
5）效果圖
ok, 效果還好，但是文字顏色的選擇器效果沒了，這種情況我們可以在每一個(gè)Tab的布局文件為TextView的textColor設(shè)置一個(gè)選擇器就行了
android:textColor="@drawable/seletor_tab_textcolor"
在drawable目錄下新建一個(gè)選擇器seletor_tab_textcolor.xml
? ?
? ?
但是圖片要實(shí)現(xiàn)選擇器的效果就不好辦了，Tab數(shù)量太多，針對每一個(gè)tab的圖片都需要一個(gè)seletor….
另外我們也注意到：setCustomView()為Tab設(shè)置自定義布局的參數(shù)不僅僅可以是View對象，也可以是資源Id.像下面這樣：
? ? ? ? int[] tabs = {R.layout.tab_one,
? ? ? ? ? ? ? ? ? ? R.layout.tab_two,
? ? ? ? ? ? ? ? ? ? R.layout.tab_three,
? ? ? ? ? ? ? ? ? ? R.layout.tab_four};//有多少tab，就添加多少tab的布局文件
? ? ? ? for (int i = 0; i < mTablayout.getTabCount(); i++) {
? ? ? ? ? ? mTabLayout.getTabAt(i).setCustomView(tabs[i]);
? ? ? ? }
這種做法適合選項(xiàng)卡比較少而且固定的情況.
六、關(guān)于TabLayout指示器長度的更改
TabLayout的指示器（Indicator）可以更改顏色、高度，但是你會發(fā)現(xiàn)沒有更改長度的屬性或者方法，這時(shí)我們查看源碼，發(fā)現(xiàn)被private 了，所以只能通過反射來做了.
private final SlidingTabStrip mTabStrip;
? ? 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 ll_tab = null;
? ? ? ? try {
? ? ? ? ? ? ll_tab = (LinearLayout) tabStrip.get(tabs);
? ? ? ? } catch (IllegalAccessException e) {
? ? ? ? ? ? e.printStackTrace();
? ? ? ? }
? ? ? ? int left = (int) (Resources.getSystem().getDisplayMetrics().density * leftDip);
? ? ? ? int right = (int) (Resources.getSystem().getDisplayMetrics().density * rightDip);
? ? ? ? for (int i = 0; i < ll_tab.getChildCount(); i++) {
? ? ? ? ? ? View child = ll_tab.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();
? ? ? ? }
? ? }
注意：tabMode必須是fixed
1）調(diào)用setIndicator(mTabLayout, 20, 20);方法即可，這兩個(gè)20根據(jù)實(shí)際需求來定.
2）關(guān)于背景不正常問題，不要使用TabLayout自帶的app:tabBackground=””；
使用android:background=” “就可以了
ok，TabLayout的使用就寫到這里，如果你的項(xiàng)目中有類似效果要實(shí)現(xiàn)，不妨試試TabLayout.
