30 Jan 2013


How to create Contextual Action Mode Menu in Android

Context Menus provides more flexibility and action which affects the specific item or a context frame in an user interface.It is available for any kind of view like ListView or GridView.
There are two ways of using Context Menus.
  1. Floating Context Menuvisit here for more details.
  2. Contextual Action Mode- This is a system implementation of action mode which displays contextual action bar at the top of screen with action items.Contextual Action Mode is available at Android 3.0(API 11) or higher version otherwise you need to use Contextual Floating Menus.
Context Menu thumbnail
Lets us begin programming for Contextual action Mode.
  • First open eclipse and start new project by selecting new-> file-> Android Application Project.
  • Then fill the following details in the project window.
    • Application Name-ContextualAction_Mode
    • Project Name-ContextualAction_Mode
    • Package Name- action_mode.contextual
    • Build SDK-Android 4.1(API 14)
    • and then click next and next and then finish.
Context Menu 1
  •  Now open activity_main.xml under menu folder in the project.

Context Menu 2
  •  In activity_main.xml of menu folder you will see the following lines in activity-main.xml .
  •  <menu xmlns:android="http://schemas.android.com/apk/res/android">  
       <item android:id="@+id/menu_settings"  
         android:title="@string/menu_settings"  
         android:orderInCategory="100"  
         android:showAsAction="never" />  
     </menu>  
    
  • Just replace the above lines with these new lines in activity_main.xml.
  •  <?xml version="1.0" encoding="utf-8"?>  
     <menu xmlns:android="http://schemas.android.com/apk/res/android" >  
       <item  
         android:id="@+id/action1"  
         android:title="@string/Menu1"  
       />  
       <item  
         android:id="@+id/action2"  
         android:title="@string/Menu2"  
       />  
       <item  
         android:id="@+id/action3"  
         android:title="@string/Menu3"  
       />  
     </menu>  
    
  • Now open activity_main.xml in layout folder of the project.
    • In the activity_main.xml of layout folder you will see the following lines.
    •  <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" >  
         <TextView  
           android:layout_width="wrap_content"  
           android:layout_height="wrap_content"  
           android:layout_centerHorizontal="true"  
           android:layout_centerVertical="true"  
           android:text="@string/hello_world"  
           tools:context=".MainActivity" />  
       </RelativeLayout>  
      
  • Just replace the above lines with these new lines in activity-main.xml.
  •  <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" >  
       <TextView  
         android:id="@+id/text_view"  
         android:layout_width="wrap_content"  
         android:layout_height="wrap_content"  
         android:layout_centerHorizontal="true"  
         android:layout_centerVertical="true"  
         android:text="@string/hello_world"  
         tools:context=".MainActivity" />  
     </RelativeLayout>  
    
  • Now open strings.xml in values folder of the project.
    • In strings.xml of values folder you will the following lines.
    •  <resources>  
         <string name="app_name">ContextualAction_Mode</string>  
         <string name="hello_world">Hello world!</string>  
         <string name="menu_settings">Settings</string>  
         <string name="title_activity_main">MainActivity</string>  
       </resource  
      
  • Just replace the above lines in strings.xml with new lines given below.
  •  <resources>  
       <string name="app_name">Contextual Action Mode</string>  
       <string name="hello_world">Hello I am Context Action Mode, Long Press Me !!!</string>  
       <string name="menu_settings">Settings</string>  
       <string name="title_activity_main">Main Activity</string>  
       <string name="Menu1">Menu1</string>  
       <string name="Menu2">Menu2</string>  
       <string name="Menu3">Menu3</string>  
     </resources>  
    
  • Now open MainActivity.java in src folder of the project.
    •  In the MainActivity.java you will see the following code. 
    •  package action_mode.contextual;  
       import android.os.Bundle;  
       import android.app.Activity;  
       import android.view.Menu;  
       public class MainActivity extends Activity {  
         @Override  
         public void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.activity_main);  
         }  
         @Override  
         public boolean onCreateOptionsMenu(Menu menu) {  
           getMenuInflater().inflate(R.menu.activity_main, menu);  
           return true;  
         }  
       }  
      
  • Just replace the above lines in MainActivity.java with these new lines.
  •  package action_mode.contextual;  
     import android.annotation.SuppressLint;  
     import android.app.Activity;  
     import android.os.Bundle;  
     import android.view.ActionMode;  
     import android.view.Menu;  
     import android.view.MenuItem;  
     import android.view.View;  
     import android.view.View.OnLongClickListener;  
     import android.widget.TextView;  
     import android.widget.Toast;  
     @SuppressLint("NewApi")  
     public class MainActivity extends Activity {  
       ActionMode.Callback mActionModeCallback;  
       ActionMode mActionMode;  
       public void onCreate(Bundle savedInstanceState) {  
         super.onCreate(savedInstanceState);  
         setContentView(R.layout.activity_main);  
         TextView text_view = (TextView) findViewById(R.id.text_view);  
         mActionModeCallback = new ActionMode.Callback() {  
           public boolean onPrepareActionMode(ActionMode mode, Menu menu) {  
             return false;  
           }  
           public void onDestroyActionMode(ActionMode mode) {  
                mActionMode = null;  
           }  
           public boolean onCreateActionMode(ActionMode mode, Menu menu) {  
             mode.setTitle("Demo");  
             getMenuInflater().inflate(R.menu.activity_main, menu);  
             return true;  
           }  
           public boolean onActionItemClicked(ActionMode mode, MenuItem item) {  
             switch(item.getItemId()){  
             case R.id.action1:  
               Toast.makeText(getBaseContext(), "Menu1 is selcted", Toast.LENGTH_LONG).show();  
               mode.finish();  // Automatically exists the action mode, when the user selects this action  
               break;  
             case R.id.action2:  
               Toast.makeText(getBaseContext(), "Menu2 is selcted", Toast.LENGTH_LONG).show();  
               break;  
             case R.id.action3:  
               Toast.makeText(getBaseContext(), "Menu3 is selcted", Toast.LENGTH_LONG).show();  
               break;  
             }  
             return false;  
           };  
       };  
         text_view.setOnLongClickListener(new View.OnLongClickListener() {  
              text_view.setOnLongClickListener(new View.OnLongClickListener()public boolean onLongClick(View view) {  
             if (mActionMode != null) {  
               return false;  
             }  
             
             mActionMode = startActionMode(mActionModeCallback);  
             view.setSelected(true);  
             return true;  
           }  
           });  
       }  
     }  
    
  • The details of functions added in the above file MainActivity.java.
  • android.annotation.SuppressLint -It indicates that lint should ignore the specific warnings for the annotated elements.
  • android.view.ActionMode - It provides a contextual mode of user interface.
  • android.widget.Toast -Its a view containing a small message for the user.
  • @SuppressLint("NewApi") - Here we are disabling lint for not checking the NewApi issue.
  • ActionMode.Callback  - It invokes the contextual action mode when user selects the specific views.Its an interface and in its callback method we can specify the action for contextual action bar,respond to click events and manage other life cycle events.
  • onCreateActionMode(ActionMode mode, Menu menu) -called when action mode is created.
  • onPrepareActionMode(ActionMode mode, Menu menu) -called each time when action mode is shown.
  • onDestroyActionMode(ActionMode mode) -called when user exit the action mode.
  • onCreateActionMode(ActionMode mode, Menu menu) -called when user select contextual menu item.
  • text_view.setOnLongClickListener(new View.OnLongClickListener() - called when user long clicks on some view.
  • startActionMode(mActionModeCallback) -it return the action mode created to the system whenever it is called.

  • Now we are ready to run the project when we run the project we get a text view and on pressing long click on screen we get contextual action mode menu.

Context menu at run time
After long pressing in screen
Context Menu At Running

3 comments:

  1. Contextual Action mode in android studio
    if you are beginner and do not know how create a contextual action mode in android then this lecture can help a lot
    http://themasterworld.com/working-with-contextual-action-mode-android-studio/

    ReplyDelete
  2. como cambio el color del menu flotante, osea el background

    ReplyDelete

Translate