首發(fā)于我的博客,轉(zhuǎn)載請(qǐng)注明作者和原文鏈接鹊汛。
TabLayout用以實(shí)現(xiàn)Android上常見(jiàn)的頁(yè)面切換效果蒲赂。
屬性說(shuō)明
- 下方滾動(dòng)的下劃線顏色
app:tabIndicatorColor
setSelectedTabIndicatorColor
- tab被選中后，文字的顏色
app:tabSelectedTextColor
setTabTextColors
- tab默認(rèn)的文字顏色
app:tabTextColor
setTabTextColors
- tab的背景
app:tabBackground
android:background
- 排列模式刁憋，可選：[ fixed | scrollable ]
app:tabMode
setTabMode
- 對(duì)齊方式滥嘴，可選：[ fill | center ]
app:tabGravity
setTabGravity
XML布局：activity_toolbar.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tab_layout"></android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="@+id/view_pager"></android.support.v4.view.ViewPager>
</LinearLayout>
Java：TabLayoutActivity
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tablayout);
TabFragment tfAndroid = TabFragment.newInstance("Android");
TabFragment tfIos = TabFragment.newInstance("iOS");
TabFragment tfWeb = TabFragment.newInstance("WEB");
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
TabFragmentPagerAdapter tabFragmentPagerAdapter =
new TabFragmentPagerAdapter(getSupportFragmentManager());
tabFragmentPagerAdapter.add(tfAndroid, "Android");
tabFragmentPagerAdapter.add(tfIos, "iOS");
tabFragmentPagerAdapter.add(tfWeb, "WEB");
viewPager.setAdapter(tabFragmentPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
}
public static class TabFragmentPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragmentList = new ArrayList<>(); //fragment列表
private List<String> titleList = new ArrayList<>(); //tab名的列表
public TabFragmentPagerAdapter(FragmentManager fm) {
super(fm);
}
public void add(Fragment fragment, String title) {
fragmentList.add(fragment);
titleList.add(title);
}
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
@Override
public int getCount() {
return fragmentList.size();
}
@Override
public CharSequence getPageTitle(int position) {
return titleList.get(position);
}
}
public static class TabFragment extends Fragment {
private String title;
public static TabFragment newInstance(String title) {
TabFragment tabFragment = new TabFragment();
Bundle args = new Bundle();
args.putString("title", title);
tabFragment.setArguments(args);
return tabFragment;
}
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
title = getArguments().getString("title");
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
TextView tv = new TextView(container.getContext());
tv.setText(title);
return tv;
}
}
在繼承FragmentPagerAdapter時(shí)，會(huì)重寫(xiě)getPageTitle()方法至耻，返回當(dāng)前頁(yè)面的標(biāo)題若皱。
TabLayout.setupWithViewPager()綁定ViewPager和TabLayout镊叁。
另外
大多數(shù)時(shí)候，這個(gè)應(yīng)該都會(huì)跟AppBarLayout配合一起使用：
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tab_layout"></android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
-
android:theme="@style/AppTheme.AppBarOverlay"上一篇提過(guò)走触，是定義在styles.xml中的晦譬。
設(shè)置之后，背景顏色就會(huì)變成styles.xml中的colorPrimary顏色互广，字體顏色就會(huì)變成白色敛腌，非常方便。
