User defined ActionBar Action View: getting the width right

Question

On Ice Cream Sandwich:

I'm looking to add an AutoCompleteTextView to an ActionBar through the standard Action View mechanism (because SearchView isn't available pre-ICS and I'm also using ActionBarSherlock):

<item android:id="@+id/menu_search" android:actionViewClass="com.example.AutoCompleteActionView" android:showAsAction="ifRoom" android:title="@string/address"></item>
<item android:id="@+id/menu_close" android:icon="@drawable/ic_menu_close_clear_cancel" android:showAsAction="always"></item>
<item android:id="@+id/menu_ok" android:icon="@drawable/ic_menu_ok" android:showAsAction="always"></item>

This works, however by default it does not consume the available space in the ActionBar, which I would like.

I've looked at the source for the SearchView and seen how it overrides onMeasure, and done the same thing for my own class that I derived from AutoCompleteTextView. When I do this, the AutoCompleteTextView consumes all the space, leaving no space for two menu items I want to display to the right of it.

It looks as though the width returned from MeasureSpec.getSize() does not take into account the other two menu items when the MeasureSpec.getMode() is MeasureSpec.AT_MOST.

Anyone done anything similar? Any suggestions?

Thanks, Damian

Any chance you've found a solution to this yet? I need to replace the refresh menu item with an action view that has an animation on it, but the action view ends up being smaller than the menu item even though I create it using the correct layout dimensions. — mxk, Mar 07 '12 at 15:36
Actually I did today. It's clearly a workaround, but what I did is this: the ActionBar renders its item views using an internal view class, but assigns these views the menu item IDs. That means you can findViewById(menuItemId). I then took the measuredWidth and measuredHeight of that view and set it as minimum width/height on the action view. Works like a charm. — mxk, Mar 07 '12 at 21:21

score 13 · Accepted Answer · answered Apr 15 '12 at 15:47

I think this could help:

Create a collapsible menu item with a custom layout:

<?xml version="1.0" encoding="utf-8"?>
 <menu xmlns:android="http://schemas.android.com/apk/res/android" >
  <item
    android:id="@+id/menuSearch"
    android:showAsAction="always|collapseActionView" android:icon="@drawable/action_search" android:actionLayout="@layout/collapsible_absearch">
  </item>
</menu>

This is the custom layout:

<?xml version="1.0" encoding="utf-8"?>
 <AutoCompleteTextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ab_Search"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/search" />

Then in your activity:

public boolean onCreateOptionsMenu(Menu menu) {
    getSupportMenuInflater().inflate(R.menu.activitymenu, menu);

    MenuItem menuItem=menu.findItem(R.id.menuSearch);

    menuItem.setOnActionExpandListener(new OnActionExpandListener() {
        @Override
        public boolean onMenuItemActionExpand(MenuItem item) {
            mAbSearch=(AutoCompleteTextView) item.getActionView().findViewById(R.id.ab_Search);

            // Set your adapter and do whatever you want

            return true;
        }
    });

This example is pretty near, only one thing to comment, if anyone is looking to use this with the Actionbar compat, you have to change the namespace of the actionLayout property like this: xmlns:yourapp="http://schemas.android.com/apk/res-auto" > yourapp:actionLayout="@layout/action_search" — Ripityom, Nov 11 '13 at 20:49
Starting out with a collapsed menu item completely changes the interaction so I think this answer seems good but is not completely correct. Please consider accepting the news from Sergio Viudes below: http://stackoverflow.com/questions/9276039/user-defined-actionbar-action-view-getting-the-width-right/11602211#11602211 — faraday, Aug 04 '14 at 11:03

score 7 · Answer 2 · answered Jul 09 '12 at 21:50

I wasn't able to get Matthias's suggestion to work in code (maybe I was missing something), but adding a minWidth attribute to the topmost element in my Action View did the trick.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="64dip"
    android:minWidth="64dip"
    android:layout_height="match_parent"
    android:gravity="center" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"        
        android:layout_gravity="center"
        android:id="@+id/imageViewAnimatedProgressSpinner"
        android:background="@drawable/animated_progress_spinner" />

</FrameLayout>

this works, but really isn't great with the defined width. Have you found a better answer since? EDIT I found something: http://stackoverflow.com/questions/22823910/make-an-android-actionbars-actionviews-width-match-the-actionbars-width — SIr Codealot, Mar 01 '15 at 19:46

score 3 · Answer 3 · answered Jul 22 '12 at 16:58

This helps you?:

    ActionBar.LayoutParams layoutParams = new LayoutParams(android.app.ActionBar.LayoutParams.MATCH_PARENT, android.app.ActionBar.LayoutParams.MATCH_PARENT);
    View customNav = LayoutInflater.from(getSupportActionBar().getThemedContext()).inflate(R.layout.your_layout, null);
    getSupportActionBar().setCustomView(customNav, layoutParams);
    getSupportActionBar().setDisplayShowCustomEnabled(true);

score 2 · Answer 4 · answered Jan 11 '14 at 19:35

might be light years late, but if someone comes looking do the following on your action views to get them styled as the default action bar icons,

//Define a style which extends the themed action button in styles.xml, if you want you can use references to have dynamic styles.. this is an example for holo theme
<style name="ActionButtonStyle" parent="@android:style/Widget.Holo.ActionButton">

</style>

//For your action view, use this as the style, I find the issue with Progress bars and hence //the example,

<?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"
    style="@style/ActionButtonStyle" >

    <ProgressBar
        android:id="@+id/progressBar2"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </ProgressBar>

</LinearLayout>

score 1 · Answer 5 · edited May 23 '17 at 12:22

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="wrap_content"
                android:layout_height="match_parent">
    <EditText xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:id="@+id/visibility_search_edit_text"/>
</RelativeLayout>

Credit to this post: Make an Android ActionBar's ActionView's Width match the ActionBar's width. This will make it stretch.

User defined ActionBar Action View: getting the width right

5 Answers5

Linked