Android 3.x(Honeycomb)から追加された新UI、ActionBar(アクションバー)はAndroid 4.0.x(ICS:IceCreamSandwich)でも重要なユーザインターフェイスです。
今回はAndroid 4.0(スマートフォン版)に焦点を当てて、ActionBarの使い方を解説します。Android4.0 SDKからアプリケーションのデフォルトテーマが変わっており、ActionBarを標準で利用できます。
今回はAndroid 4.0(スマートフォン版)に焦点を当てて、ActionBarの使い方を解説します。Android4.0 SDKからアプリケーションのデフォルトテーマが変わっており、ActionBarを標準で利用できます。
ActionBarの有無によるメニュー表示の違い
以下は「?」アイコンをもったヘルプメニューの表示を例に、ActionBarを使った場合、使わなかった場合のスクリーンショットです。UIの印象がずいぶん違うことが見て取れます。複数メニューを表示する場合はSplitActionBarが便利です。
旧メニューデザイン [?]メニューは画面下に表示 | ActionBarを利用 [?]メニューは画面上部に表示 | SplitActionBarを利用 メニューは画面下部 |
詳細な使い方については続きから。
もしActionBarを利用したくないなら
Android4.0以降でActionBarを利用しない場合、テーマを変更すると手軽です。
■AndroidManifest.xml
■AndroidManifest.xml
1
2
3
4
5
6
7
8
9
10
| < 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キーを押下したとき初めて表示されます。
もし、ActionBarに入りきらない複数のメニューがあった場合、Menuキーを押下したとき初めて表示されます。
メニューが1つだけの合 [?]メニューは画面上部に表示 | 複数メニューがある場合 他のメニューは画面下部に表示 |
アクションバーにメニューを表示する方法をサンプルコードで確認してみましょう。
■src/SpritActionBarActivity.java
■src/SpritActionBarActivity.java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| 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つです。
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を使えば、メニューが多くてもわかりやすい画面構成が可能です。
SplitActionBarを使うためのサンプルコードは以下の通りです。
■AndroidManifest.xml
■AndroidManifest.xml
1
2
3
4
5
6
7
8
9
10
| < 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項目を追加するコードは省略しています。より詳しい解説はアクションバーを上下に表示するをご確認ください。
(ActivityのonCreateOptionsMenuメソッド内でMenu項目を追加するコードは省略しています。より詳しい解説はアクションバーを上下に表示するをご確認ください。
Tabインターフェイスの利用
ActionBarでは、タブを表示する方法も用意されています。タブを使えば直感的な画面移動が可能です。Android 3.xでは、ActionBarの右側の空き領域にタブが統合されていましたが、Android 4.0ではActionBarの直下に表示されます。
タブを有効にする方法は、ActionBarクラスのsetNavigationModeメソッドでナビゲーションモードを変更(ActionBar.NAVIGATION_MODE_TABSに)します。詳しくはスマートフォン端末で、アクションバーにタブを表示するをご確認ください。
Android4.0では、システム設定画面などでもタブ表示は使われているほか、Google+などGoogle謹製アプリで積極的に利用されています。
タブを有効にする方法は、ActionBarクラスのsetNavigationModeメソッドでナビゲーションモードを変更(ActionBar.NAVIGATION_MODE_TABSに)します。詳しくはスマートフォン端末で、アクションバーにタブを表示するをご確認ください。
Android4.0では、システム設定画面などでもタブ表示は使われているほか、Google+などGoogle謹製アプリで積極的に利用されています。
0 件のコメント:
コメントを投稿