web-dev-qa-db-ja.com

ViewPagerIndicatorを使用して、選択したタブのテキストに異なる色を付けます

ViewPagerIndicator から SampleTabsStyled demo に、現在選択されているタブのテキストの色を変更させようとしましたが、成功しませんでした。

ただし、 SampleTitlesStyledTheme demo は、タイトル/タブを切り替えるときにテキストの色を変更します。

styles xml の内部を見ると:

<resources>
    ...
    <style name="CustomTitlePageIndicator">
        <item name="Android:background">#18FF0000</item>
        <item name="footerColor">#FFAA2222</item>
        <item name="footerLineHeight">1dp</item>
        <item name="footerIndicatorHeight">3dp</item>
        <item name="footerIndicatorStyle">underline</item>
        <item name="Android:textColor">#AA000000</item>
        <item name="selectedColor">#FF000000</item>
        <item name="selectedBold">true</item>
    </style>
    ...
    <style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
        <item name="Android:background">@drawable/custom_tab_indicator</item>
        <item name="Android:textAppearance">@style/CustomTabPageIndicator.Text</item>
        <item name="Android:textColor">#FF555555</item>
        <item name="Android:textSize">16sp</item>
        <item name="Android:divider">@drawable/custom_tab_indicator_divider</item>
        <item name="Android:dividerPadding">10dp</item>
        <item name="Android:showDividers">middle</item>
        <item name="Android:paddingLeft">8dp</item>
        <item name="Android:paddingRight">8dp</item>
        <item name="Android:fadingEdge">horizontal</item>
        <item name="Android:fadingEdgeLength">8dp</item>
    </style>

    <style name="CustomTabPageIndicator.Text" parent="Android:TextAppearance.Medium">
        <item name="Android:typeface">monospace</item>
    </style>
    ...
</resources>

SampleTitlesStyledThemeデモはCustomTitlePageIndicatorアイテムを定義するselectedColorスタイルを使用していることがわかります。だから(おそらく素朴に)私は追加しようと思った

<item name="selectedColor">#FF000000</item>

SampleTabsStyledデモが使用しているスタイルにCustomTabPageIndicatorですが、残念ながら、それは機能しませんでした。

質問は明白に思えますが、とにかく質問します:SampleTabsStyledデモで現在選択されているタブのテキストを他のタブとは異なる色にする方法はありますか(現在のスタイルxmlを使用)?もしそうなら、どのように?

編集

ああ、それが重要な場合に備えて、これをActionBarSherlockと組み合わせて使用​​しています...

21
Bart Kiers

追加のxmlを作成してもかまわないと仮定して、最初に属性Android:textColorCustomTabPageIndicator.Text(またはCustomTabPageIndicator)に次のように含めてみてください。

<style name="CustomTabPageIndicator.Text" parent="Android:TextAppearance.Medium">
    <item name="Android:textColor">@drawable/tab_text_color</item>
    ...
</style>

ここで、tab_text_color.xmlはres/drawableフォルダーの下に置かれます:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item
        Android:state_selected="true"
        Android:color="@color/text_tab_selected" />
    <item
        Android:state_selected="false"
        Android:color="@color/text_tab_unselected" />
</selector>

最後に、res/valuesフォルダーにあるカラーリソースファイル@color/text_tab_selectedで2つの色@color/text_tab_unselectedcolors.xmlを定義します(まだ存在しない場合は作成します)。例えば:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="text_tab_selected">#FF000000</color>
    <color name="text_tab_unselected">#FF555555</color>
</resources>
43
Neoh

これを試して

最も簡単な方法

<Android.support.design.widget.TabLayout
                xmlns:app="http://schemas.Android.com/apk/res-auto"
                Android:id="@+id/tabs"
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                app:tabTextColor="@color/White"
                app:tabSelectedTextColor="@color/Blue"
                app:tabIndicatorColor="@color/Yellow"
                app:tabMode="fixed"
                app:tabGravity="fill"/>

この依存関係を追加することを忘れないでください

compile 'com.Android.support:design:23.1.1'
16
Pritish Joshi