**
首先关联library文件
**在activity_main中**
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.viewpagerindicator.TabPageIndicator
android:id="@+id/tpi"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/tpi" />
</RelativeLayout>
**
**
主类
package com.example.zhidemo;
import com.viewpagerindicator.TabPageIndicator;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
public class MainActivity extends FragmentActivity {
private TabPageIndicator tpi;
private ViewPager vp;
private String type[] = new String[] { "头条", "房产", "另一面", "女人", "财经", "数码",
"情感", "科技", "北京", "娱乐", "游戏", "奥运" };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tpi = (TabPageIndicator) findViewById(R.id.tpi);
vp = (ViewPager) findViewById(R.id.vp);
FragmentManager fragmentManager = getSupportFragmentManager();
vp.setAdapter(new MyFragAdapter(fragmentManager, type));
tpi.setViewPager(vp);
tpi.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
});
}
}
**
**
适配器
package com.example.zhidemo;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.PagerAdapter;
import android.view.View;
public class MyFragAdapter extends FragmentPagerAdapter {
private String type[];
public MyFragAdapter(FragmentManager fm, String type[]) {
super(fm);
this.type = type;
}
@Override
public Fragment getItem(int arg0) {
MyF1 f1 = new MyF1();
Bundle bundle = new Bundle();
bundle.putString("type", type[arg0]);
f1.setArguments(bundle);
return f1;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return type.length;
}
@Override
public CharSequence getPageTitle(int position) {
// TODO Auto-generated method stub
return type[position];
}
}
**
**
适配器中第一个方法
package com.example.zhidemo;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
public class MyF1 extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
return View.inflate(getActivity(), R.layout.f1, null);
}
@Override
public void onActivityCreated(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onActivityCreated(savedInstanceState);
TextView tv = (TextView) getView().findViewById(R.id.F1_tv);
Bundle bundle = getArguments();
String string = bundle.getString("type");
tv.setText(string);
}
}
**
**
清单文件的一些配置:
<uses-sdk
android:minSdkVersion="16"
android:targetSdkVersion="17" />
**
**
风格:
android:theme="@style/StyledIndicators"
**
style.xml文件中
**
<style name="StyledIndicators" parent="@android:style/Theme.Light">
<item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item>
</style>
<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
<item name="android:background">@drawable/tab_indicator</item>
<item name="android:textAppearance">@style/CustomTabPageIndicator.Text</item>
<item name="android:textSize">14sp</item>
<item name="android:dividerPadding">8dp</item>
<item name="android:showDividers">middle</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:paddingRight">10dp</item>
<item name="android:fadingEdge">horizontal</item>
<item name="android:fadingEdgeLength">8dp</item>
</style>
<style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium">
<item name="android:typeface">monospace</item>
<item name="android:textColor">@drawable/selector_tabtext</item>
</style>
**