Andoroid Action Bar Menu items

ActionBar is a header sort of thing with number of powerful options to play with the application.
Let us come to a conclusion why to go for an action bar?

We will be having some options in our activity like.. popping a Menu, search in the activity, Tabs, title, app icon  etc. Think, if there is a mechanism where we can handle all these tasks in a single view sort of thing.. Yes .. this can be achieved by action bars.

The above pic represents action bar in Google Play App.

Before learning the tabbed behavior, we will go through the integration of menu items with Actionbars. The new menu items with action bar looks like :

Three vertical dots represent the Menu, Upon Click menu items will be populated.

Coming to implementation, there are no changes compared to implementation of menu in previous versions.

1. Define menu options in xml.
2. Inflate them and add it to the menu in OnCreateOptionsMenu method.

My menu action_items.xml look like.

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:id="@+id/refresh"
        android:icon="@drawable/refresh"
         
        android:title="Refresh"/>
    <item
        android:id="@+id/inbox"
        android:icon="@drawable/email"
        android:title="Inbox"/>

    <item
        android:id="@+id/compose"
        android:title="Compose"/>

</menu>

Now, Override OnCreateOptionsMenu() and inflate menu. This piece of code is shown below.

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.action_items, menu);
    return true;
}

We are having number of options to arrange menu within this action bar itself. We can display icons for these menu items.For displaying menu icons provide another tag android:showAsAction="ifRoom". This will show the menu item's icon, if there is sufficient room on the ActionBar. This output wil be like

My action_items.xml look like

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:id="@+id/refresh"
        android:icon="@drawable/refresh"
        android:showAsAction="ifRoom"
        android:title="Refresh"/>
    <item
        android:id="@+id/inbox"
        android:icon="@drawable/email"
        android:showAsAction="ifRoom"
        android:title="Inbox"/>
    <item
        android:id="@+id/compose"
        android:title="Compose"/>

</menu>

Observe showAsAction tag.

We can split the action bar's to the bottom of the screen when screen is narrow. This can be achieved by adding a tag in manifest file. Add android:uiOptions="splitActionBarWhenNarrow" tag in the Activity of manifest file. The output will be looking like.

With the uiOptions tag in Manifest file, the complete menu is pushed to bottom. In landscape, considering the real estate available, these UI changes wont be reflected. Menu will be placed on the top in landscape mode.

In Some of the devices, where the menu hard key is present, the menu options with 3 dots will not be shown. The default behavior of the device will override the action bar behavior. In such cases, if you strictly want the action bar behavior, call the below method in onCreate() method of your activity.

private void getOverflowMenu() {

     try {
        ViewConfiguration config = ViewConfiguration.get(this);
        Field menuKeyField = ViewConfiguration.class.getDeclaredField("sHasPermanentMenuKey");
        if(menuKeyField != null) {
            menuKeyField.setAccessible(true);
            menuKeyField.setBoolean(config, false);
        }
    } catch (Exception e) {
        e.printStackTrace();
    }
}

For the backward compatibility of Action Bar's, refer to the topic ActionBar's with Sherlock API

Related topics : 

• Tabs with Sherlock ActionBar