SwipeyTabs: cómo crear Swipey Tabs utilizando la biblioteca ActionBarSherlock?

Question

He creado pestañas swipey usando ViewPagerExtensions, pero esta vez estoy usando solo una biblioteca ActionBarSherlock en mi aplicación y no sé cómo crear pestañas swipey como google play store. Si puedes ayudarme a hacerlo, te estaría muy agradecido.

Este es el método onCreate de mi clase de actividad

@Override 
    protected void onCreate(Bundle savedInstanceState) { 
     setTheme(SampleList.THEME); //Used for theme switching in samples 
     super.onCreate(savedInstanceState); 

     setContentView(R.layout.fragment_tabs); 
     mTabHost = (TabHost)findViewById(android.R.id.tabhost); 
     mTabHost.setup(); 

     mTabManager = new TabManager(this, mTabHost, R.id.realtabcontent); 

     mTabManager.addTab(mTabHost.newTabSpec("simple").setIndicator("Groups"),FragmentStackSupport.CountingFragment.class, null); 
     mTabManager.addTab(mTabHost.newTabSpec("contacts").setIndicator("Contacts"),LoaderCursorSupport.CursorLoaderListFragment.class, null); 
     mTabManager.addTab(mTabHost.newTabSpec("custom").setIndicator("Logs"),LoaderCustomSupport.AppListFragment.class, null); 
     mTabManager.addTab(mTabHost.newTabSpec("throttle").setIndicator("Gallery"),LoaderThrottleSupport.ThrottledLoaderListFragment.class, null); 

     if (savedInstanceState != null) { 
      mTabHost.setCurrentTabByTag(savedInstanceState.getString("tab")); 
     } 
    } 

En primera imagen Top pago nuevo es el título de la pantalla actual y otros dos están mostrando anterior o siguiente baldosas pantalla. ¿Cómo puedo mostrar el título de la pantalla anterior y siguiente en la esquina con un efecto de desvanecimiento como este?

Answer 1

Debe utilizar las pestañas ActionBar, TabsAdapter y ViewPager (scrolly bit). Aquí hay un tutorial completo que hice: http://davidjkelley.net/?p=34 (solo use las importaciones de ABS, no las bibliotecas de compatibilidad estándar).

Aquí es una parte del código correspondiente:

import java.util.ArrayList; 
import android.app.ActionBar; 
import android.app.ActionBar.Tab; 
import android.content.Context; 
import android.content.Intent; 
import android.os.Bundle; 
import android.util.Log; 
import android.view.Menu; 
import android.view.MenuInflater; 
import android.view.MenuItem; 
import android.view.MenuItem.OnMenuItemClickListener; 
import android.view.View; 
import android.widget.Button; 
import android.widget.EditText; 
import android.widget.TextView; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentActivity; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 
import android.support.v4.app.FragmentTransaction; 
import android.support.v4.view.ViewPager; 
import android.support.v4.view.ViewPager.OnPageChangeListener; 
public class Polling extends FragmentActivity { 
private ViewPager mViewPager; 
private TabsAdapter mTabsAdapter; 
private final static String TAG = "21st Polling:"; 

public void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 

mViewPager = new ViewPager(this); 
mViewPager.setId(R.id.pager); 
setContentView(mViewPager); 
final ActionBar bar = getActionBar(); 
bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
bar.setDisplayShowTitleEnabled(false); 
bar.setDisplayShowHomeEnabled(false); 

mTabsAdapter = new TabsAdapter(this, mViewPager); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.login), 
LoginFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.economics), 
EconFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.elections), 
ElectionsFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.politics), 
PoliticsFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.science), 
ScienceFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.finance), 
FinanceFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.religion), 
ReligionFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.military), 
MilitaryFragment.class, null); 
mTabsAdapter.addTab(bar.newTab().setText(R.string.international), 
InternationalFragment.class, null); 
} 

public static class TabsAdapter extends FragmentPagerAdapter 
    implements ActionBar.TabListener, ViewPager.OnPageChangeListener { 
     private final Context mContext; 
     private final ActionBar mActionBar; 
     private final ViewPager mViewPager; 
     private final ArrayList<TabInfo> mTabs = new ArrayList<TabInfo>(); 

     static final class TabInfo { 
      private final Class<?> clss; 
      private final Bundle args; 

      TabInfo(Class<?> _class, Bundle _args) { 
       clss = _class; 
       args = _args; 
      } 
     } 

     public TabsAdapter(FragmentActivity activity, ViewPager pager) { 
      super(activity.getSupportFragmentManager()); 
      mContext = activity; 
      mActionBar = activity.getActionBar(); 
      mViewPager = pager; 
      mViewPager.setAdapter(this); 
      mViewPager.setOnPageChangeListener(this); 
     } 

     public void addTab(ActionBar.Tab tab, Class<?> clss, Bundle args) { 
      TabInfo info = new TabInfo(clss, args); 
      tab.setTag(info); 
      tab.setTabListener(this); 
      mTabs.add(info); 
      mActionBar.addTab(tab); 
      notifyDataSetChanged(); 
     } 


     public int getCount() { 
      return mTabs.size(); 
     } 

     public Fragment getItem(int position) { 
      TabInfo info = mTabs.get(position); 
      return Fragment.instantiate(mContext, info.clss.getName(), info.args); 
     } 


     public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
     } 


     public void onPageSelected(int position) { 
      mActionBar.setSelectedNavigationItem(position); 
     } 


     public void onPageScrollStateChanged(int state) { 
     } 


     public void onTabSelected(Tab tab, FragmentTransaction ft) { 
      mViewPager.setCurrentItem(tab.getPosition()); 
      Log.v(TAG, "clicked"); 
      Object tag = tab.getTag(); 
      for (int i=0; i<mTabs.size(); i++) { 
       if (mTabs.get(i) == tag) { 
        mViewPager.setCurrentItem(i); 
       } 
      } 
     } 

     public void onTabUnselected(Tab tab, FragmentTransaction ft) {} 

     public void onTabReselected(Tab tab, FragmentTransaction ft) {} 

     public void onTabReselected(Tab tab, android.app.FragmentTransaction ft) {} 

     @Override 
     public void onTabSelected(Tab tab, android.app.FragmentTransaction ft) {  
      Object tag = tab.getTag(); 
      for (int i=0; i<mTabs.size(); i++) { 
       if (mTabs.get(i) == tag) { 
        mViewPager.setCurrentItem(i); 
       } 
      } 
     } 

     public void onTabUnselected(Tab tab, android.app.FragmentTransaction ft) {} 
    } 

Answer 2

Si está utilizando ActionBarSherlock, será mejor que use pestañas de la barra de acciones, no TabHost. También creo que hay muestras en ABS que muestran cómo hacer esto.

Answer 3

Usted querrá utilizar ViewPager, y deshacerse de la TabHost.

http://developer.android.com/reference/android/support/v4/view/ViewPager.html

Answer 4

Las pestañas swipey que usted se refiere es en realidad sólo una ViewPager con pestañas título correspondiente para cada página. Esto no está incluido en el SDK de Android de forma predeterminada, pero puede usar el ViewPagerIndicator de Jake Wharton para agregar los títulos de cada pestaña en su ViewPager. Creo que ActionBarSherlock (que también fue creado por Jake Wharton) proporciona la misma funcionalidad exacta también.

Answer 5

Tuve un problema similar pero no estaba implementando ningún ActionBar en absoluto. Me encontré con este blog que me llevó a una implementación llamada "SwipeyTabs" que simplemente se usa con un ViewPager.

http://blog.peterkuterna.net/2011/09/viewpager-meets-swipey-tabs.html