TabLayout的使用总结

一、引入依赖

在build.gradle中加入compile ‘com.android.support:design:22.2.0’即可。

注意：如果使用的targetSDK是23有话，则加入compile 'com.android.support:design:23.2.0'，依次类推，否则可能报错。

二、布局文件中使用TabLayout

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".activity.MainActivity">

    <android.support.design.widget.TabLayout
        android:id="@+id/tyTop"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/titleBlue"
        app:tabIndicatorColor="@color/white"
        app:tabSelectedTextColor="@color/gray"
        app:tabTextColor="@color/white"/>

    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

app:tabIndicatorColor="@color/white"                 // 下方滚动的下划线颜色
app:tabSelectedTextColor="@color/gray"               // tab被选中后，文字的颜色
app:tabTextColor="@color/white"                      // tab默认的文字颜色

三、设置TabLayout模式

vp = (ViewPager) findViewById(R.id.vp);
tyTop = (TabLayout) findViewById(R.id.tyTop);
tyTop.setTabMode(TabLayout.MODE_FIXED);//设置TabLayout的模式，ViewPager滑动时TabLayout的下滑线也跟着滑动

四、ViewPager的Fragment适配器

package com.lqr.administrator.articlenewsvideospy.adapter;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * @创建者 CSDN_LQR
 * @创建时间 2016/8/19 0019
 * @描述 加载Fragment的ViewPager的页面适配器
 */
public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
    private List<Fragment> mFragmentList;
    private String[] titleArr;

    public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> mFragmentList, String[] titleArr) {
        super(fm);
        this.mFragmentList = mFragmentList;
        this.titleArr = titleArr;
    }


    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }

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

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

五、准备并设置数据

1、string.xml存放TabLayout的Tab标题

<resources>
    <string name="app_name">ArticleNewsVideoSpy</string>
    <string-array name="title_array">
        <item>视频管理</item>
        <item>下载管理</item>
    </string-array>
</resources>

2、获取标题并创建多个Fragment存入集合

//fragment集合
mFragmentList = new ArrayList<>();
mFragmentList.add(new VideoMangerFragment());
mFragmentList.add(new DownloadMangerFragment());
//tagLayout的标题列表
String[] titleArr = this.getResources().getStringArray(R.array.title_array);

3、根据标题创建多个Tab

for (String title : titleArr) {
    tyTop.addTab(tyTop.newTab().setText(title));
}

六、设置ViewPager适配器

vp.setAdapter(new MyFragmentPagerAdapter(getSupportFragmentManager(), mFragmentList, titleArr));//为ViewPager设置适配器，将Fragment和标题交给ViewPager

七、TabLayout与ViewPager关联

tyTop.setupWithViewPager(vp);//将TabLayout与ViewPager关联起来