I want to create an ActionBar with tabs that are transparent, with #3b000000
. Something like this, but with tabs below the ActionBar:
This is the code I'm using in styles.xml:
<style name="Theme.MyTheme" parent="@style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:actionBarStyle">@style/ActionBar</item>
<item name="windowActionBarOverlay">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="actionBarStyle">@style/ActionBar</item>
</style>
<style name="ActionBar" parent="@style/Widget.Sherlock.Light.ActionBar">
<item name="android:background">@color/actionbar</item>
<item name="background">@color/actionbar</item>
<item name="android:actionBarTabStyle">@style/ActionBarTabStyle</item>
<item name="actionBarTabStyle">@style/ActionBarTabStyle</item>
</style>
<style name="ActionBarTabStyle" parent="@style/Widget.Sherlock.ActionBar.TabView">
<item name="background">@color/actionbar_tabs</item>
<item name="android:background">@color/actionbar_tabs</item>
</style>
What happens, is that the ActionBar itself does show the transparent backgroundcolor, but the tabs are totally transparent (no color visible).
How can I solve this?
Call setStackedBackgroundDrawable()
on your ActionBar
:
getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
ActionBar actionBar = getActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#330000ff")));
actionBar.setStackedBackgroundDrawable(new ColorDrawable(Color.parseColor("#550000ff")));
This produces (as an example with some random icons and tabs, and two different bluish background colors to highlight the effect):
(The refresh icon is the default one, which comes with a slight transparency. The other icons are custom test icons with color #FFFFFFFF, that is, no transparency).
I have done this on an project and the style was like this:
<style name="AppTheme" parent="android:Theme.Holo">
<item name="android:windowActionBarOverlay">true</item>
<item name="android:actionBarStyle">@style/action_bar_theme</item>
<item name="android:actionMenuTextColor">#fff</item>
</style>
<style name="action_bar_theme" parent="@android:style/Widget.Holo.ActionBar">
<item name="android:background">#b3000000</item>
<item name="android:titleTextStyle">@style/action_bar_text</item>
</style>
As mentioned in this article, using the following custom theme works flawlessly.
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
parent="@android:style/Theme.Holo">
<item name="android:windowActionBarOverlay">true</item>
</style>
</resources>
To apply some color tint, Gunnar's answer shows how.
ActionBar actionBar = getActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#330000ff")));
actionBar.setStackedBackgroundDrawable(new ColorDrawable(Color.parseColor("#550000ff")));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With