Як змінити новий колір та висоту індикатора TabLayout

Я розігрувався з новим android.support.design.widget.TabLayoutі виявив проблему, що у визначенні класу немає методів зміни кольору індикатора та висоти за замовчуванням.

Провівши деякі дослідження, виявив, що колір індикатора за замовчуванням взято з AppTheme. Конкретно звідси:

<item name="colorAccent">#FF4081</item>

Тепер у моєму випадку, якщо я зміню colorAccent, це вплине на всі інші представлення, які використовують це значення як колір тла, наприклад, ProgressBar

Тепер чи є спосіб змінити індикатор кольору на інше, окрім colorAccent?

Маючи проблему з тим, що новий TabLayout використовує колір індикатора зі значення colorAccent, я вирішив заглибитись у android.support.design.widget.TabLayoutреалізацію, виявивши, що не існує публічних методів, щоб це налаштувати. Однак я знайшов таку специфікацію стилю TabLayout:

<style name="Base.Widget.Design.TabLayout" parent="android:Widget">
    <item name="tabMaxWidth">@dimen/tab_max_width</item>
    <item name="tabIndicatorColor">?attr/colorAccent</item>
    <item name="tabIndicatorHeight">2dp</item>
    <item name="tabPaddingStart">12dp</item>
    <item name="tabPaddingEnd">12dp</item>
    <item name="tabBackground">?attr/selectableItemBackground</item>
    <item name="tabTextAppearance">@style/TextAppearance.Design.Tab</item>
    <item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>

Маючи таку специфікацію стилю, тепер ми можемо налаштувати TabLayout так:

<android.support.design.widget.TabLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@id/pages_tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:tabIndicatorColor="@android:color/white"
    app:tabIndicatorHeight="4dp"/>

І проблема вирішена: і колір індикатора та висоту вкладки можна змінити від значень за замовчуванням.

За допомогою бібліотеки підтримки дизайну тепер ви можете змінити їх у xml:

Щоб змінити колір індикатора TabLayout:

app:tabIndicatorColor="@color/color"

Щоб змінити висоту індикатора TabLayout:

app:tabIndicatorHeight="4dp"

Оскільки я не можу опублікувати коментар розробника для Android , ось оновлена ​​відповідь для всіх, кому потрібно програмно встановити вибраний колір індикатора вкладки:

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FFFFFF"));

Аналогічно для висоти:

tabLayout.setSelectedTabIndicatorHeight((int) (2 * getResources().getDisplayMetrics().density));

Ці методи були нещодавно додані до версії 23.0.0 Бібліотеки підтримки , тому відповідь Сохеїла Сетаеші використовує роздуми.

app:tabIndicatorColor="@android:color/white"

За допомогою бібліотеки підтримки дизайну v23 ви можете програмно встановити колір та висоту.

Просто використовуйте для висоти:

TabLayout.setSelectedTabIndicatorHeight(int height)

Тут офіційний javadoc .

Просто використовуйте для кольору:

TabLayout.setSelectedTabIndicatorColor(int color)

Тут офіційний javadoc .

Тут ви можете знайти інформацію в Google Tracker .

Для програмного зміни кольору та висоти індикатора ви можете використовувати відображення. наприклад для коду використання індикаторного кольору нижче:

        try {
            Field field = TabLayout.class.getDeclaredField("mTabStrip");
            field.setAccessible(true);
            Object ob = field.get(tabLayout);
            Class<?> c = Class.forName("android.support.design.widget.TabLayout$SlidingTabStrip");
            Method method = c.getDeclaredMethod("setSelectedIndicatorColor", int.class);
            method.setAccessible(true);
            method.invoke(ob, Color.RED);//now its ok
        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        } catch (NoSuchMethodException e) {
            e.printStackTrace();
        } catch (InvocationTargetException e) {
            e.printStackTrace();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }

і щоб змінити висоту індикатора, використовуйте "setSelectedIndicatorHeight" замість "setSelectedIndicatorColor", а потім викликайте його за потрібною висотою

Використовуйте цей індикатор Foto:

 tabLayout.setSelectedTabIndicatorColor(ContextCompat.getColor(this, R.color.colorWhite));//put your color

від xml:

app:tabIndicatorColor="#fff"

від Java:

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FFFFFF"));
tabLayout.setSelectedTabIndicatorHeight((int) (2 * getResources().getDisplayMetrics().density));

Ви можете змінити це за допомогою xml

app:tabIndicatorColor="#fff"

Просто введіть цей рядок у свій код. Якщо ви змінили колір, то змініть значення кольору в дужках.

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FFFFFF"));

Android робить це легко.

public void setTabTextColors(int normalColor, int selectedColor) {
    setTabTextColors(createColorStateList(normalColor, selectedColor));
}

Отже, ми просто кажемо

mycooltablayout.setTabTextColors(Color.parseColor("#1464f4"), Color.parseColor("#880088"));

Це дасть нам синій звичайний колір та фіолетовий обраний колір.

Тепер встановлюємо висоту

public void setSelectedTabIndicatorHeight(int height) {
    mTabStrip.setSelectedIndicatorHeight(height);
}

А про висоту ми говоримо

mycooltablayout.setSelectedIndicatorHeight(6);