Wednesday, January 16, 2013

Android beginner tutorial: Part 53 - Menu checkboxes and radio buttons

In this tutorial we will learn how to create radio and checkbox lists in menus.

We are going to have 2 items in our Options menu today, both of which will be submenus. When opened, they will each contain 3 items, but the first one will display the items as radio buttons while the second one displays them as checkboxes.

First declare the necessary ids:

public static final int IDM_ONE = 101;
public static final int IDM_TWO = 102;
public static final int IDM_THREE = 103;
public static final int IDM_FOUR = 104;
public static final int IDM_FIVE = 105;
public static final int IDM_SIX = 106;
public static final int IDM_GROUP = 201;
public static final int IDM_GROUP2 = 202;

As you can see, I declared 2 ids for groups.

In the onCreateOptionsMenu() function, we'll add two submenus and add 3 items to each submenu. Before, we always left the first parameter's value of the add() method as Menu.NONE. This time, set them to IDM_GROUP for all items that belong to the first submenu and to IDM_GROUP2 for all items that belong to the second submenu.

Call setGroupCheckable() method of each submenu object. The method has 3 parameters - the id of the group, a boolean that determines whether this is a checkable group (set to true for both of submenus), and a boolean that determines whether this is a radiobutton or checkbox group. Set it to true for radiobuttons and to false for checkboxes.

@Override
public boolean onCreateOptionsMenu(Menu menu) {
SubMenu subMenu1 = menu.addSubMenu("Radio submenu");
subMenu1.add(IDM_GROUP, IDM_ONE, Menu.NONE, "Item one").setCheckable(true);
subMenu1.add(IDM_GROUP, IDM_TWO, Menu.NONE, "Item two").setCheckable(true);
subMenu1.add(IDM_GROUP, IDM_THREE, Menu.NONE, "Item three").setCheckable(true); 
subMenu1.setGroupCheckable(IDM_GROUP, true, true);

SubMenu subMenu2 = menu.addSubMenu("Checkbox submenu");
subMenu2.add(IDM_GROUP2, IDM_FOUR, Menu.NONE, "Item four").setCheckable(true);
subMenu2.add(IDM_GROUP2, IDM_FIVE, Menu.NONE, "Item five").setCheckable(true);
subMenu2.add(IDM_GROUP2, IDM_SIX, Menu.NONE, "Item six").setCheckable(true);
subMenu2.setGroupCheckable(IDM_GROUP2, true, false);

return super.onCreateOptionsMenu(menu);
}

The onOptionsItemSelected() function has the same content as in the previous tutorial, except that we also call the setChecked() method of the item and make it toggle the current item's value by setting it to the opposite of item.isChecked():

@Override
public boolean onOptionsItemSelected(MenuItem item){
item.setChecked(!item.isChecked());
CharSequence message;
switch(item.getItemId()){
case IDM_ONE:
message = "First item selected";
break;
case IDM_TWO:
message = "Second item selected";
break;
case IDM_THREE:
message = "Third item selected";
break;
case IDM_FOUR:
message = "Fourth item selected";
break;
case IDM_FIVE:
message = "Fifth item selected";
break;
case IDM_SIX:
message = "Sixth item selected";
break;
default:
return super.onContextItemSelected(item);
}
Toast toast = Toast.makeText(this, message, Toast.LENGTH_SHORT);
toast.show();
return true;
}

Full MainActivity.java code:

package com.kircode.codeforfood_test;

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

public class MainActivity extends Activity{

public static final int IDM_ONE = 101;
public static final int IDM_TWO = 102;
public static final int IDM_THREE = 103;
public static final int IDM_FOUR = 104;
public static final int IDM_FIVE = 105;
public static final int IDM_SIX = 106;
public static final int IDM_GROUP = 201;
public static final int IDM_GROUP2 = 202;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
SubMenu subMenu1 = menu.addSubMenu("Radio submenu");
subMenu1.add(IDM_GROUP, IDM_ONE, Menu.NONE, "Item one").setCheckable(true);
subMenu1.add(IDM_GROUP, IDM_TWO, Menu.NONE, "Item two").setCheckable(true);
subMenu1.add(IDM_GROUP, IDM_THREE, Menu.NONE, "Item three").setCheckable(true); 
subMenu1.setGroupCheckable(IDM_GROUP, true, true);

SubMenu subMenu2 = menu.addSubMenu("Checkbox submenu");
subMenu2.add(IDM_GROUP2, IDM_FOUR, Menu.NONE, "Item four").setCheckable(true);
subMenu2.add(IDM_GROUP2, IDM_FIVE, Menu.NONE, "Item five").setCheckable(true);
subMenu2.add(IDM_GROUP2, IDM_SIX, Menu.NONE, "Item six").setCheckable(true);
subMenu2.setGroupCheckable(IDM_GROUP2, true, false);

return super.onCreateOptionsMenu(menu);
}

@Override
public boolean onOptionsItemSelected(MenuItem item){
item.setChecked(!item.isChecked());
CharSequence message;
switch(item.getItemId()){
case IDM_ONE:
message = "First item selected";
break;
case IDM_TWO:
message = "Second item selected";
break;
case IDM_THREE:
message = "Third item selected";
break;
case IDM_FOUR:
message = "Fourth item selected";
break;
case IDM_FIVE:
message = "Fifth item selected";
break;
case IDM_SIX:
message = "Sixth item selected";
break;
default:
return super.onContextItemSelected(item);
}
Toast toast = Toast.makeText(this, message, Toast.LENGTH_SHORT);
toast.show();
return true;
}

}

If you test the application, you'll see that the radio buttons and checkboxes can be toggled and they keep their condition when the submenu is reopened.

Thanks for reading!

3 comments:

Geetha Devi said...

Perfect explanation about Menu checkboxes and radio buttons Android Training in chennai

Aishwariya said...

Given so much info in it, These type of articles keeps the users interest in the website, and keep on sharing more .
Android Training

Andria BZ said...


Nice tutorial on android technology hats-off to your effort. Your article explained the potential of android technology in coming years. Android Training in Chennai

Post a Comment