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"&g
9c7f
t;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就将错误代码注释掉= -！