Come allineare il centro di tabulazione attivo in Android Tab Layout scorrevole

Question

Ho 12 elementi nel layout di scheda scorrevole Android + visualizza il pager. Mentre si scorre da sinistra a destra, la scheda selezionata dovrebbe essere al centro di Play Store. Per favore aiutami come farlo. Nella mia scheda attiva dell'applicazione è sempre a sinistra dello schermo.

Answer 1

Google ha fornito campione per sliding tab layout. Ma nell'implementazione della classe SlidingTabLayout, non è stato progettato per allineare il centro della scheda selezionata. Ho modificato il metodo di scorrimento per rendere il centro di tabulazione selezionato/attivo dello schermo. Ecco il cambiamento del codice:

Nome classe: Numero SlidingTabLayout

Linea: 241, scrollToTab {}

Aggiornato Metodo:

private void scrollToTab(int tabIndex, int positionOffset) { 
    final int tabStripChildCount = mTabStrip.getChildCount(); 
    if (tabStripChildCount == 0 || tabIndex < 0 || tabIndex >= tabStripChildCount) { 
     return; 
    } 

    View selectedChild = mTabStrip.getChildAt(tabIndex); 
    if (selectedChild != null) { 
     int targetScrollX = selectedChild.getLeft() + positionOffset; 

     if (tabIndex > 0 || positionOffset > 0) { 
      // If we're not at the first child and are mid-scroll, make sure we obey the offset 
      targetScrollX -= (getWidth()-selectedChild.getWidth())/2; 
     } 

     scrollTo(targetScrollX, 0); 
    } 
} 

Answer 2

Il mio approccio si differenzia un po 'della soluzione Shripad Bhat, che rimbalza la linguetta alla fine della diapositiva.

Ecco la mia soluzione ...

Modifiche a onPageScrolled metodo:

@Override 
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
    int tabStripChildCount = mTabStrip.getChildCount(); 
    if ((tabStripChildCount == 0) || (position < 0) || (position >= tabStripChildCount)) { 
     return; 
    } 

    mTabStrip.onViewPagerPageChanged(position, positionOffset); 

    View selectedTitle = mTabStrip.getChildAt(position); 
    int selectedOffset = (selectedTitle == null) ? 0 : selectedTitle.getWidth(); 
    int nextTitlePosition = position + 1; 
    View nextTitle = mTabStrip.getChildAt(nextTitlePosition); 
    int nextOffset = (nextTitle == null) ? 0 : nextTitle.getWidth(); 
    int extraOffset = (int)(0.5F * (positionOffset * (float)(selectedOffset + nextOffset))); 
    scrollToTab(position, extraOffset); 

    if (mViewPagerPageChangeListener != null) { 
     mViewPagerPageChangeListener.onPageScrolled(position, positionOffset, positionOffsetPixels); 
    } 
} 

Modifiche a scrollToTab metodo:

private int mLastScrollTo; 

private void scrollToTab(int tabIndex, int positionOffset) { 
    final int tabStripChildCount = mTabStrip.getChildCount(); 
    if (tabStripChildCount == 0 || tabIndex < 0 || tabIndex >= tabStripChildCount) { 
     return; 
    } 

    View selectedChild = mTabStrip.getChildAt(tabIndex); 
    if (selectedChild != null && selectedChild.getMeasuredWidth() != 0) { 

     int targetScrollX = ((positionOffset + selectedChild.getLeft()) - getWidth()/2) + selectedChild.getWidth()/2; 

     if (targetScrollX != mLastScrollTo) { 
      scrollTo(targetScrollX, 0); 
      mLastScrollTo = targetScrollX; 
     } 
    } 
} 

Answer 3

avuto questo problema pure. tabLayout fornisce unica opzione tabContentStart, necessari entrambi i lati:

public class CenteringTabLayout extends TabLayout { 
public CenteringTabLayout(Context context) { 
    super(context); 
} 

public CenteringTabLayout(Context context, AttributeSet attrs) { 
    super(context, attrs); 
} 

public CenteringTabLayout(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
} 

@Override 
protected void onLayout(boolean changed, int l, int t, int r, int b) { 
    super.onLayout(changed, l, t, r, b); 
    View firstTab = ((ViewGroup)getChildAt(0)).getChildAt(0); 
    View lastTab = ((ViewGroup)getChildAt(0)).getChildAt(((ViewGroup)getChildAt(0)).getChildCount()-1); 
    ViewCompat.setPaddingRelative(getChildAt(0), (getWidth()/2) - (firstTab.getWidth()/2),0,(getWidth()/2) - (lastTab.getWidth()/2),0); 
} 
}