ViewPagerIndicator的导入以及实现tab

首先，上github将ViewPagerIndicator下载下来，解压后得到library。

第一步：在android studio中导入library。

File -->  new --> new Module  --> 然后选 import eclipse ADT project ，然后Next  --> 选中library 并命名为 ViewpagerIndicator 然后一路Next 直至finish。

第二步：

File --> Project Structure  在弹出框的左侧下部 ，modules 栏目里选 app 然后点击最右侧上方的Dependencies ，再点最右上角的绿色加号，选 Module Dependency

此时就会出现 Chose Module的对话框，选中里面的选项 : ViewpagerIndicator 然后OK下去。

第三步：调整

找到 ViewpagerIndicator 下面的build.gradle文件，打开后，修改一下这四项，其数值是app文件夹下的bulid.gradle里面的数值一致

compileSdkVersion 22
buildToolsVersion "22.0.1"

minSdkVersion 15
targetSdkVersion 22

此时，若最下方的
dependencies {
    compile 'com.android.support:support-v4:18.+'
}
出现红线，则是版本过低，则按照提示把版本改一下即可，比如这里改成
v4:22+  （因为上面compileSdkVersion 22）

仍有报错，关闭studio 重启。至此，大功告成。

到此ViewPagerIndicator已经成功导入AndroidStudio。

接下来是使用ViewPagerIndicator和ViewPager实现tab。

整体结构是：ViewPager里面是Fragment。

首先是主布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_news"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#C5DAED"
    android:orientation="vertical">
    <com.viewpagerindicator.TabPageIndicator
        android:layout_marginTop="10dp"
        android:id="@+id/vp_indicator"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        >
    </com.viewpagerindicator.TabPageIndicator>
    <android.support.v4.view.ViewPager
        android:id="@+id/sliding_vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

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

主布局定义了TabPageIndicator和ViewPager。可以按ctrl+N搜索类来复制完整名。

接下来是Activity代码：

public class NewsActivity extends FragmentActivity {
    private List<Fragment> list;
    private ViewHolder holder;
    private class ViewHolder{
        ViewPager mViewPager;
        TabPageIndicator mTabPageIndicator;
    }
    //初始化控件
    private void init_view(){
        holder = new ViewHolder();
        holder.mViewPager = (ViewPager) findViewById(R.id.sliding_vp);
        holder.mTabPageIndicator = (TabPageIndicator) findViewById(R.id.vp_indicator);
    }
    //初始化数据
    private void init_data(){
        list = new ArrayList<>();   //定义一个集合来放fragment作为ViewPager适配器的数据源
        list.add(new NewsFragment());
        list.add(new SmileyFragment());
        list.add(new NoteFragment());
        list.add(new DateFragment());

        holder.mViewPager.setAdapter(new TabAdapter(getSupportFragmentManager(), list));
        holder.mTabPageIndicator.setViewPager(holder.mViewPager, 0);
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
//        requestWindowFeature(Window.FEATURE_NO_TITLE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_news);
        init_view();
        init_data();
    }
}

Activity要继承FragmentActivity。因为ViewPagerIndicator和ViewPager的使用要用 v4的fragment 。找到TabPageIndicator和ViewPager的控件，创建ViewPager的数据源，设置ViewPager适配器，TabPageIndicator再设置ViewPager将两者关联起来。

最后是适配器的代码：

public class TabAdapter extends FragmentPagerAdapter {
    public static String[] title = new String[]{"新闻1", "新闻2", "新闻3", "新闻4"};
    private List<Fragment> list;
    public TabAdapter(FragmentManager fm, List<Fragment> list) {
        super(fm);
        this.list = list;
    }

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

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

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

创建一个类（适配器）来继承FragmentPagerAdapter实现getItem和getCount方法还有构造方法。还需要getPageTitle方法用来设置tab标题。

定义一个字符串数组来放标题。因为ViewPager放置Fragment，所以我们将构造方法添加多一个集合放置Fragment。相应的方法传入相应的参数即可。记得创建Fragment和Fragment所需的布局文件，下面就不贴出4个Fragment和4个布局文件了。

最后还需要设置Indicator的样式：

在style.xml文件中加上

<style name="AppBaseTheme" parent="android:Theme.Light">
    <!--
        Theme customizations available in newer API levels can go in
        res/values-vXX/styles.xml, while customizations related to
        backward-compatibility can go here.
    -->
</style>

<style name="MyTheme" parent="AppBaseTheme">
    <item name="vpiTabPageIndicatorStyle">@style/MyWidget.TabPageIndicator</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:animationDuration">5000</item>
    <item name="android:windowContentOverlay">@null</item>
</style>

<style name="MyWidget.TabPageIndicator" parent="Widget">
    <item name="android:gravity">center</item>
    <item name="android:background">@drawable/vpi__tab_indicator</item>
    <item name="android:paddingLeft">22dip</item>
    <item name="android:paddingRight">22dip</item>
    <item name="android:paddingTop">8dp</item>
    <item name="android:paddingBottom">8dp</item>
    <item name="android:textAppearance">@style/MyTextAppearance.TabPageIndicator</item>
    <item name="android:textSize">16sp</item>
    <item name="android:maxLines">1</item>
</style>

<style name="MyTextAppearance.TabPageIndicator" parent="Widget">
    <item name="android:textStyle">bold</item>
    <item name="android:textColor">@android:color/black</item>
</style>

以及在menifest文件中将该主题设置给activity。

<activity android:name=".activity.NewsActivity"
    android:theme="@style/MyTheme"></activity>

ps：如果运行报错没有找到viewpager就将错误代码注释掉= -！