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>
Best Answer
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:Then after you call
setContentView(..)
(sincesetContentView(..)
also initializes the actionbar next to setting the content) you can set a background drawable on your actionbar:which can be a shape drawable with an alpha put in res/drawable:
You could also do this completely programatically by creating a
ColorDrawable
:Otherwise ofcourse you can hide the actionbar completely; in that case you can set a custom theme on your activity in your manifest:
or programmatically by calling