ViewPager Details (3) - - Similarities and Differences between PagerTabStrip and PagerTitleStrip in Adding Title Bars

This article has been included in:

Copyright Statement: This article is the original article of the blogger. It can not be reproduced without the permission of the blogger.

Catalog (?)[+]

1. A Pager TitleStrip
   1. Class Overview
   2. XML layout file
   3. Rewrite the adapter's getPageTitle function
      1. variable
      2. Initialization
      3. Rewriting CharSequence getPageTitleint function
2. Two PagerTabStrip
   1. Class Overview
   2. XML Layout
   3. Rewrite the adapter's getPageTitle function
   4. Extending PagerTabStrip property changes
      1. Change the underline color
      2. Add the title rewrite adapter CharSequence getPageTitleint method
3. Third Summary

Foreword: In the first two articles, we explained the realization method of sliding pages and the significance of the four functions. But sometimes, it is not enough to only realize sliding pages, but also to have a title bar to appear more friendly. So in this article, I will show you in Android PagerTabStrip and PagerTitleStrip, two controls in the. support.v4 package, are used to implement the title bar, but they are different. In this article, we will talk about what functions they can achieve, and what similarities and differences they have.

Related articles:

1,ViewPager Details (1) - Basic Introduction

2,ViewPager Explanation (2) - Explaining the Four Functions in detail

3,ViewPager Details (3) - - Similarities and Differences between Pager TabStrip and Pager TitleStrip Adding Title Bar

4. ViewPager Explanation (IV) - Autonomous Implementation of Sliding Indicators

5. "ViewPager Details (V) - - Using Fragment to Realize ViewPager Sliding"

PagerTitleStrip

First look at a simple, first on the effect map, to attract everyone's attention.

The sliding between the three pages is a sliding with the title above.

  

Take a look at android's official explanation of PagerTabStrip:

Class Overview

PagerTitleStrip is a non-interactive indicator of the current, next, and previous pages of a ViewPager. It is intended to be used as a child view of a ViewPager widget in your XML layout. Add it as a child of a ViewPager in your layout file and set its android:layout_gravity to TOP or BOTTOM to pin it to the top or bottom of the ViewPager. The title from each page is supplied by the methodgetPageTitle(int) in the adapter supplied to the ViewPager.

For an interactive indicator, see PagerTabStrip.

Translation:

PagerTabStrip is a non-interactive indicator of ViewPager for the current page, the previous page and the next page. It is often added to an XML layout file as a child control of the ViewPager control. In your layout file, add it as a child control to the ViewPager. And set its android:layout_gravity property to TOP or BOTTOM to display it at the top or bottom of the ViewPager. The title of each page is through the adapter getPageTitle(int) The function is provided to ViewPager.

I may not translate very smoothly, and English is not very difficult here. You should be able to understand it, but I still focus on two points:

1. First of all, it is mentioned that in your layout file, add it as a child control in the ViewPager.

2. Second, capturing the title is obtained by rewriting the adapter's getPageTitle(int) function.

From these two points, we can see the code:

1. XML layout file:

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     tools:context="com.example.testviewpage_2.MainActivity" >  
6.   
7.     <android.support.v4.view.ViewPager  
8.         android:id="@+id/viewpager"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="200dip"  
11.         android:layout_gravity="center">  
12.           
13.         <android.support.v4.view.PagerTitleStrip  
14.             android:id="@+id/pagertitle"    
15.             android:layout_width="wrap_content"    
16.             android:layout_height="wrap_content"    
17.             android:layout_gravity="top"  
18.             />  
19.           
20.     </android.support.v4.view.ViewPager>  
21.   
22. </RelativeLayout>  

<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="com.example.testviewpage_2.MainActivity" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="200dip"
        android:layout_gravity="center">
        
        <android.support.v4.view.PagerTitleStrip
            android:id="@+id/pagertitle"  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:layout_gravity="top"
            />
        
    </android.support.v4.view.ViewPager>

</RelativeLayout>

It's clear that we will embed. PagerTitleStrip as a child control of ViewPager directly; this is the first step; of course, the value of android:layout_gravity="" should be set to top or bottom. Display the title bar at the top or bottom.

2. Rewrite the getPageTitle () function of the adapter

It's easy for you to have a general understanding. First paste the global code, and then say it one by one. This code is ViewPager Explanation (2) - Explaining the Four Functions in detail If it's not clear, read this article first.

1. package com.example.testviewpage_2;  
2. /** 
3.  * @author  harvic 
4.  * @date 2014.8.12 
5.  */  
6. import java.util.ArrayList;  
7. import java.util.List;  
8. import android.app.Activity;  
9. import android.os.Bundle;  
10. import android.support.v4.view.PagerAdapter;  
11. import android.support.v4.view.PagerTitleStrip;  
12. import android.support.v4.view.ViewPager;  
13. import android.view.LayoutInflater;  
14. import android.view.View;  
15. import android.view.ViewGroup;  
16.   
17. public class MainActivity extends Activity {  
18.   
19.     private View view1, view2, view3;  
20.     private List<View> viewList;//view array  
21.     private ViewPager viewPager; //The corresponding viewPager  
22.       
23.     private List<String> titleList;  //Title list array  
24.       
25.     @Override  
26.     protected void onCreate(Bundle savedInstanceState) {  
27.         super.onCreate(savedInstanceState);  
28.         setContentView(R.layout.activity_main);  
29.         viewPager = (ViewPager) findViewById(R.id.viewpager);  
30.         LayoutInflater inflater = getLayoutInflater();  
31.         view1 = inflater.inflate(R.layout.layout1, null);  
32.         view2 = inflater.inflate(R.layout.layout2, null);  
33.         view3 = inflater.inflate(R.layout.layout3, null);  
34.   
35.         viewList = new ArrayList<View>();//Load the View to be paginated into an array  
36.         viewList.add(view1);  
37.         viewList.add(view2);  
38.         viewList.add(view3);  
39.           
40.         titleList = new ArrayList<String>();//Title data for each page  
41.         titleList.add("Wang Peng");  
42.         titleList.add("Jiang dialect");  
43.         titleList.add("marry");  
44.   
45.         PagerAdapter pagerAdapter = new PagerAdapter() {  
46.   
47.             @Override  
48.             public boolean isViewFromObject(View arg0, Object arg1) {  
49.                 // TODO Auto-generated method stub  
50.                 //According to the key passed in, find the view, and determine whether it is the same view as the parameter View arg0 passed in.  
51.                 return arg0 == viewList.get((int)Integer.parseInt(arg1.toString()));  
52.             }  
53.   
54.             @Override  
55.             public int getCount() {  
56.                 // TODO Auto-generated method stub  
57.                 return viewList.size();  
58.             }  
59.   
60.             @Override  
61.             public void destroyItem(ViewGroup container, int position,  
62.                     Object object) {  
63.                 // TODO Auto-generated method stub  
64.                 container.removeView(viewList.get(position));  
65.             }  
66.   
67.             @Override  
68.             public Object instantiateItem(ViewGroup container, int position) {  
69.                 // TODO Auto-generated method stub  
70.                 container.addView(viewList.get(position));  
71.                   
72.                 //Pass the position of the current new view as Key  
73.                 return position;  
74.             }  
75.               
76.             @Override  
77.             public CharSequence getPageTitle(int position) {  
78.                 // TODO Auto-generated method stub  
79.                 return titleList.get(position);  
80.             }  
81.         };  
82.   
83.         viewPager.setAdapter(pagerAdapter);  
84.   
85.     }  
86.   
87. }  

package com.example.testviewpage_2;
/**
 * @author  harvic
 * @date 2014.8.12
 */
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTitleStrip;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class MainActivity extends Activity {

	private View view1, view2, view3;
	private List<View> viewList;// view array
	private ViewPager viewPager; // The corresponding viewPager
	
	private List<String> titleList;  //Title list array
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		viewPager = (ViewPager) findViewById(R.id.viewpager);
		LayoutInflater inflater = getLayoutInflater();
		view1 = inflater.inflate(R.layout.layout1, null);
		view2 = inflater.inflate(R.layout.layout2, null);
		view3 = inflater.inflate(R.layout.layout3, null);

		viewList = new ArrayList<View>();// Load the View to be paginated into an array
		viewList.add(view1);
		viewList.add(view2);
		viewList.add(view3);
		
		titleList = new ArrayList<String>();// Title data for each page
		titleList.add("Wang Peng");
		titleList.add("Jiang dialect");
		titleList.add("marry");

		PagerAdapter pagerAdapter = new PagerAdapter() {

			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {
				// TODO Auto-generated method stub
				//According to the key passed in, find the view and determine whether it is the same view as the parameter View arg0 passed in.
				return arg0 == viewList.get((int)Integer.parseInt(arg1.toString()));
			}

			@Override
			public int getCount() {
				// TODO Auto-generated method stub
				return viewList.size();
			}

			@Override
			public void destroyItem(ViewGroup container, int position,
					Object object) {
				// TODO Auto-generated method stub
				container.removeView(viewList.get(position));
			}

			@Override
			public Object instantiateItem(ViewGroup container, int position) {
				// TODO Auto-generated method stub
				container.addView(viewList.get(position));
				
				//Pass the position of the current new view as Key
				return position;
			}
			
			@Override
			public CharSequence getPageTitle(int position) {
				// TODO Auto-generated method stub
				return titleList.get(position);
			}
		};

		viewPager.setAdapter(pagerAdapter);

	}

}

Comparisons ViewPager Explanation (2) - Explaining the Four Functions in detail A change has been made here:

1. Variables

1. private List<String> titleList;  //Title list array  

private List<String> titleList;  //Title list array

A String array is applied to store the titles corresponding to the three pages.

2. Initialization

1. titleList = new ArrayList<String>();//Title data for each page  
2. titleList.add("Wang Peng");  
3. titleList.add("Jiang dialect");  
4. titleList.add("marry");  

titleList = new ArrayList<String>();// Title data for each page
titleList.add("Wang Peng");
titleList.add("Jiang dialect");
titleList.add("marry");

In the initialization phase, such an array of initialization code is added.

3. Rewrite CharSequence getPageTitle(int) function

1. @Override  
2. public CharSequence getPageTitle(int position) {  
3.     // TODO Auto-generated method stub  
4.     return titleList.get(position);  
5. }  

@Override
public CharSequence getPageTitle(int position) {
	// TODO Auto-generated method stub
	return titleList.get(position);
}

Returns the current title according to the location.

As you can see, in fact, just rewrite the getPageTitle () function and return it to different strings according to different locations to achieve the above title bar function. The first and second steps about arrays and initialization are actually this step. In fact, we can completely replace them with the following code:

1. @Override  
2. public CharSequence getPageTitle(int position) {  
3.     // TODO Auto-generated method stub  
4.     switch (position) {  
5.     case 0:  
6.         return "Wang Peng";  
7.     case 1:  
8.         return "Jiang dialect";  
9.     case 2:  
10.         return "marry";  
11.   
12.     default:  
13.         return "";  
14.     }  
15. }  

@Override
public CharSequence getPageTitle(int position) {
	// TODO Auto-generated method stub
	switch (position) {
	case 0:
		return "Wang Peng";
	case 1:
		return "Jiang dialect";
	case 2:
		return "marry";

	default:
		return "";
	}
}

The effect is the same, but the code is not easy to maintain. Okay, let's talk about PagerTabStrip first.

PagerTabStrip

Similarly, let's see how PagerTabStrip works.

This example is based on ViewPager Details (1) - Basic Introduction On the basis of the change;

    

There may not be much difference between the two implementations. In fact, the effect of the two implementations is almost the same, but there are two differences:

1. PagerTabStrip has an underline under the current page to indicate which Tab is on the current page.

2. The Tab of PagerTabStrip is clickable. When a user clicks on a Tab, the current page will jump to the page. PagerTitleStrip does not have this function.

Similarly, first look at the official interpretation of PagerTabStrip:

Class Overview

PagerTabStrip is an interactive indicator of the current, next, and previous pages of a ViewPager. It is intended to be used as a child view of a ViewPager widget in your XML layout. Add it as a child of a ViewPager in your layout file and set its android:layout_gravity to TOP or BOTTOM to pin it to the top or bottom of the ViewPager. The title from each page is supplied by the methodgetPageTitle(int) in the adapter supplied to the ViewPager.

For a non-interactive indicator, see PagerTitleStrip.

Translation:

PagerTabStrip is an interactive indicator of ViewPager for the current page, the previous page and the next page. It is often added to an XML layout file as a child control of the ViewPager control. In your layout file, add it as a child control to the ViewPager. And to get its android:layout_gravity Property is set to TOP or BOTTOM to display it at the top or bottom of the ViewPager. The title of each page is through the adapter getPageTitle(int) The function is provided to ViewPager.

As you can see, except for the first sentence, other sentences have exactly the same interpretation as Pager TitleStrip. That's the same usage. It's just that PagerTabStrip is interactive, and PagerTitleStrip is not. For the difference in which location, that is, the two points above (click and underline the indicator bar).

The usage is exactly the same as that of PagerTitleStrip, namely:

1. First of all, it is mentioned that in your layout file, add it as a child control in the ViewPager.

2. Second, capturing the title is obtained by rewriting the adapter's getPageTitle(int) function.

Look at examples:

1. XML Layout

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     tools:context="com.example.testviewpage_2.MainActivity" >  
6.   
7.     <android.support.v4.view.ViewPager  
8.         android:id="@+id/viewpager"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:layout_gravity="center">  
12.           
13.                 <android.support.v4.view.PagerTabStrip  
14.             android:id="@+id/pagertab"  
15.             android:layout_width="match_parent"  
16.             android:layout_height="wrap_content"   
17.             android:layout_gravity="top"/>  
18.           
19.     </android.support.v4.view.ViewPager>  
20.   
21. </RelativeLayout>  

<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="com.example.testviewpage_2.MainActivity" >

    <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.PagerTabStrip
            android:id="@+id/pagertab"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" 
            android:layout_gravity="top"/>
        
    </android.support.v4.view.ViewPager>

</RelativeLayout>

As you can see, again, PagerTabStrip is inserted directly into ViewPager as a child control, and of course, the value of android:layout_gravity="" is set to top or bottom as well.

2. Rewrite the getPageTitle () function of the adapter

All code:

1. package com.example.testviewpage_2;  
2.   
3. /** 
4.  * @author  harvic 
5.  * @date 2014.8.13 
6.  */  
7. import java.util.ArrayList;  
8. import java.util.List;  
9.   
10. import android.app.Activity;  
11. import android.os.Bundle;  
12. import android.support.v4.view.PagerAdapter;  
13. import android.support.v4.view.ViewPager;  
14. import android.view.LayoutInflater;  
15. import android.view.View;  
16. import android.view.ViewGroup;  
17.   
18. public class MainActivity extends Activity {  
19.   
20.     private View view1, view2, view3;  
21.     private List<View> viewList;//view array  
22.     private ViewPager viewPager; //The corresponding viewPager  
23.   
24.     private List<String> titleList;  
25.   
26.     @Override  
27.     protected void onCreate(Bundle savedInstanceState) {  
28.         super.onCreate(savedInstanceState);  
29.         setContentView(R.layout.activity_main);  
30.   
31.         viewPager = (ViewPager) findViewById(R.id.viewpager);  
32.         LayoutInflater inflater = getLayoutInflater();  
33.         view1 = inflater.inflate(R.layout.layout1, null);  
34.         view2 = inflater.inflate(R.layout.layout2, null);  
35.         view3 = inflater.inflate(R.layout.layout3, null);  
36.   
37.         viewList = new ArrayList<View>();//Load the View to be paginated into an array  
38.         viewList.add(view1);  
39.         viewList.add(view2);  
40.         viewList.add(view3);  
41.   
42.         titleList = new ArrayList<String>();//Title data for each page  
43.         titleList.add("Wang Peng");  
44.         titleList.add("Jiang dialect");  
45.         titleList.add("marry");  
46.   
47.         PagerAdapter pagerAdapter = new PagerAdapter() {  
48.   
49.             @Override  
50.             public boolean isViewFromObject(View arg0, Object arg1) {  
51.                 // TODO Auto-generated method stub  
52.                 return arg0 == arg1;  
53.             }  
54.   
55.             @Override  
56.             public int getCount() {  
57.                 // TODO Auto-generated method stub  
58.                 return viewList.size();  
59.             }  
60.   
61.             @Override  
62.             public void destroyItem(ViewGroup container, int position,  
63.                     Object object) {  
64.                 // TODO Auto-generated method stub  
65.                 container.removeView(viewList.get(position));  
66.             }  
67.   
68.             @Override  
69.             public Object instantiateItem(ViewGroup container, int position) {  
70.                 // TODO Auto-generated method stub  
71.                 container.addView(viewList.get(position));  
72.   
73.                 return viewList.get(position);  
74.             }  
75.   
76.             @Override  
77.             public CharSequence getPageTitle(int position) {  
78.                   
79.                 return titleList.get(position);  
80.             }  
81.         };  
82.   
83.         viewPager.setAdapter(pagerAdapter);  
84.   
85.     }  
86.   
87. }  

package com.example.testviewpage_2;

/**
 * @author  harvic
 * @date 2014.8.13
 */
import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class MainActivity extends Activity {

	private View view1, view2, view3;
	private List<View> viewList;// view array
	private ViewPager viewPager; // The corresponding viewPager

	private List<String> titleList;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		viewPager = (ViewPager) findViewById(R.id.viewpager);
		LayoutInflater inflater = getLayoutInflater();
		view1 = inflater.inflate(R.layout.layout1, null);
		view2 = inflater.inflate(R.layout.layout2, null);
		view3 = inflater.inflate(R.layout.layout3, null);

		viewList = new ArrayList<View>();// Load the View to be paginated into an array
		viewList.add(view1);
		viewList.add(view2);
		viewList.add(view3);

		titleList = new ArrayList<String>();// Title data for each page
		titleList.add("Wang Peng");
		titleList.add("Jiang dialect");
		titleList.add("marry");

		PagerAdapter pagerAdapter = new PagerAdapter() {

			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {
				// TODO Auto-generated method stub
				return arg0 == arg1;
			}

			@Override
			public int getCount() {
				// TODO Auto-generated method stub
				return viewList.size();
			}

			@Override
			public void destroyItem(ViewGroup container, int position,
					Object object) {
				// TODO Auto-generated method stub
				container.removeView(viewList.get(position));
			}

			@Override
			public Object instantiateItem(ViewGroup container, int position) {
				// TODO Auto-generated method stub
				container.addView(viewList.get(position));

				return viewList.get(position);
			}

			@Override
			public CharSequence getPageTitle(int position) {
				
				return titleList.get(position);
			}
		};

		viewPager.setAdapter(pagerAdapter);

	}

}

The code here is exactly the same as PagerTitleStrip, so it's not explained anymore.

In this way, we have finished the simple usage of PagerTabStrip. Here's an extension of PagerTabStrip.

3. Extension: PagerTabStrip property change

In the source code, you can see a project called TestViewPage_PagerTabStrip_extension, run it, the effect is as follows:

    

As you can see in the two figures above, I changed two places:

1. Underline color, original black, I became green;

2. Add a picture before the title of Tab.

Here's how it was changed:

1. Change the underline color:

It mainly relies on PagerTabStrip's setTabIndicatorColorResource method.

The code is as follows:

1. pagerTabStrip = (PagerTabStrip) findViewById(R.id.pagertab);  
2. pagerTabStrip.setTabIndicatorColorResource(R.color.green);  

pagerTabStrip = (PagerTabStrip) findViewById(R.id.pagertab);
pagerTabStrip.setTabIndicatorColorResource(R.color.green);

2. Add Title - Rewrite the adapter CharSequence getPageTitle(int) method

The return value of the CharSequence getPageTitle(int position) method is that instead of returning String objects, we use Spannable String Builder to construct the extended String objects that contain images below.

Specific code is as follows, not to elaborate, you can see the use of Spannable StringBuilder, you can understand.

1. @Override  
2. public CharSequence getPageTitle(int position) {  
3.   
4.     SpannableStringBuilder ssb = new SpannableStringBuilder("  "+titleList.get(position)); // space added before text  
5.                                         // for  
6.     Drawable myDrawable = getResources().getDrawable(  
7.             R.drawable.ic_launcher);  
8.     myDrawable.setBounds(0, 0, myDrawable.getIntrinsicWidth(),  
9.             myDrawable.getIntrinsicHeight());  
10.     ImageSpan span = new ImageSpan(myDrawable,  
11.             ImageSpan.ALIGN_BASELINE);  
12.   
13.     ForegroundColorSpan fcs = new ForegroundColorSpan(Color.GREEN);//Set font color to green  
14.     ssb.setSpan(span, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);//Setting icons  
15.     ssb.setSpan(fcs, 1, ssb.length(),  
16.             Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);//Setting font color  
17.     ssb.setSpan(new RelativeSizeSpan(1.2f), 1, ssb.length(),  
18.             Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
19.     return ssb;  
20. }  

@Override
public CharSequence getPageTitle(int position) {

	SpannableStringBuilder ssb = new SpannableStringBuilder("  "+titleList.get(position)); // space added before text
										// for
	Drawable myDrawable = getResources().getDrawable(
			R.drawable.ic_launcher);
	myDrawable.setBounds(0, 0, myDrawable.getIntrinsicWidth(),
			myDrawable.getIntrinsicHeight());
	ImageSpan span = new ImageSpan(myDrawable,
			ImageSpan.ALIGN_BASELINE);

	ForegroundColorSpan fcs = new ForegroundColorSpan(Color.GREEN);// Font color set to green
	ssb.setSpan(span, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);// Setting icons
	ssb.setSpan(fcs, 1, ssb.length(),
			Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);// Setting font color
	ssb.setSpan(new RelativeSizeSpan(1.2f), 1, ssb.length(),
			Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
	return ssb;
}

Summary

Through the previous explanations, we should clearly understand the similarities and differences between PagerTabStrip and PagerTitleStrip in adding Title bar, but the effect of title bar they achieve is not good, can not specify a page to display one or all at a time, and the title is sliding. So it's doomed that mainstream App s don't use it. So it's just a transition, and we don't recommend using these two things in development.

Why can't you change the sliding characteristics of PagerTabStrip? <Fixed Tabs with android.support.v4.view.PagerTabStrip or ViewPagerIndicator>

Reference article:

Android Multi-Screen Sliding: ViewPager Basic Use and Pager TabStrip Congenital Defects (with Source Code)

android: Modifying the Background Color in PagerTabStrip, the Style, Color and Icon of the Header Font, and the Color of the Indicator Bar

All source codes are packaged together and divided into three parts:

1. Examples of TestViewPage_pagerTitleStrip: pagerTitleStrip Implementation

2. TestViewPage_PagerTabStrip: An Example of PagerTabStrip Implementation

3. TestViewPage_PagerTabStrip_extension: Extended Implementation of PagerTabStrip

Source download address: http://download.csdn.net/detail/harvic880925/7747417

Please respect the copyright of the originator. Please indicate the origin when reproducing: http://blog.csdn.net/harvic880925/article/details/38521865 Thank you!

top 55 step on 0

 

My Similar Articles