ViewPagerIndicator不会在Tab中显示下划线

Question

我想制作简单的TabPagerIndicator，但它没有显示下划线，我使用xml来改变样式。这是我的xml样式文件：

<!-- Application theme. -->
<style name="AppTheme" parent="@style/Theme.AppCompat.Light">
    <item name="vpiTitlePageIndicatorStyle">@style/CustomTitlePageIndicator</item>
    <item name="vpiUnderlinePageIndicatorStyle">@style/CustomUnderlinePageIndicator</item> 
    <item name="vpiTabPageIndicatorStyle">@style/CustomTabPageIndicator</item>
</style>

<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
    <item name="android:background">@color/fondo_activity</item>
    <item name="android:textAppearance">@style/CustomTabPageIndicator.Text</item>
    <item name="android:textColor">#FF555555</item>
    <item name="android:textSize">14sp</item>
    <item name="android:dividerPadding">10dp</item>
    <item name="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>

<style name="CustomUnderlinePageIndicator">
    <item name="selectedColor">#FFCC0000</item>
    <item name="android:background">#FFCCCCCC</item>
    <item name="fadeLength">1000</item>
    <item name="fadeDelay">1000</item>
</style>


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

在此图片中，您可以看到它是如何显示的（顶部的红线是操作栏的一部分）

有谁知道错误在哪里？我该如何解决？

最佳。

Answer 1

您可以使用background属性设置下划线。将其设置为XML drawable，定义哪些drawables / 9-patches用于绘制不同的状态。

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/vpi__tab_unselected_holo" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/vpi__tab_selected_holo" />

    <!-- Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/vpi__tab_unselected_focused_holo" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/vpi__tab_selected_focused_holo" />

    <!-- Pressed -->
    <!--    Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/vpi__tab_unselected_pressed_holo" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/vpi__tab_selected_pressed_holo" />

    <!--    Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/vpi__tab_unselected_pressed_holo" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/vpi__tab_selected_pressed_holo" />
</selector>