Android5.0材料设计（二）

()TabLayout

TabLayout和ViewPager是最佳组合

()实现方式

布局

<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">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="50dp">

    <android.support.design.widget.TabLayout
        android:id="@+id/tab_tl"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|enterAlways"
        app:tabIndicatorColor="#df4138"
        app:tabMinWidth="100dp"
        app:tabMode="scrollable"
        app:tabSelectedTextColor="#df4138"
        app:tabTextColor="#333333" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_gravity="bottom"
        android:background="#cccccc" />

</FrameLayout>

<android.support.v4.view.ViewPager
    android:id="@+id/tab_vp"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:background="@android:color/white" />

</LinearLayout>

app:tabIndicatorColor 设置TabLayout中tab选中时指标(Indicator)的颜色

app:tabMinWidth 设置TabLayout中tab的最少宽度

app:tabMode 设置TabLayout能否滚动，scrollable表示可以滚动tab，fixed表示不可以滚动tab

app:tabSelectedTextColor 设置TabLayout中tab选中时字体的颜色

app:tabGravity 设置TabLayout的位置，center表示所有的tab在屏幕的中间，fill表示所有的可用空间给每个tab。如果 tabMode 是设置成 scrollable 的，则这个属性将会被忽略

Activity

 ViewPager tabVp = (ViewPager) findViewById(R.id.tab_vp);
    TabPagAdapter adapter = new TabPagAdapter(getSupportFragmentManager(), this);
    tabVp.setAdapter(adapter);

    //自动调用ViewPager
    mTabLayout.setupWithViewPager(tabVp);

Adapter

 private String tabTitles[] = new String[]{"Tab1", "Tab2", "Tab3", "Tab4", "Tab5", "Tab6", "Tab7", "Tab8", "Tab9"};
private Context context;

public TabPagAdapter(FragmentManager fm, Context context) {
    super(fm);
    this.context = context;
}

@Override
public Fragment getItem(int position) {
    return TabFragment.newInstance(position + 1);
}

@Override
public int getCount() {
    return tabTitles.length;
}

@Override
public CharSequence getPageTitle(int position) {
    return tabTitles[position];
}

Fragment

public static final String ARG_PAGE = "ARG_PAGE";

private int mPage;

public static TabFragment newInstance(int page) {
    Bundle args = new Bundle();
    args.putInt(ARG_PAGE, page);
    TabFragment fragment = new TabFragment();
    fragment.setArguments(args);
    return fragment;
}


@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mPage = getArguments().getInt(ARG_PAGE);
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_page, container, false);
    TextView textView = (TextView) view;
    textView.setText("Fragment #" + mPage);
    return view;
}

可以给TabLayout设置一些Listener:

OnTabSelectedListener - Tab被选中时，触发的Listener
TabLayoutOnPageChangeListener
ViewPagerOnTabSelectedListener