Tuesday, September 18, 2012

Android Menus and Action Bar

Android Menus and Action Bar - Hallo sahabat Google Android Developer Tutorial, Pada Artikel yang anda baca kali ini dengan judul Android Menus and Action Bar, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Android menus and action bar tutorial, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Android Menus and Action Bar
link : Android Menus and Action Bar

Baca juga


Android Menus and Action Bar

Android Menus and Action Bar


The Tutorial focuses on following views. The views discussed include:
  •  Context Menu
  •   Options Menu
Menus

Menus are useful for displaying additional options that are not directly visible on the main UI of an application. There are two main types of menus in Android:
  •  Context Menu – displays information related to a particular view on an activity. In Android, to activate a context menu you press and hold on to it.
  •   Options Menu – displays information related to the current activity. In Android, you activate the options menu by pressing the MENU key.
Figure 1 shows an example of an options menu in the Browser application. The option menu is displayed whenever the user presses the MENU button. The menu items displayed is dependent on the current activity that is running.


Figure 1 - The options menu in the Browser applicationFigure 2 - The context menu in the Browser application
                                   Figure 2 shows a context menu that is displayed when the user presses and holds on a hyperlink displayed on the page. The menu items displayed are dependent on the component or view currently selected. To activate the context menu, the user selects an item on the screen and either presses and holds it or simply presses the center button on the directional keypad.
                If you're running your code on Android 3.0+, the icons in the menu are not shown by design. This is a design decision by Google.You are recommended to use Action Bar.
Action Bar
                 Android action bar was introduced to maintain a consistent navigation across the application. It has the powerful capabilities like adapting to screen configurations (landscape & portrait), prioritizing important actions, adding widgets to action bar (search, sharing etc.), providing navigation between screens (drop-down & tabbed navigation) and much more.
             Action bar is introduced in android 3.0 (API level 11), but if you want your app to support action bar in older versions too, then use Support Library to make it compatible with older versions (Android 2.1 and above)
Here the important xml attributes should be known are
android:icon – Defines the icon of the action item.
android:title – Title for the icon.
android:showAsAction – Defines the visibility of the action item. It accepts following
values.
ifRoom
Displays the icon if there is space available on the screen
never
Never places this icon on the action bar
always
Forces to display the icon always irrespective of space available. This way is not suggested.
withText
Displays a text along with the icon. Normally the text value defined by android:title will be displayed
collapseActionView
Defines the action layout associated with it. This action view defined usingandroid:actionLayout or android:actionViewClass

Split action bar provides a separate bar at the bottom of the screen to display all action items when the activity is running on a narrow screen (such as a portrait-oriented handset).
The Demonstrative Application portrays the usage of  options menu and action Bar.on  clicking the menu it shows the Toast message on the clicked menu item
1.Create  Android project with details as listed in the table below.

Property name
Property value
Project name
SRM_ActionBar_MenuTutorial
Package name
in.ac.srmuniv.actionbar_menututorial
Activity name
MainActivity
Layout xml name
activity_main
2.Copy the code  to the file activity_main.xml in res/layout folder 
<?xml version="1.0"encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/btn1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="LongClick" />

</LinearLayout>
2.Copy the code  to the file main.xml in res/menu folder
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/menu_srm"    

        android:icon="@drawable/srm"
        android:showAsAction="never"
        android:title="About SRM"/>
    <item
        android:id="@+id/menu_campus"
        android:icon="@drawable/campus"
        android:showAsAction="never"
        android:title="Campus"/>
    <item
        android:id="@+id/menu_courses"
        android:icon="@drawable/courses"
        android:showAsAction="never"
        android:title="Courses"/>
    <item
        android:id="@+id/menu_location"
        android:icon="@drawable/location"
        android:showAsAction="never"
        android:title="Location"/>


</menu>

           Figure 3 - Adding images to the res/drawable folder
3.Copy the code in MainActivity.java. Activity.
packagein.ac.srmuniv.actionbar_menututorial;

importandroid.app.Activity;
import android.os.Bundle;
importandroid.view.ContextMenu;
importandroid.view.ContextMenu.ContextMenuInfo;
import android.view.Menu;
importandroid.view.MenuInflater;
importandroid.view.MenuItem;
import android.view.SubMenu;
import android.view.View;
importandroid.widget.Button;
importandroid.widget.Toast;

public class MainActivity extends Activity {
     @Override
     public void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);

           setContentView(R.layout.activity_main);
           Button btn = (Button) findViewById(R.id.btn1);
           btn.setOnCreateContextMenuListener(this);
     }

     @Override
     public booleanonCreateOptionsMenu(Menu menu) {
           CreateMenu(menu);
           return super.onCreateOptionsMenu(menu);
     }

     private void CreateMenu(Menu menu) {
          
           /*
            * SubMenu sub = menu.addSubMenu("More");
            * sub.getItem().setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
            * sub.getItem().setIcon(R.drawable.actionbar);
            */

           MenuInflater menuInflater = getMenuInflater();
           menuInflater.inflate(R.menu.main, menu);
     }

     @Override
     public booleanonOptionsItemSelected(MenuItem item) {
           MenuChoice(item);
           return super.onOptionsItemSelected(item);
     }

     @Override
     public booleanonContextItemSelected(MenuItem item) {
           MenuChoice(item);
           return super.onContextItemSelected(item);
     }

     public voidonCreateContextMenu(ContextMenu menu, View view,
                ContextMenuInfo menuInfo) {
           super.onCreateContextMenu(menu, view, menuInfo);
           CreateMenu(menu);
     }

     private boolean MenuChoice(MenuItem item) {
           switch (item.getItemId()) {
           case R.id.menu_srm:
                Toast.makeText(this, "You clicked on About SRM", Toast.LENGTH_LONG)
                .show();
                return true;
           case R.id.menu_campus:
                Toast.makeText(this, "You clicked on Campus", Toast.LENGTH_LONG)
                .show();
                return true;
           case R.id.menu_courses:
                Toast.makeText(this, "You clicked on Courses", Toast.LENGTH_LONG)
                .show();
                return true;
           case R.id.menu_location:
                Toast.makeText(this, "You clicked on Location", Toast.LENGTH_LONG)
                .show();
                return true;

           }
           return false;
     }
 }
4.No need to modify Androidmanifest.xml
<?xml version="1.0"
encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="in.ac.srmuniv.actionbar_menututorial"
    android:versionCode="1"
    android:versionName="1.0" >
    <uses-sdk
        android:minSdkVersion="14"
        android:targetSdkVersion="17" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="in.ac.srmuniv.actionbar_menututorial.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>

</manifest>

5.Run the application in the emulator. 



Figure 4 - Displaying a options menu in your application 
Figure 5 - Displaying context menu in your application
CODE EXPLANATION
The main.xml in res/menu folder contains entries of menu item attributes such as  icons,menu title etc.The  attribute android:showAsAction="never" makes the optionMenu available through menu button click.
                 The CreateMenu() method creates a list of menu items available for the activity.
           MenuInflater menuInflater = getMenuInflater();
           menuInflater.inflate(R.menu.main, menu); 
The MenuChoice() method displays the selected menu item using the Toast class. 
To display and use the options menu for your activity, you need to override two methods 1. onCreateOptionsMenu() 2.onOptionsItemSelected()
The onCreateOptionsMenu() method is called when the Activity is created for only time. When a menu item is selected, the onOptionsItemSelected() method will be called The selected  menu item selected will be identified and appropriate logic code will be called(a whatever you need to do).private void Createmenu(Menu menu) and private boolean MenuChoice(MenuItem item) are the user defined  helper. 
 If you want to associate a context menu to a view on an activity,you need to call the setOnCreateContextMenuListener() method of that particular view. For example, the following code shows how you can associate a context menu with the Button view:  
           Button btn = (Button) findViewById(R.id.btn1);
           btn.setOnCreateContextMenuListener(this);
To display and use the context menu for your activity, you need to override two methods 1. onCreateContextMenu() 2.onContextItemSelected().
Like the Options menu, you need to override  the onCreateContextMenu() and onContextItemSelected() methods. Press the Button view and hold for a few seconds.You will now see the context menu (see Figuri).
If the options menu has more than six items, there will be aMore menu item to represent the additional menu
 items.
Action Bar
Change the menu attribute android:showAsAction="always" makes the optionMenu available through Action Bar.
6.Copy the code  to the file main.xml in res/menu folder
<menu xmlns:android="http://schemas.android.com/apk/res/android"
>
     <item
        android:id="@+id/menu_srm"
        android:icon="@drawable/srm"
        android:showAsAction="always"
        android:title="About SRM"/>
    <item
        android:id="@+id/menu_campus"
        android:icon="@drawable/campus"
        android:showAsAction="always"
        android:title="Campus"/>
    <item
        android:id="@+id/menu_courses"
        android:icon="@drawable/courses"
        android:showAsAction="always"
        android:title="Courses"/>
    <item
        android:id="@+id/menu_location"
        android:icon="@drawable/location"
        android:showAsAction="always"
        android:title="Location"/>
 </menu>

7.Run the application in the emulator. 
Figure 6 Shows Action bar containing icons of  menu.
8.Change the MainActivity.java code by replacing the method CreateMenu() with the code given below.7.Run the application in the emulator. 
     private void CreateMenu(Menu menu) {
           SubMenu submenu = menu.addSubMenu("More");
  submenu.getItem().setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
           submenu.getItem().setIcon(R.drawable.actionbar);
          MenuInflater menuInflater = getMenuInflater();
       menuInflater.inflate(R.menu.main, submenu);
     }
9.Run the application in the emulator. 
 
Figure 7 Shows Action bar in collapseActionView,with Action Bar icon clicked to expand the menu. 
Figure 8 Shows the Toast message showed when an menu is selected.
10.Modify the Androidmanifest.xml file
<activity
  android:name="in.ac.srmuniv.actionbar_menututorial.MainActivity"
            android:label="@string/app_name"
            android:uiOptions="splitActionBarWhenNarrow" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
11.Run the application in the emulator. 

CODE EXPLANATION
       You need to run the application with minimum API level 11 or one should add support library to run the application in lower API level devices.CollapseActionView is prefered if you have more menus for an activity,use SubMenu class to create CollapseActionView.
The menu attribute android:showAsAction="ifRoom"ensures that menu item will be available in Action Bar if only space is available otherwise it will move in to collapsable  view.
                                To enable split action bar when using the support library, you must do two things:
Add android:uiOptions="splitActionBarWhenNarrow" to each <activity> element or to the <application> element. This attribute is understood only by API level 14 and higher (it is ignored by older versions).
              To support older versions, add a <meta-data> element as a child of each <activity> element that declares the same value for "android.support.UI_OPTIONS"
               <meta-data android:name="android.support.UI_OPTIONS"
                   android:value="splitActionBarWhenNarrow" />



Demikianlah Artikel Android Menus and Action Bar

Sekianlah artikel Android Menus and Action Bar kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Android Menus and Action Bar dengan alamat link https://googleandroiddevelopertutorial.blogspot.com/2012/09/android-menus-and-action-bar.html

Artikel Terkait

Android Menus and Action Bar
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email