[Android] A study of Actionbar in Androiddesign 1

Overview

Since the Google IO 2013 conference, more and more Android apps have started to follow the Android design style, Simple is Google Play and Gmail, in China we commonly used software like to know, Evernote, the main interface is the left side of the drawer menu (reference), Top and bottom of the Actionbar (reference) and so on. Since the previous design has been followed by iOS to develop some, now in the company, the company began to respect Android Desgin (our company is always in the forefront, now team Development Version control started in git development), we also have to look at the Actionbar.

• 1. App icon

  The app icon is the app's logo. Place your own logo on the app icon. Note: If the app no longer has a top-level interface, place a left-pointing arrow on the left side of the icon to indicate the "up" button, allowing the user to go back to the previous level. For more details on the "Up" button, see the Navigation section.

  The app icon and the status with and without the up button.

• 2. View Control

  If your app displays data in multiple different views, this area will allow the user to switch views. You can use a drop-down menu or a label control to implement it.

  If your app doesn't have multiple views, you can display non-actionable content, such as headlines or branding information, here.

• 3. Operation Button

  Displays the heaviest action in the app. If the icon doesn't fit, it's automatically moved into the more Actions menu.

• 4. More Operations

  Put less-used actions in this menu.

When you want to put the operation in more than one action bar, there are generally three options:

• 1. Action Bar
• 2. Top Bar
• 3. Bottom Bar

If the user can navigate to the top-level screen of the app, at least the up button should be placed in the action bar.

To allow users to quickly switch screens and views, place a label or drop-down menu (spinner) in the top bar.

Use the bottom bar when there is not enough space to display the action icon.

Actionbar translated into Chinese is the operation of the Operation Bar, such as our search, sharing, return, classification, etc. can be added to the Actionbar, so for screen space is limited to the mobile phone, Actionbar became a universal bar.

Use

Add Action Bar

Actionbar was previously used, or was developed in 3.0+, or was introduced in 2.1+ Actionbarsherlock (this library was also retired after the V7 package was added to Actionbar last year), General development use is to consider 2.2,2.3 these two platforms, we need to consider V7 this official launch of the support package.

3.0+

View Plaincopy to Clipboardprint?

1. <manifest ... >
2. <USES-SDK android:minsdkversion="One" ... />
3. ...
4. </manifest>

<manifest >    <uses-sdk android:minsdkversion= "One" .../>    ...</manifest>

2.1+

1 activity inherits from Actionbaractivity in V7

View Plaincopy to Clipboardprint?

1. <activity android:theme= "@android: Style/theme.holo.noactionbar" >

<activity android:theme= "@android: Style/theme.holo.noactionbar" >

2 Thme of activity

View Plaincopy to Clipboardprint?

1. <activity android:theme= "@style/theme.appcompat.light" ... >

<activity android:theme= "@style/theme.appcompat.light" ... >

<manifest >    <uses-sdk android:minsdkversion= "7"  android:targetsdkversion= "/>    ... </manifest>

This will have a actionbar at the top of the activity.

On Actionbar We can also add some item similar to menu:

@Overridepublic boolean Oncreateoptionsmenu (Menu menu) {//Inflate the menu; This adds items to the action bar if it is PR Esent.getmenuinflater (). Inflate (R.menu.main, menu); return true;}

Menu/main

View Plaincopy to Clipboardprint?

2. <menu xmlns:android= "Http://schemas.android.com/apk/res/android"   
4. xmlns:app="Http://schemas.android.com/apk/res-auto"
6. xmlns:tools="Http://schemas.android.com/tools"
8. tools:context="com.example.actionbardemo.MainActivity" >
12. <item
14. android:id="@+id/action_settings"
16. android:orderincategory="
18. android:title="@string/action_settings"
20. app:showasaction="Never"/>
24. </menu>

<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.example.actionbardemo.MainActivity ">    <item        android:id=" @+id/action_settings "        android:o rderincategory= "android:title="        @string/action_settings "        app:showasaction=" Never "/></menu >

Menu/main one of the properties in this layout is a app:showasaction that is the property of the V7 package.

The acceptable values for this property are:
1. Always: This value causes the menu item to be displayed on the action bar.
2. Ifroom: If there is enough space, this value causes the menu item to appear on the action bar.
3. Never: This value causes the menu item to never appear on the action bar.
4. Withtext: This value causes the menu item to be displayed along with its icon and the text of the menus.

Removing the Action Bar

If you do not want to set the action Bar for a specific activity, set the activity theme to Theme.Holo.NoActionBar. For example:

View Plaincopy to Clipboardprint?

1. <activity android:theme= "@android: Style/theme.holo.noactionbar" >

<activity android:theme= "@android: Style/theme.holo.noactionbar" >

You can also hide the action Bar at run time by calling Hide (). For example:

View Plaincopy to Clipboardprint?

1. <activity android:theme= "@android: Style/theme.holo.noactionbar" >

<activity android:theme= "@android: Style/theme.holo.noactionbar" >

When Action Bar is hidden, the system's activity adjusts the layout to fill all available screen space. You can display the action Bar by calling show (). Hiding and deleting the action bar may cause the activity to rearrange the layout and re-use the space occupied by the action Bar. If your activity often hides and displays action bars (such as in the Android app Gallery), you may want to use overlay mode. The overlay mode layout is at the top of the activity, not the action Bar on the screen space. This way, your layout can remain intact when the action Bar is hidden and re-appearing. To enable overlay mode, create an activity topic and set the Android:windowactionbaroverlay property value to True. For more information, see the Action Bar section of the style.

Responding to Actionbar click events

After placing the menu items, in order to implement the click we want to implement onoptionsitemselected (), when we click on an item, it will respond according to the item ID.

View Plaincopy to Clipboardprint?

2. Public boolean onoptionsitemselected (MenuItem item) {
4. //Handle Action Bar item clicks here. The Action Bar would
6. //automatically handle clicks on the Home/up button, so long   
8. //As you specify a parent activity in Androidmanifest.xml.   
10. int  id = item.getitemid ();
12. if (id = = r.id.action_settings) {
14. return   true;
16. }
18. return   Super. onoptionsitemselected (item);
20. }

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 and RoidManifest.xml.int id = item.getitemid (); if (id = = r.id.action_settings) {return true;} return super.onoptionsitemselected (item);}

Add a button at the top level

In order to have the user return to the previous level of operation, we can go back to the key, but Google has introduced a can cancel the return of the concept, on the Actionbar, there is a user-specific settings for the return of the top-level button. In both the Android4.1 and the V7 package, the parent activity is given at the previous level.

View Plaincopy to Clipboardprint?

2. <application
4. android:allowbackup="true"
6. android:icon="@drawable/ic_launcher"
8. Android:label="@string/app_name"
10. Android:theme="@style/apptheme" >
12. <activity
14. Android:name="com.example.actionbardemo.MainActivity"
16. Android:label="@string/app_name"
18. Android:theme="@style/theme.appcompat.light" >
20. <intent-filter>
22. <action android:name="Android.intent.action.MAIN" / >
26. <category android:name="Android.intent.category.LAUNCHER" />
28. </intent-filter>
30. </activity>
32. <activity
34. Android:name="Com.example.actionbardemo.Second"
36. Android:label="@string/title_activity_second" >
38. <meta-data
40. Android:name="Android.support.PARENT_ACTIVITY"
42. android:value="com.example.actionbardemo.MainActivity" />
44. </activity>
46.    </application>  

 <application android:allowbackup= "true" android:icon= "@drawable/ic_launcher" android:label= "@stri Ng/app_name "Android:theme=" @style/apptheme "> <activity android:name=" Com.example.actionba Rdemo.            Mainactivity "android:label=" @string/app_name "android:theme=" @style/theme.appcompat.light "> <intent-filter> <action android:name= "Android.intent.action.MAIN"/> &lt         Category android:name= "Android.intent.category.LAUNCHER"/> </intent-filter> </activity> <activity android:name= "Com.example.actionbardemo.Second" android:label= "@string/title_ac Tivity_second "> <meta-data android:name=" Android.support.PARENT_ACTIVITY "Android: Value= "com.example.actionbardemo.MainActivity"/> </activity> </application>