先来看一下我们实现的大致效果是：
这是我们使用了一个github上面的一个ViewPageIndicator这个第三方库，Indicator的意思就是指示器，意思就是用来给viewpaper来指示的意思。
使用的话，首先我们先得去Github上面下载这个库，下载地址：https:///JakeWharton/Android-ViewPagerIndicator，下载下来之后你可以运行例子，来看看我们需要什么样的效果，然后在此基础上改成我们自己想要的效果
sample是提供给我们的例子，library是库工程，我们需要将其作为我们自己项目的依赖库，我们新建一个Android工程，将library导入工程我就不介绍了，比较简单相信大家都会，不知道的可以看看这篇文章
注：如果你新建的项目libs目录下面有android-support-v4.jar，你要将其删除，因为ViewPageIndicator里面有这个库，我们项目中不允许两个android-support-v4.jar，不删除我们的项目不能编译的
把第三方库添加到我们的项目中之后就可以开始正式愉快的编程了，毕竟站在巨人的肩膀上，可以更加轻松的看的更远。
首先我们先要设置xml布局文件，代码如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http:///apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.viewpagerindicator.TabPageIndicator
android:background="#C5DAED"
android:id="@+id/tabpageindicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
></com.viewpagerindicator.TabPageIndicator>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager>
</LinearLayout>上面的com.viewpaperindicator.TabPageIndicator控件就是我们通过ViewPageIndicator这个库添加进来的，
viewpaper是v4自带的控件。
xml文件设置好了之后，我们就可以在活动中加载这个布局进行使用了，代码如下;
public class firstFragment extends android.support.v4.app.Fragment{
private ViewPager viewPager;
public TabPageIndicator tabpageindicator;
public static String[] title={"业界","移动","研发","程序员","云计算"};
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view=inflater.inflate(R.layout.firstfragment, container,false);
//碎片加载视图，特别要注意这第三个参数false，这个决定了view是否脱离container这个父容器
viewPager=(ViewPager) view.findViewById(.viewpager);
viewPager.setAdapter(new viewpaperAdapter(getFragmentManager()));
//加载viewpaper并且设置它的适配器
tabpageindicator=(TabPageIndicator) view.findViewById(.tabpageindicator);
tabpageindicator.setViewPager(viewPager);
//加载viewpaper指示器，并且将上面的viewpaper设置到viewpaper指示器
return view;
}
//这个是我们自己设定的viewpaperAdapter适配器因为我们要让viewpaper的item是碎片，所以我们继承
//FragmentPagerAdapter,并且重写其方法。
public class viewpaperAdapter extends FragmentPagerAdapter
{
public viewpaperAdapter(FragmentManager fm) {
super(fm);
// TODO Auto-generated constructor stub
}
//设置viewpaper的item的title
@Override
public CharSequence getPageTitle(int position) {
// TODO Auto-generated method stub
return title[position];
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return title.length;
}
//更换item返回不同的碎片
@Override
public android.support.v4.app.Fragment getItem(int arg0) {
// TODO Auto-generated method stub
Log.i("viewpager",String.valueOf(arg0));
newsFragment news=new newsFragment(arg0);
return news;
}
}
}这已经是第二次写下面的一部分了，上一回已经写好了，但是坑爹的浏览器突然崩溃了，结果老天又给了我一次复习的机会，真是感动死我了，好，我们言归正传，你可以发现上面的代码其实很简单，和ViewpageIndicator相关代码只有tabpageindicator.setViewPager(viewPager);这一句，别的关于viewpaper的代码基本没有特别之处，只有一个自己定义FragmentAdapter需要重载public CharSequence getPageTitle(int position)；从而设置每个item的标题。
这时候相信你心中肯定有一个疑问：那么如果我要设置ViewpageIndicator的样式，怎么办啊？难道我要去修改这个库里面的文件吗？当然不要啦，如果需要的话，那么和我们自己实现那个库有什么两样，下面我就将这个绝技传授与你:
(1):在项目目录下res/values/styles.xml修改自己想要的样式，具体代码如下:
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<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>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<!-- 这里就是我们自己定义的样式 -->
<style name="MyTheme" parent="AppBaseTheme">
<!-- 修改这个vpiTabPageIndicatorStyle的样式就可以达到修改ViewPageIndicator的效果 -->
<item name="vpiTabPageIndicatorStyle">@style/MyWidget.TabPageIndicator</item>
</style>
<!-- 在这里修改ViewpageIndicator的样式 -->
<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>
</resources>修改好了样式，我们应该到哪里去用尼？当然是配置文件中去啦，下面列出我的AndroidManifest文件.
<application
android:name="com.example.myapplication.myApplication"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme"
>
<activity
android:name="com.example.myfragment.MainActivity"
android:label="@string/app_name"
<!-- 这里应用我们自己定义的样式 -->
android:theme="@style/MyTheme" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name="com.example.myfragment.Newcontent"
></activity>
</application>这里关于viewpage和viewpageindicator实现的CSDN客户端的Tab标签功能就大功告成了。自己也试试吧，come on！
