web-dev-qa-db-ja.com

新しいTabLayoutインジケータの色と高さを変更する方法

私は新しいAndroid.support.design.widget.TabLayoutで遊んでいて、問題を見つけました、クラス定義で、インジケータの色とデフォルトの高さを変える方法がありません。

いくつかの調査を行って、デフォルトのインジケータの色はAppThemeから取得されることがわかりました。ここから具体的に：

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

さて、私の場合は、colorAccentを変更すると、この値を背景色として使用する他のすべてのビューに影響があります。例えばProgressBarです。

colorAccent以外にindicatorColorを他のものに変更する方法はありますか？

androidmaterial-designandroid-design-library
114
David_E

新しい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"/>

そして問題が解決し、タブの色と高さの両方をデフォルト値から変更できるようになりました。

224
David_E

デザインサポートライブラリを使えば、xmlでそれらを変更することができます。

TabLayoutインジケーターの色を変更するには、次の手順を実行します。

app:tabIndicatorColor="@color/color"

TabLayoutインジケーターの高さを変更するには、次の手順を実行します。

app:tabIndicatorHeight="4dp"
90
Malek Hijazi

私は Android開発者のコ​​メント へのフォローアップを投稿することができないので、ここでプログラムで選択されたタブインジケーターの色を設定する必要がある人のための更新された答えです。 ：

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

高さについても同様です。

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

これらのメソッドはごく最近サポートライブラリの リビジョン23.0.0に追加されました 、だから Soheil Setayeshi's answer は反射を使います。

32
jasonchen2
app:tabIndicatorColor="@Android:color/white"
15
Sanket Parchande

desingサポートライブラリv23を使用すると、プログラムで色と高さを設定できます。

高さに使うだけ：

TabLayout.setSelectedTabIndicatorHeight(int height)

ここでは 公式のjavadoc です。

色に使うだけ：

TabLayout.setSelectedTabIndicatorColor(int color)

ここでは 公式のjavadoc です。

ここでは、 Google Tracker で情報を見つけることができます。

13
Gabriele Mariotti

インジケータの色と高さをプログラムで変更するには、反射を使用できます。例えば、インジケータの色については、以下のコードを使用してください。

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

インジケータの高さを変更するには、「setSelectedIndicatorColor」の代わりに「setSelectedIndicatorHeight」を使用してから、希望の高さで呼び出します。

9
Soheil Setayeshi

フォトインディケータはこれを使用します：

 tabLayout.setSelectedTabIndicatorColor(ContextCompat.getColor(this, R.color.colorWhite));//put your color
4
chry
tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FFFFFF"));
tabLayout.setSelectedTabIndicatorHeight((int) (2 * getResources().getDisplayMetrics().density));
2
Arthur Melo

これはxmlを使って変更できます。

app:tabIndicatorColor="#fff"
1
Ishan Fernando

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);
0
SmulianJulian

この行をコードに入れるだけです。色を変更する場合は、括弧内の色の値を変更してください。

tabLayout.setSelectedTabIndicatorColor(Color.parseColor("#FFFFFF"));
0
saqib javeed