Android development: ViewPager + ActionBar + Fragment enables responsive slip tabs

The effect we want to achieve today is very common in Android applications. We can see the following two figures, whether it is the built-in Contact application of the system or the AnyView reader application, we can always find this shadow. When we slide the screen, the Tab can be switched accordingly, and when we click the Tab, our screen can also be switched. When it comes to slide, we will immediately think of PagerView and ActionBar, And we will immediately think of the navigation mode of ActionBar. One thing we need to do today is to achieve this effect through the combination of these components.

In general, we may do this: first, use the getActionBar () method to obtain the operation bar, then set the Navigation Mode of the Operation bar to Tab, and add some tabs, then implement the TabListener interface. Secondly, we convert multiple la s into views through the Inflater () method and place them in ViewPager (in fact, ViewPager is a container, you can also change to FrameLayout, so here you can use Fragment to replace it) and implement the OnPageChangeListener interface. Then we can write the following code:

Package com. android. anyViewUI; import java. util. arrayList; 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; import android. app. actionBar; import android. app. actionBar. tab; import android. app. actionBar. tabListener; import android. app. A Ctivity; import android. app. fragmentTransaction; import android. view. layoutInflater; import android. view. view; public class MainActivity extends FragmentActivity implements TabListener, OnPageChangeListener {private ActionBar mActionBar; private ViewPager mViewPager; private TabPagerAdapter mAdapter; private ArrayList <View> mViews; private ArrayList <ActionBar. tab> mTabs; @ Overrideprotected void onCreate (Bun Dle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. layout_main); // obtain ActionBarmActionBar = getActionBar (); // navigate mActionBar by Tab. setNavigationMode (ActionBar. NAVIGATION_MODE_TABS); // disable ActionBar title mActionBar. setDisplayShowTitleEnabled (false); // disable the ActionBar icon mActionBar. setDisplayUseLogoEnabled (false); // disable the ActionBar return key mActionBar. setDisplayShowHomeEnabled (false); // Add TabsmTabs = New ArrayList <ActionBar. tab> (); ActionBar. tab tab0 = mActionBar. newTab (); tab0.setText ("interface 1"); tab0.setTabListener (this); mTabs. add (tab0); mActionBar. addTab (tab0); ActionBar. tab tab1 = mActionBar. newTab (); tab1.setText ("interface 2"); tab1.setTabListener (this); mTabs. add (tab1); mActionBar. addTab (tab1); ActionBar. tab tab2 = mActionBar. newTab (); tab2.setText ("Interface 3"); tab2.setTabListener (this); mTabs. add (tab2); mA CtionBar. addTab (tab2); // get ViewPager mViewPager = (ViewPager) findViewById (R. id. viewPager); // initialize mViews = new ArrayList <View> (); mViews. add (LayoutInflater. from (this ). inflate (R. layout. layout_0, null); mViews. add (LayoutInflater. from (this ). inflate (R. layout. layout_1, null); mViews. add (LayoutInflater. from (this ). inflate (R. layout. layout_2, null); // initialize mAdapter = new TabPagerAdapter (mViews); m ViewPager. setAdapter (mAdapter); mViewPager. setOnPageChangeListener (this); // the second message is displayed by default. setCurrentItem (2) ;}@ Overridepublic void onTabReselected (Tab mTab, FragmentTransaction arg1) {}@ Overridepublic void onTabSelected (Tab mTab, FragmentTransaction arg1) {if (mViewPager! = Null) {mViewPager. setCurrentItem (mTab. getPosition () ;}@ Overridepublic void onTabUnselected (Tab mTab, FragmentTransaction arg1) {}@ Overridepublic void handle (int arg0) {}@ Overridepublic void onPageScrolled (int arg0, float arg1, int arg2) {}@ Overridepublic void onPageSelected (int Index) {// you can specify the current ViewmViewPager. setCurrentItem (Index); // select the corresponding TabmActionBar. selectTab (mTabs. get (Index ));}}

TabPagerAdapter is an adapter class inherited from PagerAdapter:

package com.Android.AnyViewUI;import java.util.ArrayList;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.view.View;public class TabPagerAdapter extends PagerAdapter {private ArrayList<View> mViews;public TabPagerAdapter(ArrayList<View> mViews){this.mViews=mViews;}@Overridepublic void destroyItem(View container, int position, Object object) {((ViewPager)container).removeView(mViews.get(position));}@Overridepublic Object instantiateItem(View container, int position) {((ViewPager)container).addView(mViews.get(position), 0); return mViews.get(position);}@Overridepublic int getCount() {return mViews.size();}@Overridepublic boolean isViewFromObject(View mView, Object mObject) {return (mView==mObject);}}

Our code is logically correct, but when we try to run this code, we find that there is a problem with this code, and the problem lies in OnTabSelected. But let's calm down and think about it. There's nothing wrong, so what exactly is the problem? A friend on the Internet said that the adapter should inherit from FragmentPagerAdapter:

Package com. android. anyViewUI; import android. support. v4.app. fragment; import android. support. v4.app. fragmentManager; import android. support. v4.app. fragmentPagerAdapter; public class ViewPagerAdapter extends FragmentPagerAdapter {// define the three Fragment indexes public static final int partition = 0; public static final int Fragment_Index_1 = 1; public static final int Fragment_Index_2 = 2; public ViewPagerAdapter (FragmentManager fragmentManager) {super (fragmentManager) ;}@ Overridepublic Fragment getItem (int Index) {Fragment mFragemnt = null; switch (Index) {case Fragment_Index_0: mFragemnt = new Fragment_0 (); break; case when: mFragemnt = new Fragment_1 (); break; case when: mFragemnt = new Fragment_2 (); break;} return mFragemnt ;} @ Overridepublic int getCount () {return 3 ;}}

Fragment_0, Fragment_1, and Fragment_2 are inherited from Fragment. Because the three la s are basically the same, only the code of Fragment_0 is provided here:

package com.Android.AnyViewUI;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class Fragment_0 extends Fragment {public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View mView=inflater.inflate(R.layout.layout_0, container, false);return mView;}}

4,