今までのメニュー表示からActionBarを利用したメニュー表示に変更

前回のエントリーでAction Barを使ってみようということで軽く調べてから、Androidマーケットにアップしている「シンプル電卓」を改良して、ついでにバージョンアップのテストもやってみようかという企画(？)です。

一般的なMenuの作り方は

private static final int MENU1_ID = Menu.FIRST;
private static final int MENU2_ID = Menu.FIRST + 1;
pivate static final int MENU3_ID = Menu.FIRST + 2;

というような感じで、Menu用のIDを作って、

@Override
public boolean onCreateOptionsMenu(Menu menu) {
 boolean result = super.onCreateOptionsMenu(menu);
 // メニューアイテムを追加する
 menu.add(0, MENU1_ID, Menu.NONE, R.string.menu1Label).setIcon(R.drawable.ic_menu_close_clear_cancel);
 menu.add(0, MENU2_ID, Menu.NONE, R.string.menu2Label).setIcon(R.drawable.ic_menu_info_details);
 menu.add(0, MENU3_ID, Menu.NONE, R.string.label_about).setIcon(R.drawable.ic_menu_notifications);
 return result;
}

と、onCreateOptionsMenu()でMenuボタンを押した時に表示されるメニューを作成し、

@Override
public boolean onOptionsItemSelected(MenuItem item) {
 switch( item.getItemId() ) {
  case MENU1_ID:
   finish();
   break;
  case MENU2_ID:
   showHelp();
   break;
  case MENU3_ID:
   showCredit();
   break;
 }
 return super.onOptionsItemSelected(item);
}

てな感じで、onOptionsItemSelected()でメニューが選択された時の動作を決定するわけです。

これを、Action Barを使用した作りにします。
まずは、作成しているアプリのmin SDK VersionとTarget SDK Versionを決定します。
Action Barが使えるようになったのはAndroid 3.0(Level 11)からなので、Target SDK Versionは11以上に設定しましょう。min SDK Versionは自分のアプリの最低条件をつけてやりましょう(私の場合はAndroid 1.6なので4です。)。

次に「project.properties」にあるTarget SDKにも先ほど設定したTarget SDK Versionと同じ数字を「Android-xx」の「xx」につけましょう。そして、eclipse再起動。私の場合、eclipse再起動で後ほど設定するshow As Actionが有効になってくれました。

下準備が整いましたので続いて、menu用のリソースを/res/menuの下に作ります(resの下のmenuフォルダはresを右クリックして[新規]-[フォルダー]です(eclipseの場合))。
「Android XML File」を新規作成し、Resource Typeに「Menu」を設定、ファイル名を入力して(ここでは menu_main)完了。
こんな感じの画面になります(Itemなどすでに追加済みですが…)

res/menuのxml編集画面

 xmlを直接記述でもいいですが、ここはGUIで操作をしましょう。
はじめは Menu Elements には何もありませんので、Add ボタンをクリックして、「Group」か「Item」を選択してOKを押します。
すると、Menu Elements に一つデータが追加されました。
後はそのアイテムのIDやTitle、Iconを設定します。
次に、ようやくここで show As Action の設定です。
show As Actionの右側の Select ボタンを押すと

• never　…　Action Barには表示されない
• ifRoom　…　Action Barにスペースがあれば表示する
• always　…　必ずAction Barに表示する
• withText　…　Action BarにIconと共にテキストを表示する(Land Scape時のみ？)
• collapseActionView　…　action viewを関連付けることで折り畳めるメニューを表示(Level 14から)

の選択肢が表示されます。
collapseActionViewですが、エミュレータで確認した限りでは、WVGA800では通常のMenuと同様にポップアップ表示、WXGA720ではひとまとめになって表示されました。

collapseActionView

なので、「ある程度の解像度から」と書きました。が、間違っていればご指摘をお願いいたします(他に設定すればWVGA800でもひとまとめ表示になるよ、など)。
※訂正：Nagoya0さんからのコメントにありますとおり、collapseActionViewを指定したために通常表示やまとまった表示になっていたのではなく、action viewを指定していないためにデフォルトの動作になっていただけのようです。
collapseActionViewを使用する場合はandroid.widget.SearchViewのようなaction viewと関連付けて使用することで伸縮するメニューを利用することができるようです。

SearchView を使った例。上が閉じた状態、下が展開した状態

と、とりあえず、今回はここまで。次回は続きとAndroidアプリのバージョンアップについて書きたいと思います。

次回：Action Bar実装編