Android Options Menu Example


Android Options Menu
In this tutorial you will learn how to create an options menu in Android. Options menu is most commonly used, this menu is presented when a user presses the Menu button on the device.  "On Android 3.0 and higher, items from the options menu are presented by the action bar as a combination of on-screen action items and overflow options. Beginning with Android 3.0, the Menu button is deprecated (some devices don't have one), so you should migrate toward using the action bar to provide access to actions and other options."


1. Creating a Menu and Adding Items to It 

                To create a menu we need to go to the res\menu directory and create a new xml file (Right Click->New->Android xml file). When the file is create add the following code to it:
 <?xml version="1.0" encoding="utf-8"?>  
 <menu xmlns:android="http://schemas.android.com/apk/res/android" >  
    <item   
     android:id="@+id/germany"  
     android:title="@string/de" />  
    <item   
     android:id="@+id/sweden"  
     android:title="@string/se" />  
    <item   
     android:id="@+id/united_kingdom"  
     android:title="@string/gb" />  
    <item   
     android:id="@+id/malta"  
     android:title="@string/mt" />  
    <item   
     android:id="@+id/latvia"  
     android:title="@string/lv" />  
    <item   
     android:id="@+id/hungary"  
     android:title="@string/hu" />  
 </menu>  

               We have added six items to our menu. In our application we will be displaying a flag of a certain European Union country when a menu item is selected and therefore our item's ids are names of countries:) To get all the pictures that I am using download a source code please (link to it is provided at the end of the article). As you can see we are also using five string resources, to create them go to the res\values directory, open the strings.xml  file and add these lines to it:

  <string name="de">Germany</string>  
  <string name="gb">United Kingdom</string>  
  <string name="mt">Malta</string>  
  <string name="se">Sweden</string>  
  <string name="hu">Hungary</string>  
  <string name="lv">Latvia</string>  

2. Modifying activity_main.xml file

            Since we will be displaying flags we need to add an ImageView to the main layout. Go to the res\layout directory and add the following code to your activity_main.xml file:
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:tools="http://schemas.android.com/tools"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   android:background="#696969"  
   tools:context=".MainActivity" >  
   <ImageView  
     android:id="@+id/flag"  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:layout_alignParentTop="true"  
     android:layout_centerHorizontal="true"  
     android:layout_marginTop="108dp"  
     android:background="@drawable/eu_flag"/>  
 </RelativeLayout>  

3. Inflating Menu Into a Menu Object and Handling User Input

             Now we need to modify our Activity class. Go to the src directory and type the following code to the MainActivity.java file:

  1| package optionsmenuexample.tuts.com;  
  2| import android.os.Bundle;  
  3| import android.app.Activity;  
  4| import android.view.Menu;  
  5| import android.view.MenuItem;  
  6| import android.widget.ImageView;  
  7| public class MainActivity extends Activity {  
  8|     ImageView flag_image;  
  9|     @Override  
 10|    protected void onCreate(Bundle savedInstanceState) {  
 11|       super.onCreate(savedInstanceState);  
 12|       setContentView(R.layout.activity_main);  
 13|  }  
 14|  @Override  
 15|  public boolean onCreateOptionsMenu(Menu menu) {  
 16|       // Inflate the menu; this adds items to the action bar if it is present.  
 17|       getMenuInflater().inflate(R.menu.our_options_menu, menu);  
 18|       flag_image = (ImageView) findViewById(R.id.flag);  
 19|       return true;  
 20|  }  
 21|  @Override  
 22|  public boolean onMenuItemSelected(int featureId, MenuItem item) {  
 23|       switch(item.getItemId()) {  
 24|        case R.id.germany:  
 25|             flag_image.setImageResource(R.drawable.germany_flag);  
 26|             return true;                  
 27|        case R.id.malta:  
 28|             flag_image.setImageResource(R.drawable.malta_flag);  
 29|             return true;  
 30|        case R.id.latvia:  
 31|             flag_image.setImageResource(R.drawable.latvia_flag);  
 32|             return true;  
 33|        case R.id.sweden:  
 34|             flag_image.setImageResource(R.drawable.sweden_flag);  
 35|             return true;  
 36|        case R.id.united_kingdom:  
 37|             flag_image.setImageResource(R.drawable.united_kingdom_flag);  
 38|             return true;  
 39|        case R.id.hungary:  
 40|             flag_image.setImageResource(R.drawable.hungary_flag);  
 41|             return true;  
 42|       }  
 43|       return super.onMenuItemSelected(featureId, item);  
 44|  }  
 45|}  


Code explanation:

line 17 - we are obtaining a MenuInflator that can inflate menus from XML resources into an actual menu object;
line 22 - this is the method that is called when a menu item is selected. By calling getItemId() we can find out which item was selected, this method returns the unique ID for the menu item (defined by the android:id attribute);
line 23 - here we are using a switch statement to check each possible case;
line 25,28,31,34, 37 and 40 - we are changing an image resource to display a flag of a country that was selected.
DEMO
Android Options Menu
Android Options Menu
Source Code

References:
http://developer.android.com/guide/topics/ui/menus.html
http://developer.android.com/guide/topics/ui/menus.html#options-menu