2015-01-24 14 views
5

Nach this Beispiel konnte ich ein SlidingTabLayout nur mit Symbolen erstellen, aber ich möchte sie zentrieren. Muss ich eine benutzerdefinierte Ansicht erstellen oder gibt es andere Lösungen?SlidingTabLayout mit nur Symbolen

Jede Hilfe wäre willkommen.

enter image description here

+0

ändern ändern Wie Symbol Größe ändern? – ThirdMartian

Antwort

25

Schließlich dachte i'v es aus. Hier ist mein Codebeispiel ist ...

eine ziehbar für jede Registerkarte erstellen, in meinem Fall erstellt i store_tab.xml und cart_tab.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/ic_store_white_24dp" android:state_selected="true" /> 
    <item android:drawable="@drawable/ic_store_grey600_24dp" /> 
</selector> 

Ihre eigenen Pager-Adapter erstellen, die von FragmentPageAdapter

public class HomePagerAdapter extends FragmentPagerAdapter { 

    private static int[] ICONS = new int[] { 
     R.drawable.store_tab, 
     R.drawable.cart_tab 
    }; 

    // ... 

    @Override 
    public CharSequence getPageTitle(int position) { 
     return null; 
    } 

    @Override 
    public int getCount() { 
     return ICONS.length; 
    } 

    public int getDrawableId(int position) { 
     return ICONS[position]; 
    } 

} 
erweitert

Erstellen Sie die folgende neue Methode in SlidingTabLayout

protected ImageView createDefaultImageView(Context context) { 
    ImageView imageView = new ImageView(context); 

    int padding = (int) (TAB_VIEW_PADDING_DIPS * getResources().getDisplayMetrics().density); 
    imageView.setPadding(padding, padding, padding, padding); 

    int width = (int) (getResources().getDisplayMetrics().widthPixels/mViewPager.getAdapter().getCount()); 
    imageView.setMinimumWidth(width); 

    return imageView; 
} 

dann die Methode populateTabStrip innen SlidingTabLayout

private void populateTabStrip() { 
    final HomePagerAdapter adapter = (HomePagerAdapter) mViewPager.getAdapter(); 
    final View.OnClickListener tabClickListener = new TabClickListener(); 

    for (int i = 0; i < adapter.getCount(); i++) { 
     View tabView = null; 
     //TextView tabTitleView = null; 
     ImageView tabIconView = null; 

     /*if (mTabViewLayoutId != 0) { 
      // If there is a custom tab view layout id set, try and inflate it 
      tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip, 
        false); 
      tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId); 
     } 

     if (tabView == null) { 
      tabView = createDefaultTabView(getContext()); 
     } 

     if (tabTitleView == null && TextView.class.isInstance(tabView)) { 
      tabTitleView = (TextView) tabView; 
     }*/ 

     if (tabView == null) { 
      tabView = createDefaultImageView(getContext()); 
     } 

     if (tabIconView == null && ImageView.class.isInstance(tabView)) { 
      tabIconView = (ImageView) tabView; 
     } 

     tabIconView.setImageDrawable(getResources().getDrawable(adapter.getDrawableId(i))); 
     if (mViewPager.getCurrentItem() == i) { 
      tabIconView.setSelected(true); 
     } 
     //tabTitleView.setText(adapter.getPageTitle(i)); 
     tabView.setOnClickListener(tabClickListener); 

     mTabStrip.addView(tabView); 
    } 
} 

Schließlich onPageSelected innen InternalViewPageListener

@Override 
public void onPageSelected(int position) { 
    for (int i = 0; i < mTabStrip.getChildCount(); i++) { 
     mTabStrip.getChildAt(i).setSelected(false); 
    } 
    mTabStrip.getChildAt(position).setSelected(true); 

    if (mScrollState == ViewPager.SCROLL_STATE_IDLE) { 
     mTabStrip.onViewPagerPageChanged(position, 0f); 
     scrollToTab(position, 0); 
    } 

    if (mViewPagerPageChangeListener != null) { 
     mViewPagerPageChangeListener.onPageSelected(position); 
    } 
} 

Endergebnis

enter image description here

+0

das funktioniert super! – chip

Verwandte Themen