"Android Interface Implementation" uses Scrollingtabsview to achieve viewpager effects with sliding tabs

Reprinted from: http://blog.csdn.net/zhaokaiqiang1992/article/details/40378285

In the previous article, we used the Pagertabstrip in the support package to implement the Viewpager effect of sliding labels, and today we'll introduce another open source project to achieve similar results.

In this article, we will use the third-party open source project Viewpagerextensions implementation.

First look at the effect

Viewpagerextensions's github address: https://github.com/astuetz/ViewPagerExtensions

First give the directory structure of the entire project

In this demo, I directly put the resource files in the project, easy to use.

First, let's take a look at the layout file activity_main.xml.

[HTML]View Plaincopy

2. <? XML version= "1.0" encoding="Utf-8"?>
4. <linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
6. xmlns:tools="Http://schemas.android.com/tools"
8. xmlns:app="Http://schemas.android.com/com.heli17.tradeshowcloud"
10. android:layout_width="match_parent"
12. android:layout_height="match_parent"
14. android:orientation="vertical" >
18. <Com.astuetz.viewpager.extensions.ScrollingTabsView
20. android:id="@+id/scrolling_tabs"
22. android:layout_width="fill_parent"
24. android:layout_height="38DP"
26. android:background="@drawable/tab_unselected_holo"
28. app:dividerdrawable="@android: Color/white" />
32. <Android.support.v4.view.ViewPager
34. android:id="@+id/pager"
36. android:layout_width="fill_parent"
38. android:layout_height="fill_parent" />
42. </linearlayout>

In the layout file, we added a Scrollingtabsview control, which is the custom control for the indicator above.

Once the layout is written, we can set up the adapter in the code.

The code is as follows:

[Java]View Plaincopy

2. Package Com.example.scrollingtabsdemo;
6. Import java.util.ArrayList;
10. Import android.app.Activity;
12. Import Android.os.Bundle;
14. Import android.support.v4.app.Fragment;
16. Import android.support.v4.app.FragmentActivity;
18. Import Android.support.v4.app.FragmentManager;
20. Import Android.support.v4.app.FragmentStatePagerAdapter;
22. Import Android.support.v4.view.ViewPager;
24. Import Android.view.View;
26. Import Android.widget.Button;
30. Import Com.astuetz.viewpager.extensions.ScrollingTabsView;
32. Import Com.astuetz.viewpager.extensions.TabsAdapter;
36. Public class Mainactivity extends Fragmentactivity {
40. private Viewpager Viewpager;
42. private Scrollingtabsadapter Scrollingtabsadapter;
44. private Scrollingtabsview Scrollingtabs;
46. private Fragsadapter Pageradapter;
50. @Override
52. protected void OnCreate (Bundle savedinstancestate) {
54. super.oncreate (savedinstancestate);
56. Setcontentview (R.layout.activity_main);
60. Viewpager = (Viewpager) Findviewbyid (R.id.pager);
62. //Set adapter
64. Pageradapter = New Fragsadapter (Getsupportfragmentmanager ());
66. Viewpager.setadapter (Pageradapter);
70. //Set the number of cache fragment
72. Viewpager.setoffscreenpagelimit (2);
74. Viewpager.setcurrentitem (0);
76. Viewpager.setpagemargin (4);
80. Scrollingtabsadapter = New Scrollingtabsadapter (this);
82. //Set the adapter and host Viewpager for sliding labels
84. Scrollingtabs = (Scrollingtabsview) Findviewbyid (r.id.scrolling_tabs);
86. Scrollingtabs.setadapter (Scrollingtabsadapter);
88. Scrollingtabs.setviewpager (Viewpager);
92. }
96. /** 
98. * Viewpager Adapter
100. *
102. * @author Zhaokaiqiang
104. *
106. */
108. private class Fragsadapter extends Fragmentstatepageradapter {
112. private arraylist<fragment> fragments;
116. Public Fragsadapter (fragmentmanager FM) {
118. super (FM);
122. Fragments = new arraylist<fragment> ();
124. For (int i = 0; i < scrollingTabsAdapter.mTitles.length; i++) {
126. Fragments.add (new Myfragment (i));
128. }
132. }
136. @Override
138. public int GetCount () {
140. return fragments.size ();
142. }
146. @Override
148. Public Fragment GetItem (int position) {
150. return Fragments.get (position);
152. }
154. }
158. /** 
160. * Slide Label Adapter
162. *
164. * @author Zhaokaiqiang
166. *
168. */
170. private class Scrollingtabsadapter implements Tabsadapter {
174. private Activity Mcontext;
176. Public string[] mtitles = { "home", "recommended", "latest", "entertainment", "settings"};
180. Public Scrollingtabsadapter (Activity ctx) {
182. this.mcontext = CTX;
184. }
188. @Override
190. Public View GetView (int position) {
194. button tab = (Button) mcontext.getlayoutinflater (). Inflate (
196. R.layout.tab_scrolling, null);
198. Tab.settext (Mtitles[position]);
200. return tab;
202. }
206. }
210. }

In the code, we need to set up two adapters, one is Viewpager, to replace the display of the fragment, and the other is the Sliding tab layout, to control the layout of each tab display, returned in the GetView method.

Here r.layout.tab_scrolling is a custom layout, the code is as follows:

[HTML]View Plaincopy

2. <? XML version= "1.0" encoding="Utf-8"?>
4. <button xmlns:android="http://schemas.android.com/apk/res/android"
6. android:layout_width="0DP"
8. android:layout_height="wrap_content"
10. android:background="@drawable/tab_holo"
12. android:gravity="center"
14. android:paddingbottom="8DP"
16. android:paddingleft="30dip"
18. android:paddingright="30dip"
20. android:paddingtop="8DP"
22. android:textcolor="@android: Color/holo_blue_light"
24. android:textsize="16sp" />

You can make changes according to your needs.

This sliding tab is suitable for many situations, so the choice of VIEWPAGR adapter is fragmentpagerstateadapter, if the sliding interface is below 3 or 3, it is recommended to use Fixedtabsview, Using the same method as this, in addition, Viewpager adapter for fragmentpageradapter more appropriate.

Demo GitHub address for this project: Https://github.com/ZhaoKaiQiang/ScrollingTabsDemo

"Android Interface Implementation" uses Scrollingtabsview to achieve viewpager effects with sliding tabs