自定义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

您可以使用现有的style generator，或从this或this相关的问题得到一些更深入的了解。

Answer 2

我不确定你是否需要这个，但我会发布答案让其他人看到。您可以将此作为一个可绘制资源customActionBarTabStyle的背景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层列表。

单层名单看起来是这样的：

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

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