Custom Translucent Android ActionBar
android, android-3.0-honeycomb, android-4.0-ice-cream-sandwich, android-5.0-lollipop, android-actionbar
Solution
If you want your activity to be fullscreen but still show an actionbar, but with an alpha you have to request overlaymode for the actionbar in `onCreate()` of your activity:
getWindow().requestFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
//getWindow().requestFeature(WindowCompat.FEATURE_ACTION_BAR_OVERLAY); << Use this for API 7+ (v7 support library)
Then after you call `setContentView(..)` (since `setContentView(..)` also initializes the actionbar next to setting the content) you can set a background drawable on your actionbar:
getActionBar().setBackgroundDrawable(getResources().getDrawable(R.drawable.actionbar_bg));
which can be a shape drawable with an alpha put in res/drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#BB000000" />
</shape>
You could also do this completely programatically by creating a `ColorDrawable`:
getActionBar().setBackgroundDrawable(new ColorDrawable(Color.argb(128, 0, 0, 0)));
Otherwise ofcourse you can hide the actionbar completely; in that case you can set a custom theme on your activity in your manifest:
@android:style/Theme.NoTitleBar.Fullscreen
or programmatically by calling
getActionBar().hide();
Problem
I've been scouring the interwebs (e.g. Android documentation, answers here, etc.) for the answer to what I thought would be a fairly trivial question. How do you achieve a translucent action bar like the ones in Google Music and YouTube (links are image examples)? I want video content to be full screen and not constrained/pushed down by the action bar while still leveraging the benefits of a built in UI component. I can obviously use a completely custom view, but I'd rather leverage the ActionBar if possible. Manifest ``` <activity android:name="videoplayer" android:theme="@android:style/Theme.Holo" android:launchMode="singleTop" android:configChanges="keyboardHidden|orientation"/> ``` Activity ``` // Setup action bar ActionBar actionBar = getActionBar(); actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD); View customActionBarView = getLayoutInflater().inflate(R.layout.player_custom_action_bar, null); actionBar.setCustomView(customActionBarView, new ActionBar.LayoutParams(ActionBar.LayoutParams.MATCH_PARENT, R.dimen.action_bar_height)); actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM); ``` Menu ``` <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/button1" android:icon="@drawable/button1" android:showAsAction="always"/> <item android:id="@+id/button2" android:icon="@drawable/button2" android:showAsAction="always"/> </menu> ``` Custom ActionBar View ``` <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/custom_action_bar" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:gravity="center" android:background="@color/TranslucentBlack"> <!--Home icon with arrow--> <ImageView android:id="@+id/home" android:src="@drawable/home" android:layout_width="wrap_content" android:layout_height="match_parent"/> <!--Another image--> <ImageView android:id="@+id/image" android:layout_width="wrap_content" android:layout_height="match_parent" android:visibility="visible"/> <!--Text if no image--> <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="match_parent" android:gravity="center_vertical" android:visibility="gone"/> <!--Title--> <TextView android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="match_parent" android:paddingLeft="20dp" android:gravity="center_vertical"/> </LinearLayout> ```