スマートフォン端末で、アクションバーにタブを表示する

Android3.0から導入されたアクションバーには、タブを表示することができました。
本エントリでは、画面の小さな端末で、アクションバーにタブを表示する方法を紹介します。

＃Android3.0でのタブの使用方法は以下の記事をご覧になってください。
ActionBarのタブを使用する

画面の小さな端末では、以下のスクリーンショット２つのActionBarのタブの使い方があります。

本エントリで紹介するメソッドは以下の３つです。

ActionBarクラスのメソッド	概要
setNavigationMode()	Navigationのモードを選択する。タブ表示を行う場合は、NAVIGATION_MODE_TABS
setDisplayShowHomeEnabled()	ActionBarのアイコン表示を設定する
setDisplayOptions()	ActionBar持つ、DISPLAY_SHOW_TITLEなどの設定フラグを変更する

それでは、つづきをどうぞ。

タブ表示を行う

ActionBarにタブ表示を行う為に必要なことは、以下の２つです。
・ActionBarクラスのaddTabメソッドを呼び出す。
・ActionBarのNavigarionModeをNAVIGATION_MODE_TABSに切り替える。

以下サンプルコード、9〜11行目でActionBarクラスのaddTabメソッドを呼び出し、タブを追加しています。
続いて、15行目でNavigationModeをNAVIGATION_MODE_TABSに切り替えています。

    public void onCreate(Bundle savedInstanceState) {
        //省略...

        // action bar を取得する
        final ActionBar mActionBar = getActionBar();

        // ActionBarにタブを表示する
        // このままでは表示されない
        mActionBar.addTab(mActionBar.newTab().setText("Tab 1").setTabListener(this));
        mActionBar.addTab(mActionBar.newTab().setText("Tab 2").setTabListener(this));
        mActionBar.addTab(mActionBar.newTab().setText("Tab 3").setTabListener(this));

        // ActionBarのNavigationModeを設定する
//        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);
        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
//        mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);

これで、以下のスクリーンショットの様に、ActionBarの二段目にタブが表示できます。

タイトルのActionBarを消す

スマートフォン端末はタブレット端末とは違い、画面の表示領域は決して大きくありません。
ActionBarにタブを表示し、さらにSplit Action Barで下部にMENUを表示している場合、ActionBarのみで
画面の大半を使用してしまうことになります。

そのような時には、タイトルを表示するActionBarを消して画面の表示領域を有効活用することができます。
タイトルを表示するActionBarを消す為に必要なことは、以下の２つです。
・ActionBarクラスのsetDisplayShowHomeEnabledメソッドでアイコンを表示しないようにする。
・ActionBarクラスのsetDisplayOptionsメソッドでタイトル名を表示しないようにする。

ActionBarクラスのsetDisplayShowHomeEnabledメソッドはアイコンの表示/非表示を指定するメソッドですが、
スマートフォン端末の場合、以下のスクリーンショットの様な効果があります。

setDisplayShowHomeEnabled(true)のとき

setDisplayShowHomeEnabled(false)のとき

二枚のスクリーンショットの様に、アイコンを非表示状態にすると、ActionBarのタブが上部に繰り上がります。
この状態で、ActionBarクラスのsetDisplayOptionsメソッドを利用し、タイトル名を非表示にすることで、
ActionBarのタブのみを表示することができます。

サンプルコードは以下のとおり。

        // 上部のサンプルコードの続き

        // アイコンを表示しない
        mActionBar.setDisplayShowHomeEnabled(false);
        // SHOW_TITLEのフラグを消すことで、タイトル表示を消す
        mActionBar.setDisplayOptions(0, ActionBar.DISPLAY_SHOW_TITLE);

これで、以下のスクリーンショットのように、ActionBarのタブのみを上部に表示することができました。