Gmailやpocketやアンサーなどで採用されている、
横からスライドして表示されるメニュー（NavigationDrawer）の
基本的な実装方法です。
NavigationDrawerは、Androidのサポートパッケージに含まれている
DrawerLayoutを使って実現します。
xmlファイル
まず、NavigationDrawerは、Layoutのxmlファイルで導入します。
その際に以下のようにいくつか注意点があります。
- DrawerLayoutはルートビュー（一番外）にする。
- コンテンツ部分のlayout_heightとlayout_widthはmatch_parentにする。
- ドロワー部分のlayout_heightはmatch_parent、layout_widthは240dp以上320dp以内にする。
- ドロワー部分のlayout_gravityにleft（start）またはrightを指定する。
activity_main.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- コンテンツ部分 -->
<LinearLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" />
</LinearLayout>
<!-- ドロワー部分 -->
<LinearLayout
android:id="@+id/drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="left" >
<!-- ここではFragmentをセットするためのLayoutをいれてみる -->
<LinearLayout
android:id="@+id/fragmentMenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical" />
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
ActionBarDrawerToggleの実装
実装は、ActionBarDrawerToggleを使えばラクチンです。
表示設定やコールバックなどを簡単に実装することができます。
MainActivity.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// ホームアイコン横のHomeAsUpアイコンを有効に。HomeAsUpアイコンは後述のドロワートグルで上書き。
getActionBar().setDisplayHomeAsUpEnabled(true);
//ナビゲーションドロワーの設定
mDrawer = (DrawerLayout) findViewById(R.id.drawer_layout);
//第三引数でHomeAsUpアイコンを指定。
//第四・第五引数は、String.xmlで適当な文字列を。
mDrawerToggle = new ActionBarDrawerToggle(this, mDrawer,
R.drawable.ic_navigation_drawer, R.string.open,
R.string.close) {
//閉じた時に呼ばれる
@Override
public void onDrawerClosed(View drawerView) {
}
//開いた時に呼ばれる
@Override
public void onDrawerOpened(View drawerView) {
}
//アニメーションの処理。Overrideする場合はスーパークラスの同メソッドを呼ぶ。
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
}
//状態が変化した時に呼ばれる。
// 表示/閉じ済み -> 0
// ドラッグ中 -> 1
// ドラッグを開放た後のアニメーション中 ->2
@Override
public void onDrawerStateChanged(int newState) {
}
};
mDrawer.setDrawerListener(mDrawerToggle);
//ここではドロワーにMenuFragmentをセットしてみる
menuFragment = new MenuFragment();
getSupportFragmentManager().beginTransaction().add(R.id.fragmentMenu, menuFragment).commit();
}
その他に必要な処理の実装
ActionBarDrawerToggleを使う場合は、
Activity/ActionBarのいくつかのメソッドをオーバーライドし、
ActionBarDrawerToggleに状態変化等を伝える必要があります。
MainActivity.java
@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
mDrawerToggle.syncState();
}
@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
mDrawerToggle.onConfigurationChanged(newConfig);
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// ActionBarDrawerToggleにドロワーメニューを渡す。コレが無いと開閉しない。
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
おまけ
ドロワーのメニューアイコンはここからダウンロードできます。
「アプリに合わせて色を変えたい！」といった場合はここで。
各dpiのpngファイルを生成することができます。