Android Options Menu Example

0

In this article, I am going to show you an example of options menu. The options menu is the collection of menu items for an activity. On Android 3.0 and higher, an option menu can be presented in two different view.

  1. You can display the most important and frequently used items in the action bar itself.
  2. Items which are rarely used can be displayed in the overflow option. We will see shortly what this means.

Steps to create the options menu

  1. Create menu XML
  2. Override onCreateOptionsMenu() in the activity to inflate the menu
  3. Override onOptionsItemSelected to handle the menu item once selected

Create Menu XML

Android provides a standard XML format to define menu items. This follows the concept of decoupling the view from the controller part. The view part takes care of the look like the title, icon and whether the menu item should be displayed in the action bar or in the overflow section. The controller take care of the handling part when the menu item is clicked.

To define the menu, the XML file should be created in location res/menu/ directory. You are free to chose the file name and there is no constraint on it. The structure of the XML is pretty simple. The top level element is called <menu>. Each menu item is represented by <item>. This element again may contain a nested <menu> element in order to create a submenu.
Each menu item has an id attribute which allows the controller to recognize the item when the user selects it.

main.xml:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.jopc.sandbox.MainActivity" >

    <item
        android:id="@+id/add"
        android:orderInCategory="1"
        android:showAsAction="always"
        android:title="@string/add"
        android:icon="@drawable/add_small_icon"/>
    <item
        android:id="@+id/update"
        android:orderInCategory="2"
        android:showAsAction="always"
        android:title="@string/update"
        android:icon="@drawable/edit_small_icon"/>
    <item
        android:id="@+id/delete"
        android:orderInCategory="3"
        android:showAsAction="always"
        android:title="@string/delete"
        android:icon="@drawable/delete_small_icon"/>
    <item
        android:id="@+id/info"
        android:orderInCategory="4"
        android:showAsAction="never"
        android:title="@string/info"
        android:icon="@drawable/info_small_icon"/>

</menu>

Inflate the menu

Since each page is represented by an activity class, you need to explicitly specify the options menu for an activity. You can do this by overriding onCreateOptionsMenu() and then inflate your menu resource into the Menu.

OptionMenuExampleActivity:

package com.javarticles.android;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

public class OptionMenuExampleActivity extends Activity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.welcome);		
	}
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);		
		return true;
	}
}

Handle menu items

Override onOptionsItemSelected to handle the menu items.
When the user selects an item from the options menu, the system callsonOptionsItemSelected() method. The method has just one argument value and that is the MenuItem selected. You can identify the item by calling getItemId(),you can match this ID against known menu items to perform the appropriate action. In the below example, we call on Toast.makeText() which lets us know the item that is being clicked.

OptionMenuExampleActivity:

package com.javarticles.android;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

public class OptionMenuExampleActivity extends Activity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.welcome);		
	}
	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);		
		return true;
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		// Handle action bar item clicks here. The action bar will
		// automatically handle clicks on the Home/Up button, so long
		// as you specify a parent activity in AndroidManifest.xml.
		int id = item.getItemId();
		switch (id) {
		case R.id.add:
			Toast.makeText(getApplicationContext(), "You have clicked on add", Toast.LENGTH_SHORT).show();
			break;
		case R.id.update:
			Toast.makeText(getApplicationContext(), "You have clicked on update", Toast.LENGTH_SHORT).show();
			break;
		case R.id.delete:
			Toast.makeText(getApplicationContext(), "You have clicked on delete", Toast.LENGTH_SHORT).show();
			break;
		case R.id.info:
			Toast.makeText(getApplicationContext(), "You have clicked on info", Toast.LENGTH_SHORT).show();
			break;
		}
		return super.onOptionsItemSelected(item);
	}
}

Final look of options menu

Options Menu

Options Menu

Download the Source Code

In this article, I showed you an example of options menu. You can download the source code here: optionMenuExample

Share.

Comments are closed.