Android 4.0からのActionBar再入門
Android 3.x(Honeycomb)から追加された新UI、ActionBar(アクションバー)はAndroid 4.0.x(ICS:IceCreamSandwich)でも重要なユーザインターフェイスです。
今回はAndroid 4.0(スマートフォン版)に焦点を当てて、ActionBarの使い方を解説します。Android4.0 SDKからアプリケーションのデフォルトテーマが変わっており、ActionBarを標準で利用できます。
ActionBarの有無によるメニュー表示の違い
以下は「?」アイコンをもったヘルプメニューの表示を例に、ActionBarを使った場合、使わなかった場合のスクリーンショットです。UIの印象がずいぶん違うことが見て取れます。複数メニューを表示する場合はSplitActionBarが便利です。
旧メニューデザイン [?]メニューは画面下に表示 |
ActionBarを利用 [?]メニューは画面上部に表示 |
SplitActionBarを利用 メニューは画面下部 |
詳細な使い方については続きから。
もしActionBarを利用したくないなら
Android4.0以降でActionBarを利用しない場合、テーマを変更すると手軽です。
■AndroidManifest.xml
<activity android:label="@string/app_name" android:name=".SpritActionBarActivity" android:theme="@android:style/Theme.Black"> <intent-filter > <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>
4行目:テーマ”Theme.Black”を指定しています。
そのほかのシステムテーマについては、システムテーマで統一感を出すの記事で確認できます。
ActionBarにメニューを表示する
ActionBarにメニューを表示するのに特別な方法は必要ありません。いままでどおり、MenuItemを使用してメニューを追加します。(使い勝手が変わらない理由は、MenuItemクラスがActionBarにあわせて拡張されているためです。)
メニュー表示を確認する
メニューアイコンを長押しすることでMenuItemクラスのaddメソッドで設定した説明文が表示されます(サンプルの「?」アイコンでは「Action Button Help Icon」という文言を表示)。
もし、ActionBarに入りきらない複数のメニューがあった場合、Menuキーを押下したとき初めて表示されます。
メニューが1つだけの合 [?]メニューは画面上部に表示 |
複数メニューがある場合 他のメニューは画面下部に表示 |
アクションバーにメニューを表示する方法をサンプルコードで確認してみましょう。
■src/SpritActionBarActivity.java
public class SpritActionBarActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { 省略 } ...(省略)... @Override public boolean onCreateOptionsMenu(Menu menu) { // メニューの要素を追加して取得 MenuItem actionItem = menu.add("Action Button Help Icon"); // アイコンを設定 actionItem.setIcon(android.R.drawable.ic_menu_help); // SHOW_AS_ACTION_ALWAYS:常に表示 actionItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { Toast.makeText(this, "Selected Item: " + item.getTitle(), Toast.LENGTH_SHORT).show(); return true; } }
11行目:setShowAsActionメソッドでアクションバーに常に表示する設定を行っています。これで「?」アイコンはアクションバーに優先的に表示されます。
setShowAsActionメソッドには”SHOW_AS_ACTION_ALWAYS”定数値以外に、ActionBarにMenuを表示するで紹介されているような定数があります。
最もよく使うのは以下の2つです。
- MenuItem.SHOW_AS_ACTION_ALWAYS: 常にメニューを表示します
- MenuItem.SHOW_AS_ACTION_IF_ROOM:空きがあればメニューを表示します
また、スマートフォン端末では画面上部に表示するメニューは2つ程度が推奨されています(表示領域の狭さに起因しています)。
ActionBarを拡張するSplitActionBar
Android 4.0からタブレット/スマートフォンのUIが統合され、使い勝手などはAndroid 3.0(Honeycomb)に合わせられました。スマートフォンでは表示領域に限りがあるため、Android4.0では、ActionBarに改善が施されています。
上下にアクションバーを分割して表示するSplitActionBarを使えば、メニューが多くてもわかりやすい画面構成が可能です。
SplitActionBarを使うためのサンプルコードは以下の通りです。
■AndroidManifest.xml
<activity android:label="@string/app_name" android:name=".SpritActionBarActivity" android:uiOptions="splitActionBarWhenNarrow"> <intent-filter > <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>
4行目:uiOptions要素にsplitActionBarWhenNarrowを設定します。
(ActivityのonCreateOptionsMenuメソッド内でMenu項目を追加するコードは省略しています。より詳しい解説はアクションバーを上下に表示するをご確認ください。
Tabインターフェイスの利用
ActionBarでは、タブを表示する方法も用意されています。タブを使えば直感的な画面移動が可能です。Android 3.xでは、ActionBarの右側の空き領域にタブが統合されていましたが、Android 4.0ではActionBarの直下に表示されます。
タブを有効にする方法は、ActionBarクラスのsetNavigationModeメソッドでナビゲーションモードを変更(ActionBar.NAVIGATION_MODE_TABSに)します。詳しくはスマートフォン端末で、アクションバーにタブを表示するをご確認ください。
Android4.0では、システム設定画面などでもタブ表示は使われているほか、Google+などGoogle謹製アプリで積極的に利用されています。
以上、お疲れ様でした。
ActionBarに関連する記事は以下のリンクからどうぞ。
About The Author
ひつじ(mhidaka)
Software Engineerだよ。DroidKaigi Organizer / Androidと組込とRe:VIEW。techbooster主宰。mhidaka's writings http://booklog.jp/users/mhidaka 技術書典! http://techbookfest.org