Develop Reference

Touch feedback on menu item with actionLayout

I'm using a menu item with actionLayout because I need to add a textView along with my icon for the item on the ActionBar. everything shows up correctly but I don't know (and couldn't find anywhere) how to add the animation that shows up when user taps on a menu item on Lollipop devices.
I would like to show number of comments on the side of comment icon in my toolbar.
Here is what I have:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/menu_like"
android:icon="#drawable/list_discuss_like"
android:title="Like"
app:showAsAction="always"/>
<item
android:id="#+id/menu_comment"
app:actionLayout="#layout/menu_item_comment"
android:title="Comment"
android:icon="#drawable/ic_comment_white_24dp"
app:showAsAction="always"/>
</menu>
and for my menu_item_comment.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:hapticFeedbackEnabled="true"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:src="#drawable/ic_comment_white_24dp"/>
<TextView
android:id="#+id/ab_comment_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="(12)"
android:textColor="#color/grayTextHint"/>
</LinearLayout>
The animation and feedback works on the like item but not on the comment one.
Any help is appreciated.

Set the clickable element's background to the theme's action bar item background.
<LinearLayout
...
android:clickable="true"
android:background="?android:attr/actionBarItemBackground">
...
</LinearLayout>

Styling the Action Bar

I'm trying to style the action bar by adding a custom back button on the left and an icon in the center. The rendering in Android Studio is exactly as I want it, but when I test the layout on my phone, it just shows both back button and icon on the left, with the icon on top of the back button. This is my layout file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton android:id="#+id/back_button"
android:contentDescription="Image"
android:src="#drawable/back_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#color/action_bar_bg_color"
android:layout_alignParentLeft="true"/>
<ImageView android:id="#+id/cow_icon"
android:contentDescription="Image"
android:src="#drawable/cowhead"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_centerVertical="true"/>
</RelativeLayout>
And this is what I do to style the action bar:
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
View mActionBar = getLayoutInflater().inflate(R.layout.action_bar_layout, null);
actionBar.setCustomView(mActionBar);
actionBar.setDisplayShowCustomEnabled(true);
Anyone see what could be causing the flawed styling of the action bar?

You could try using the new Toolbar : https://developer.android.com/reference/android/widget/Toolbar.html
which is great for making custom actionBar.
Otherwise, you don't have to make your back button custom, actionbar supports it with : https://developer.android.com/reference/android/app/ActionBar.html#setDisplayHomeAsUpEnabled(boolean)

Custom action bar leaves black space on the left android?

I have created a custom action bar
XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="Choose"
android:textColor="#000000"
android:id="#+id/mytext"
android:textSize="18sp" />
</LinearLayout>
The java code
android.support.v7.app.ActionBar bar = getSupportActionBar();
bar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
bar.setCustomView(R.layout.action_layout);
The screenshot
As you can see it leaves a mall black space to the top left of the screen. I don't want it. I want it to be pure white.
What needs to be done to achieve this.

Try to call setDisplayShowHomeEnabled() with false.
http://developer.android.com/reference/android/app/ActionBar.html#setDisplayShowHomeEnabled%28boolean%29

Android ActionBar Progressbar position

I have an ActionBar with a 3 menu items. The last one of these is a refresh button.
The refresh button sets the...
setProgressBarIndeterminateVisibility(true);
setProgressBarVisibility(true);
... to true, which shows the spinning progress icon on the ActionBar. Great!
But the trouble is it shows it in front of all the other icons. I want it to the right of all the icons, so I can hide the refresh button so it looks like it replaces the refresh button when the spinner is visible.
How I can accomplish this?

You'll need to make a custom ActionBar layout and position a Progress Bar (set to Indeterminate mode) wherever you want it. Then, instead of calling setProgressBarVisibility(true), just call ProgressBar.setVisibility() based on whether you need to show the spinner or not.
Here's an example of my app's custom ActionBar layout:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/app_name"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"/>
<ProgressBar
android:id="#+id/action_bar_progress_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:indeterminate="true"
android:layout_toStartOf="#id/search_view"
android:visibility="gone" />
<SearchView
android:id="#+id/search_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:title="#string/menu_search"
android:icon="#drawable/ic_search"
android:showAsAction="always"
android:actionViewClass="android.widget.SearchView"
android:layout_alignParentLeft="false"
android:queryHint="#string/menu_search_hint"
android:iconifiedByDefault="false"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Just tweak the position of the ProgressBar until it's where you want it. Then, in your Activity's onCreate() set the layout:
ActionBar actionBar = getActionBar();
actionBar.setCustomView(R.layout.activity_start_screen_actionbar);
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);

ActionBar Overflow Menu styling information for manual implementation

I'm trying to duplicate the Overflow Menu dropdown functionality for other ActionBar items. I'm working on a manual implementation of this functionality as I think it has been left out of the environment (likely to force standardisation of UI's). Does anybody know what style / style items are used for the drop down list when you click on the Overflow menu?
EDIT
The overflow button is actually a modified spinner. Here is the style information for it.
<style name="Widget.Holo.Spinner" parent="Widget.Spinner.DropDown">
<item name="android:background">#android:drawable/spinner_background_holo_dark</item>
<item name="android:dropDownSelector">#android:drawable/list_selector_holo_dark</item>
<item name="android:popupBackground">#android:drawable/menu_dropdown_panel_holo_dark</item>
<item name="android:dropDownVerticalOffset">0dip</item>
<item name="android:dropDownHorizontalOffset">0dip</item>
<item name="android:dropDownWidth">wrap_content</item>
<item name="android:popupPromptView">#android:layout/simple_dropdown_hint</item>
<item name="android:gravity">left|center_vertical</item>
</style>

Here is a roundup of what I've cobbled together:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dropdownContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/leftBuffer"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<LinearLayout
android:layout_width="150dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/actionbarDropdown"
style="#style/Widget.ActionBarDropDown"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#android:color/transparent"
android:entries="#array/sortOptions" />
<LinearLayout
android:id="#+id/bottomBuffer"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:id="#+id/rightBuffer"
android:layout_width="118px"
android:layout_height="match_parent" />
</LinearLayout>
Adding an onClick to an ActionBar item which: adds the above layout as a child to your Activities root ViewGroup gives you the illusion of a drop down.
Adding an onClick to each of the buffers which removes the view from the root ViewGroup allows the drop down to "exit" when you try and move focus.
The styling information for the drop down is:
<item name="android:background">#drawable/menu_dropdown_panel_holo_light</item>
<item name="android:dropDownSelector">#drawable/list_selector_background</item>
The layout for each list item is:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="48dp"
android:textSize="17sp"
android:gravity="right|center_vertical"
style="?android:attr/dropDownItemStyle"
android:ellipsize="marquee"
android:id="#android:id/text1">
</TextView>
This doesn't give a perfect copy of the functionality of an overflow drop down but it's pretty darn close. I am very interested if anyone else knows a way to reproduce this functionality in a more integrated way!

I achive this by having a simple custom view that I put in the ActionBar:
<?xml version="1.0" encoding="utf-8"?>
<ImageButton xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_starred"
android:layout_width="wrap_content"
android:layout_height="match_parent"
style="?android:attr/actionButtonStyle"
android:src="#drawable/ic_action_star" />
I then attach a OnClickListener to it in onCreateOptionsMenu() which simply adds a Fragment which takes care of creating a ListPopupWindow and setting the anchor to be the action view. It finds the action view via getActivity().findViewById(R.id.action_starred).
That's simply it, you can set the popup to be modal to make it behave more like a menu. As list items you can use something like android.R.layout.simple_dropdown_item_1line.
This method should work equally well even if you don't put the view in the ActionBar as I do.