web-dev-qa-db-fra.com

Largeur de l'indicateur personnalisé Android TabLayout

Je veux réduire la largeur de l'indicateur - par exemple, faites-en une largeur non pas toute la largeur d'une tabulation, mais la moitié de sa largeur.
C’est tout ce que je dois faire, donc je ne veux pas télécharger une bibliothèque personnalisée ni chercher où je peux le faire.

Est-ce une façon de faire ou devrais-je écrire cette vue moi-même?

androidandroid-viewpagerandroid-tablayout
5
Goltsev Eugene

Essaye ça.

public void setIndicator (TabLayout tabs,int leftDip,int rightDip){  
   Class<?> tabLayout = tabs.getClass();  
   Field tabStrip = null;  
   try {  
       tabStrip = tabLayout.getDeclaredField("mTabStrip");  
   } catch (NoSuchFieldException e) {  
       e.printStackTrace();  
   }  

   tabStrip.setAccessible(true);  
   LinearLayout llTab = null;  
   try {  
       llTab = (LinearLayout) tabStrip.get(tabs);  
   } catch (IllegalAccessException e) {  
       e.printStackTrace();  
   }  

   int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());  
   int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());  

   for (int i = 0; i < llTab.getChildCount(); i++) {  
       View child = llTab.getChildAt(i);  
       child.setPadding(0, 0, 0, 0);  
       LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);  
       params.leftMargin = left;  
       params.rightMargin = right;  
       child.setLayoutParams(params);  
       child.invalidate();  
   }  
}

Et alors 

tab.post(new Runnable() {  
       @Override  
       public void run() {  
           setIndicator(tab,60,60);  
       }  
});


Ma modification sans réflexion (la vue personnalisée doit être définie!). 

for (int i = 0; i < tabs.getTabCount(); i++) {
    TabLayout.Tab tab = tabs.getTabAt(i);
    if (tab != null) {
        View customView = tab.getCustomView();
        if (customView != null) {
            View targetViewToApplyMargin = (View) customView.getParent();
            ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) targetViewToApplyMargin.getLayoutParams();

            layoutParams.rightMargin = totalTabMargin;
                    targetViewToApplyMargin.setLayoutParams(layoutParams);
        }
    }
}
3
KeLiuyue

Pour tous ceux qui se retrouvent sur cette question, j'ai trouvé une solution simple avec des vecteurs extractibles pour environ 90% de la largeur de l'onglet:

ic_tab_indicator_24dp:

<vector
Android:height="24dp"
Android:width="24dp"
Android:viewportHeight="24.0"
Android:viewportWidth="24.0"
xmlns:Android="http://schemas.Android.com/apk/res/Android">
<path
    Android:strokeWidth="4"
    Android:fillColor="@Android:color/white"
    Android:pathData="M2,0 L22,0 L22,24 L2,24 z"/>

Et puis définissez tabIndicator dans la mise en page:

app:tabIndicator="@drawable/ic_tab_indicator_24dp"

Ou dans styles.xml:

<item name="tabIndicator">@drawable/ic_tab_indicator_24dp</item>

 Example

1
raul

vous pouvez copier TabLayout et modifier la logique de calcul de la largeur de Indicator. Voir updateIndicatorPosition () et animateIndicatorToPosition (). Une simple démo https://github.com/xybean/CustomTabLayout

1
Shayabean