it-roy-ru.com

Android TabLayout пользовательский индикатор ширины

Я хочу уменьшить ширину индикатора - например, сделать его шириной не всей ширины вкладки, а 1/2 ширины вкладки.
Это все, что мне нужно сделать, поэтому я не хочу загружать какую-то пользовательскую библиотеку и искать, где я могу это сделать.

Это способ сделать это, или я должен сам написать такое мнение?

5
Goltsev Eugene

Попробуй это.

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();  
   }  
}

А потом 

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


Моя модификация без отражения (пользовательский вид должен быть установлен!).

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

Для тех, кто сталкивается с этой проблемой, я нашел простое решение с векторной графикой для ~ 90% индикатора ширины вкладки:

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"/>

А затем установите tabIndicator в макете:

app:tabIndicator="@drawable/ic_tab_indicator_24dp"

Или в styles.xml:

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

 Example

1
raul

вы можете скопировать TabLayout и изменить логику вычисления ширины индикатора. Смотрите updateIndicatorPosition () и animateIndicatorToPosition (). Простая демонстрация https://github.com/xybean/CustomTabLayout

1
Shayabean