ViewPager+PagerTabStrip實現Tab效果：（ViewPager預設滑動導航條效果）

public class PagerTabStrip extends PagerTitleStrip

java.lang.Object
    ↳ android.view.View
        ↳android.view.ViewGroup
            ↳ android.support.v4.view.PagerTitleStrip
                ↳ android.support.v4.view.PagerTabStrip

（一）說明

官網原文：
PagerTabStrip is an interactive indicator of the current, next, and previous pages of a ViewPager. It is intended to be used as a child view of a ViewPager widget in your XML layout. Add it as a child of a ViewPager in your layout file and set its android:layout_gravity to TOP or BOTTOM to pin it to the top or bottom of the ViewPager. The title from each page is supplied by the method getPageTitle(int) in the adapter supplied to the ViewPager.

For a non-interactive indicator, see PagerTitleStrip.

大致意思：
PagerTabStrip是一個能為ViewPager指示上一個頁面、當前頁面，下一個頁面的可互動的指示器。需要在佈局檔案中把它寫作ViewPager的一個子檢視，並設定他的android:layout_gravity屬性值為TOP或BOTTOM來把他放置在ViewPager的頂部或者底部。每一頁的標題需要在介面卡中通過方法getPageTitle(int) 提供給ViewPager。

如果需要不具互動性的指示器，檢視PagerTitleStrip。

（二）ViewPager 實現帶滑動導航條選項卡的步驟：

1. 特殊的佈局檔案；
   ViewPager：<android.support.v4.view.ViewPager>
   &
   PagerTabStrip：<android.support.v4.view.PagerTabStrip>
   或
   PagerTitleStrip：<android.support.v4.view.PagerTitleStrip>

2. 通過findViewById()方法來例項化ViewPager和PagerTabStrip；

3. 設定PagerTabStrip；
   
   • 通過PagerTabStrip 物件的setTextColor()方法設定導航條文字顏色；
   • 通過PagerTabStrip 物件的setBackgroundColor ()方法設定導航條背景顏色；
   • 通過PagerTabStrip 物件的setDrawFullUnderline()方法設定導航條下方是否有完整下劃線顏色；
   • 通過PagerTabStrip 物件的setTabIndicatorColor()方法設定導航條文字下方的指示顏色；
   • 通過PagerTabStrip 物件的setTextSpacing()方法設定導航條文字的間隔。

主要程式碼如下：
MainActivity.java

package com.noonecode.viewpagerpagertabstripdemo;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.util.TypedValue;

public class MainActivity extends FragmentActivity {

    private ViewPager mViewPager;
    private PagerTabStrip mPagerTabStrip;

    private List<String> titles;// 標題
    private List<Fragment> fragments;// 頁面
    private MyAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initViews();
        initData();
    }

    private void initViews() {
        mViewPager = (ViewPager) findViewById(R.id.viewpager);
        mPagerTabStrip = (PagerTabStrip) findViewById(R.id.pagertabstrip);
        mPagerTabStrip.setBackgroundColor(Color.RED);// 背景顏色
        mPagerTabStrip.setTextColor(Color.WHITE);// 標題顏色，這裡需要帶透明度的顏色值
        mPagerTabStrip.setTabIndicatorColor(Color.YELLOW);// 指示器顏色，這裡需要帶透明度的顏色值
        mPagerTabStrip.setTextSize(TypedValue.COMPLEX_UNIT_SP, 26);// 字型大小
    }

    private void initData() {
        titles = new ArrayList<String>(Arrays.asList("娛樂", "經濟", "教育", "軍事"));

        fragments = new ArrayList<Fragment>();
        fragments.add(new Fragment1());
        fragments.add(new Fragment2());
        fragments.add(new Fragment3());
        fragments.add(new Fragment4());

        adapter = new MyAdapter(getSupportFragmentManager());
        mViewPager.setAdapter(adapter);
    }

    class MyAdapter extends FragmentPagerAdapter {

        public MyAdapter(FragmentManager fm) {
            super(fm);
        }

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

        @Override
        public int getCount() {
            return fragments.size();
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return titles.get(position);
        }
    }
}

activity_main.xml

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
  tools:context="com.noonecode.viewpagerpagertabstripdemo.MainActivity" >

    <android.support.v4.view.PagerTabStrip
        android:id="@+id/pagertabstrip"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top" />

</android.support.v4.view.ViewPager>

每個Fragment中只有一個TextView，程式碼不再貼出來。

執行效果展示：

注意

• PagerTabStrip設定的顏色值是有透明度的，未設定透明度將看不到預期的效果

（完畢）