PagerTabStrip简单使用方式1

效果图示例：

 

 

 

 

 

 

//res/layout下5个布局1、activity_main.xml 2、fragment_view1.xml 3、fragment_view2.xml
//4、fragment_view3.xml 5、fragment_view4.xml

 

 

1、activity_main.xml布局

代码

<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"
    tools:context="${relativePackage}.${activityClass}" >
<!-- ViewPager相当于一个容器包裹PagerTabStrip -->
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/pagerTabStrip"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </android.support.v4.view.ViewPager>

</RelativeLayout>

 

 

================

 

 

2、fragment_view1.xml布局

代码

<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"
    tools:context="${relativePackage}.${activityClass}" >

    <TextView
        android:id="@+id/textview1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="这是记录页面"/>

</RelativeLayout>

 

=================

3、fragment_view2布局

代码

<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"
    tools:context="${relativePackage}.${activityClass}" >

    <TextView
        android:id="@+id/textview2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="这是联系人页面"/>

</RelativeLayout>

 

=====================

4、fragment_view3布局

代码

<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"
    tools:context="${relativePackage}.${activityClass}" >

    <TextView
        android:id="@+id/textview3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="这是收藏夹页面"/>

</RelativeLayout>

 

===================

5、fragment_view4布局

代码

<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"
    tools:context="${relativePackage}.${activityClass}" >

    <TextView
        android:id="@+id/textview4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="这是群组页面"/>

</RelativeLayout>

 

 

 

=====================

6、MainActivity.java类

代码

 

public class MainActivity extends Activity {

 private ViewPager viewPager;
 private PagerTabStrip pagerTabStrip;
 
 private List<View> list_view;
 private List<String> list_title;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  
  this.viewPager = (ViewPager) this.findViewById(R.id.viewPager);
  this.pagerTabStrip = (PagerTabStrip) this.findViewById(R.id.pagerTabStrip);
  
  //设置pagerTabStrip的一些需要属性
  pagerTabStrip.setTextColor(Color.WHITE);//字体颜色白色
  pagerTabStrip.setBackgroundColor(Color.BLACK);//背景黑色
  pagerTabStrip.setDrawFullUnderline(true);//设置下划线
  pagerTabStrip.setTabIndicatorColor(Color.CYAN);//选中的下划线颜色
  pagerTabStrip.setTextSpacing(40);//每个tab的间隔
  
  list_view = new ArrayList<View>();
  LayoutInflater inflater = LayoutInflater.from(this);
  list_view.add(inflater.inflate(R.layout.fragment_view1, null));
  list_view.add(inflater.inflate(R.layout.fragment_view2, null));
  list_view.add(inflater.inflate(R.layout.fragment_view3, null));
  list_view.add(inflater.inflate(R.layout.fragment_view4, null));
  
  list_title = new ArrayList<String>();
  list_title.add("记录");
  list_title.add("联系人");
  list_title.add("收藏夹");
  list_title.add("群组");
  
  viewPager.setAdapter(new MyPagerAdapter(list_view));
  
 }
 class MyPagerAdapter extends PagerAdapter{
  
  private List<View> list_view;
  public MyPagerAdapter(List<View> list_view) {
   this.list_view = list_view;
  }

  @Override
  public int getCount() {
   return this.list_view.size();
  }
  
  @Override
  public boolean isViewFromObject(View arg0, Object arg1) {
   return arg0 == arg1;
  }
  
  @Override
  public Object instantiateItem(ViewGroup container, int position) {
   container.addView(this.list_view.get(position));
   return this.list_view.get(position);
  }
  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
   container.removeView(this.list_view.get(position));
  
  //把pagerTabStrip和ViewPager关联起来
  @Override
  public CharSequence getPageTitle(int position) {
   return list_title.get(position);
  }
 }
}