項目剛好用到，暫時只能簡單地使用，一般情況下，TabLayout都是會和ViewPager、Fragment一起使用的，下面是三者結(jié)合的簡單介紹
- 布局：
TabLayout＋ViewPager的xml布局如下：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="@+id/mytablayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:tabIndicatorColor="#1852b6"
app:tabIndicatorHeight="1dp"
app:tabSelectedTextColor="#1852b6"
app:tabTextColor="#383a3d"/>
<android.support.v4.view.ViewPager
android:id="@+id/myviewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
注意：這里需要說明幾個屬性：
app:tabIndicatorColor="color"：指定Tab被選中時Tab下面的橫線的顏色
app:tabIndicatorHeight="dp"：指定Tab被選中時Tab下面的橫線的高度
app:tabSelectedTextColor="color"：指定Tab的字輩選中時顯示的顏色
app:tabTextColor="color"：Tab默認時的顏色，即不選中時文字的顏色
- Activity的代碼如下：
public class TabLayoutAty extends AppCompatActivity {
//TabLayout
private TabLayout mTabLayout;
//ViewPager
private ViewPager mViewPager;
//定義集合，用于保存tab
private List<String> mTabList;
//定義集合，用于保存Fragment
private List<Fragment> mFrList;
//填充到ViewPager的Fragment
private Fragment1 fragment1;
private Fragment2 fragment2;
private Fragment3 fragment3;
//ViewPager的適配器
private TabLayoutAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab_layout_aty);
//初始化
initViews();
initDatas();
}
/**
* 初始化組件
*/
private void initViews() {
mTabLayout = (TabLayout) findViewById(R.id.mytablayout);
mViewPager = (ViewPager) findViewById(R.id.myviewpager);
}
/**
* 初始化數(shù)據(jù)
*/
private void initDatas() {
mTabList = new ArrayList<>();
mTabList.add("選項1");
mTabList.add("選項2");
mTabList.add("選項3");
mFrList = new ArrayList<>();
fragment1 = new Fragment1();
fragment2 = new Fragment2();
fragment3 = new Fragment3();
mFrList.add(fragment1);
mFrList.add(fragment2);
mFrList.add(fragment3);
//設(shè)置模式
mTabLayout.setTabMode(TabLayout.MODE_FIXED);
//添加TAB
for (String str : mTabList) {
mTabLayout.addTab(mTabLayout.newTab().setText(str + ""));
}
//獲取適配器實例
mAdapter = new TabLayoutAdapter(getSupportFragmentManager(), mFrList, mTabList);
//為ViewPager設(shè)置適配器
mViewPager.setAdapter(mAdapter);
//為TabLayout設(shè)置ViewPager
mTabLayout.setupWithViewPager(mViewPager);
}
}
- 適配器代碼如下：
public class TabLayoutAdapter extends FragmentPagerAdapter {
private List<String> mTitleList;
private List<Fragment> mFrList;
public TabLayoutAdapter(FragmentManager fm, List<Fragment> fragmentList,
List<String> list) {
super(fm);
this.mTitleList = list;
this.mFrList = fragmentList;
}
@Override
public Fragment getItem(int position) {
return mFrList.get(position);
}
@Override
public int getCount() {
return mFrList.size();
}
@Override
public CharSequence getPageTitle(int position) {
return mTitleList.get(position);
}
}
適配器的用法與ViewPager+Fragment是一樣，只是需要重寫public CharSequence getPageTitle(int position) 方法，為Tab設(shè)置內(nèi)容
- Fragment沒有實現(xiàn)任何東西，因此不貼出了，
- 效果圖片如下：
Paste_Image.png
