Some of you may have noticed that newer Android smartphones lack a menu-button.
Even my new Galaxy Nexus doesn’t have one.
Now, Google announced that they want to stimulate the use of the Action Bar and get rid of the menu-button.
With the action bar, actions are directly displayed on top of the screen so you can call direct actions in your app.
If you still use the menu, an icon with three docs centered vertically will be displayed and show the menu items when you touch this button.

I strongly advise you to start using this method, but don’t panic, lot’s of apps (including some of my apps) still use the menu button and it’ still supported
in the new Android OS.

How to?
To find the guidelines and official documentation on this issue, you can go to the official pages: http://developer.android.com/guide/topics/ui/actionbar.html
In this little tutorial, I will explain how you can change to the new menu in just a few steps so you can get started.

Step 1: modify your manifest.xml
First of all, you need to tell your app that it targets for an sdk with this new featere, as from Android 3.0, the action bar is included in all activities using the Theme.Hole theme.
Because this is API level 11, you can add something like this to your manifest:

1
2
3

<uses-sdk android:minSdkVersion="4"
android:targetSdkVersion="11" />

You can add this directly under the manifest-tag.

Step 2: create the menu
When creating your menu, you likely use the onCreateOptionsMenu method to set up a menu, this remains te same:

1
2
3
4
5
6
7
8
9
10
11

@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.mymenu, menu);
return true;
}

Because R.menu.mymenu refers to an xml resource, you have to make a little change to this document.

1
2
3
4
5
6
7
8
9
10
11
12
13

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/menu_add"
android:icon="@drawable/ic_menu_add"
android:title="@string/menu_add"
android:showAsAction="ifRoom|withText" />
</menu>

The first three lines will look familiar, what has ben added is the showAsAction, this makes sure that the item will be displayed in the optionsmenu when there is room available (ifRoom).
If there’s not enough room, an overflow menu will appear (icon with three dots vertically aligned) and the items will be listed there.
Always make sure you add the title for a menu item, screen readers make use of them and the overflow menu only displays the titles, also a longpress on an icon shows the tooltip based on the title of the item.