[Android]AndroidDesign中ActionBar探究1

標籤：android   des   style   class   code   java   

概述

  從Google IO 2013大會以來越來越多的Android應用開始遵循Android的設計風格，簡單的就是google play和Gmail，在國內我們常用的軟體像知乎、印象筆記，主要的介面主要是左側的抽屜菜單（參照）、頂部和底部的ActionBar(參照)等。由於以前都是遵循Ios的設計開始開發的一些，現在在公司，公司開始推崇Android Desgin（我們公司總是走在前列啊，現在Team 開發的 Version Control開始在Git開發），我們也必須要看下ActionBar。

• 1. 應用表徵圖

  應用表徵圖是應用的標誌。在應用表徵圖位置擺放你自己的 logo。注意: 如果當時應用不再頂層介面，那麼在表徵圖左邊放置一個向左的箭頭，表示“向上”按鈕，使使用者可以回到上一級介面。“向上”按鈕的更多細節，請查看 導航 一節。

  應用表徵圖以及有和沒有“向上”按鈕的狀態。

• 2. 視圖控制

  如果你的應用通過多個不同的視圖顯示資料，這個地區將允許使用者切換視圖。可以使用下拉式功能表或者標籤控制項來實現。

  如果你的應用沒有多個視圖，你可以在這裡顯示不可操作的內容，例如標題或者品牌資訊。

   

• 3. 操作按鈕

  顯示應用中最重的操作。如果表徵圖放不下了，就自動移入“更多操作”菜單。

• 4. 更多操作

  將較少被用到的操作放在這個菜單裡。

當你要把操作放在多個操作欄中的時候，一般有三個選擇:

• 1. 操作欄
• 2. 頂部欄
• 3. 底部欄

如果使用者可以導航到應用的上一級螢幕，那麼操作欄中至少要放置“向上”按鈕。

為了讓使用者可以快速切換畫面和視圖，在頂部欄中放置標籤或者下拉式功能表 (spinner)。

當沒有足夠的空間顯示操作表徵圖時，使用底部欄。

ActionBar翻譯成漢語就是操作操作欄，如我們的搜尋，分享，返回，分類等都可以加入到ActionBar中，這樣對於螢幕空間有限的手機上，ActionBar成了萬能的Bar。

使用

 

添加操作欄

ActionBar在以前使用，或者是在3.0+開發，或者是在2.1+匯入ActionBarSherlock（這個在去年V7包加入ActionBar後，這個庫也光榮退休了），一般開發使用都是要考慮2.2，2.3這兩個平台，我們就要考慮V7這個官方推出的支援包。

3.0+

view plaincopy to clipboardprint?

1. <manifest ... >  
2.     <uses-sdk android:minSdkVersion="11" ... />  
3.     ...  
4. </manifest>  

<manifest ... >    <uses-sdk android:minSdkVersion="11" ... />    ...</manifest>

 

2.1+

  1  Activity繼承於V7中的ActionBarActivity

view plaincopy to clipboardprint?

1. <activity android:theme="@android:style/Theme.Holo.NoActionBar">  

<activity android:theme="@android:style/Theme.Holo.NoActionBar">

2 Activity的thme

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="18" />    ...</manifest>

這樣在Activity的頂部就會有一個ActionBar.

在ActionBar上我們還可以添加一些類似於Menu的item：

@Overridepublic boolean onCreateOptionsMenu(Menu menu) {// Inflate the menu; this adds items to the action bar if it is present.getMenuInflater().inflate(R.menu.main, menu);return true;}

menu/main

view plaincopy to clipboardprint?

1. <menu xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:app="http://schemas.android.com/apk/res-auto"  
3.     xmlns:tools="http://schemas.android.com/tools"  
4.     tools:context="com.example.actionbardemo.MainActivity" >  
5.   
6.     <item  
7.         android:id="@+id/action_settings"  
8.         android:orderInCategory="100"  
9.         android:title="@string/action_settings"  
10.         app:showAsAction="never"/>  
11.   
12. </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:orderInCategory="100"        android:title="@string/action_settings"        app:showAsAction="never"/></menu>

menu/main這個布局中的屬性中有一個app:showAsAction就是V7包的屬性。

　這個屬性可接受的值有：
　　1、always：這個值會使功能表項目一直顯示在Action Bar上。
　　2、ifRoom：如果有足夠的空間，這個值會使功能表項目顯示在Action Bar上。
　　3、never：這個值使功能表項目永遠都不出現在Action Bar上。
　　4、withText：這個值使功能表項目和它的表徵圖，菜單文本一起顯示。

移除操作欄

如果你不想為一個特定的Activity設定Action Bar，設定Activity主題為Theme.Holo.NoActionBar。 例如：

view plaincopy to clipboardprint?

1. <activity android:theme="@android:style/Theme.Holo.NoActionBar">  

<activity android:theme="@android:style/Theme.Holo.NoActionBar">

您還可以在運行時通過調用hide()隱藏Action Bar。例如：

view plaincopy to clipboardprint?

1. <activity android:theme="@android:style/Theme.Holo.NoActionBar">  

<activity android:theme="@android:style/Theme.Holo.NoActionBar">

當Action Bar隱藏，系統的Activity調整布局來填補所有可用螢幕空間。你可以通過調用show()顯示Action Bar。 隱藏和刪除操作欄可能會使Activity重新調整布局，重新使用Action Bar所佔用的空間。如果你的活動經常隱藏和顯示操作欄（如在Android應用程式庫），你可能想用疊加模式。疊加模式布局在Activity的頂部，而不是在螢幕空間上的Action Bar。這樣，你的布局可以在Action Bar隱藏和重新出現時保持不變。要啟用覆蓋模式，建立Activity主題並且將android:windowActionBarOverlay屬性值設定為true。欲瞭解更多資訊，請參閱樣式的Action Bar章節。

響應ActionBar的點擊事件

放置好了Menu items後，為了實現點擊我們要實現onOptionsItemSelected()，當我們點擊一個Item後，會根據item的id來響應。

view plaincopy to clipboardprint?

1. public boolean onOptionsItemSelected(MenuItem item) {  
2.         // Handle action bar item clicks here. The action bar will  
3.         // automatically handle clicks on the Home/Up button, so long  
4.         // as you specify a parent activity in AndroidManifest.xml.  
5.         int id = item.getItemId();  
6.         if (id == R.id.action_settings) {  
7.             return true;  
8.         }  
9.         return super.onOptionsItemSelected(item);  
10.     }  

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 AndroidManifest.xml.int id = item.getItemId();if (id == R.id.action_settings) {return true;}return super.onOptionsItemSelected(item);}

 

添加上一級Button

   為了能有使用者返回上一級操作，我們可以通過返回鍵，但是Google又推出一個可以取消返回鍵這個構想，在ActionBar上，有為使用者特定設定的返回上一級的Button。在Android4.1和v7包中都有體現，給出了上一級the parent activity。

view plaincopy to clipboardprint?

1. <application  
2.        android:allowBackup="true"  
3.        android:icon="@drawable/ic_launcher"  
4.        android:label="@string/app_name"  
5.        android:theme="@style/AppTheme" >  
6.        <activity  
7.            android:name="com.example.actionbardemo.MainActivity"  
8.            android:label="@string/app_name"  
9.            android:theme="@style/Theme.AppCompat.Light" >  
10.            <intent-filter>  
11.                <action android:name="android.intent.action.MAIN" />  
12.   
13.                <category android:name="android.intent.category.LAUNCHER" />  
14.            </intent-filter>  
15.        </activity>  
16.        <activity  
17.            android:name="com.example.actionbardemo.Second"  
18.            android:label="@string/title_activity_second" >  
19.            <meta-data  
20.            android:name="android.support.PARENT_ACTIVITY"  
21.            android:value="com.example.actionbardemo.MainActivity" />  
22.        </activity>  
23.    </application>  

 <application        android:allowBackup="true"        android:icon="@drawable/ic_launcher"        android:label="@string/app_name"        android:theme="@style/AppTheme" >        <activity            android:name="com.example.actionbardemo.MainActivity"            android:label="@string/app_name"            android:theme="@style/Theme.AppCompat.Light" >            <intent-filter>                <action android:name="android.intent.action.MAIN" />                <category android:name="android.intent.category.LAUNCHER" />            </intent-filter>        </activity>        <activity            android:name="com.example.actionbardemo.Second"            android:label="@string/title_activity_second" >            <meta-data            android:name="android.support.PARENT_ACTIVITY"            android:value="com.example.actionbardemo.MainActivity" />        </activity>    </application>