自定义 ActionBar TabBar (ActionBarSherlock)

Question

我已经被这个问题困扰了好几天了。谁能帮我自定义ActionBar下方显示的Tabs（NavigationMode是NAVIGATION_MODE_TABS）？

我基本上想改变标签的背景颜色和当前选择的标签的下划线颜色。到目前为止，这是我所做的，但它不起作用。我正在使用ActionBarSherlock。

<style name="Theme.Styled" parent="@style/Theme.Sherlock.Light">
    <item name="actionBarStyle">@style/Widget.Theme.Styled.ActionBar</item>
    <item name="android:actionBarStyle">@style/Widget.Theme.Styled.ActionBar</item>

    <item name="actionBarTabBarStyle">@style/customActionBarTabStyle</item>
    <item name="android:actionBarTabBarStyle">@style/customActionBarTabStyle</item>

    <item name="actionBarTabBarStyle">@style/customActionBarTabBarStyle</item>
    <item name="android:actionBarTabBarStyle">@style/customActionBarTabBarStyle</item>

    <item name="actionBarTabTextStyle">@style/customActionBarTabTextStyle</item>
    <item name="android:actionBarTabTextStyle">@style/customActionBarTabTextStyle</item>
</style>

<style name="customActionBarTabStyle" parent="style/Widget.Sherlock.Light.ActionBar.TabView">
    <item name="android:background">@color/red</item>

    <item name="android:textSize">12dp</item>

</style>

<style name="customActionBarTabBarStyle" parent="style/Widget.Sherlock.Light.ActionBar.TabBar">
    <item name="android:background">@color/red</item>
</style>

<style name="customActionBarTabTextStyle" parent="style/Widget.Sherlock.Light.ActionBar.TabText">
    <item name="android:titleTextStyle">@style/Theme.Styled.ActionBar.TitleTextStyle</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="Widget.Theme.Styled.ActionBar" parent="Widget.Sherlock.ActionBar">
    <item name="android:background">#A9E2F3</item>
    <item name="background">#A9E2F3</item>
    <item name="android:titleTextStyle">@style/Theme.Styled.ActionBar.TitleTextStyle</item>
</style>

<style name="Theme.Styled.ActionBar.TitleTextStyle" parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    <item name="android:textColor">@color/red</item>
    <item name="android:textStyle">bold</item>
</style>

<style name="Animations" />

Answer 1

我不确定你是否需要这个，但我会发布答案让其他人看到。您可以在customActionBarTabStyle 的后台Drawable 中将其设置为Drawable 资源：

<style name="customActionBarTabStyle" parent="style/Widget.Sherlock.Light.ActionBar.TabView">
    <item name="android:background">@drawable/actionbar_tabs_selector</item>
    <item name="android:textSize">12dp</item>
</style>

资源应该是一个选择器，包括以下几行：

<!-- This is the "@drawable/actionbar_tabs_selector" layout !-->

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/actionbar_tab_style_nselected"/>
    <item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/actionbar_tab_style_selected"/>

    <!-- Pressed state -->
    <item android:state_pressed="true" android:drawable="@drawable/actionbar_tab_style_selected" />

    <!-- Focused state -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/actionbar_tab_style_nselected"/>
    <item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/actionbar_tab_style_nselected"/>

</selector>

所以这里的资源是 2 层列表。一种用于选项卡处于非活动状态，另一种用于选择选项卡并处于活动状态。因此，您可以根据所选状态设置 2 个图层列表。

单个层列表可能如下所示：

<!-- This is the "@drawable/actionbar_tab_style_nselected" layout !-->

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Bottom Line -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/HCL_orange" />
        </shape>
    </item>

    <!-- Tab color -->
    <item android:bottom="2dip">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white" />
        </shape>
    </item>
</layer-list>

因此，第一项是您可以定义为当前选定选项卡的下划线颜色的底线，第二项是整个选项卡的颜色。

Answer 2

您可以使用可用的style generator，或从this 或this 相关问题中获得更多见解。