Google I/O 2015為Android開發(fā)者帶來了一個全新的開發(fā)函數(shù)庫，本系列文章將會對這個材料設計兼容函數(shù)庫進行較為詳細的介紹。
雖然Chris Banes已經(jīng)在Github上開源了一個很好的使用示例，我還是想進一步講解每個新特性，并通過移植MaterializeYourApp這個Github工程進行實例講解。
導航視圖
本文開始講解導航視圖，自從材料設計（Material Design）發(fā)布后，我們知道如何設計一個符合標準的導航抽屜：
在開發(fā)中遵循這些設計準則相當費時，不過現(xiàn)在有了導航視圖，實現(xiàn)起來就簡單多了。
導航視圖的工作原理
使用導航視圖替換之前抽屜布局（DrawerLayout）中的自定義視圖
，導航視圖需要傳入一組參數(shù)，一個可選的頭部布局，以及一個用于構建導航選項的菜單。完成上面這些步驟之后，就只需要給導航選項添加響應事件的監(jiān)聽器就可以了。
實現(xiàn)
首先我們來創(chuàng)建菜單，直截了當，你只需要創(chuàng)建一個group并指定同一時間只有一個item可以被選中：
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group
android:checkableBehavior="single">
<item
android:id="@+id/drawer_home"
android:checked="true"
android:icon="@drawable/ic_home_black_24dp"
android:title="@string/home"/>
<item
android:id="@+id/drawer_favourite"
android:icon="@drawable/ic_favorite_black_24dp"
android:title="@string/favourite"/>
...
<item
android:id="@+id/drawer_settings"
android:icon="@drawable/ic_settings_black_24dp"
android:title="@string/settings"/>
</group>
</menu>
理論上，通過使用一個子菜單作為item，你也可以添加包含頭部的菜單項，如下所示：
<item
android:id="@+id/section"
android:title="@string/section_title">
<menu>
<item
android:id="@+id/drawer_favourite"
android:icon="@drawable/ic_favorite_black_24dp"
android:title="@string/favourite"/>
<item
android:id="@+id/drawer_downloaded"
android:icon="@drawable/ic_file_download_black_24dp"
android:title="@string/downloaded"/>
</menu>
</item>
這將會創(chuàng)建一個分割線和一個頭部，緊跟著一個item。然而，這些子菜單里面的item似乎不能被選中。如果找到解決方案了我會更新這一點，你應該自己親自試驗一下。
接著我們可以給activity布局添加導航視圖，同時設置菜單選項和頭部布局。這里我不會詳細介紹頭部，因為它可以是任何你想要的布局，Github上面有一個例子可以參考一下。
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="@+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>
最后就是添加Java代碼，首先我們需要給左上角圖標的左邊加上一個返回的圖標：
final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
actionBar.setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp);
actionBar.setDisplayHomeAsUpEnabled(true);
}
接著初始化導航抽屜，當導航選項被選中時，將會顯示一個snackbar（后續(xù)的文章會進行介紹），并置選中的菜單項為選中態(tài)，同時關閉抽屜：
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
NavigationView view = (NavigationView) findViewById(R.id.navigation_view);
view.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override public boolean onNavigationItemSelected(MenuItem menuItem) {
Snackbar.make(content, menuItem.getTitle() + " pressed", Snackbar.LENGTH_LONG).show();
menuItem.setChecked(true);
drawerLayout.closeDrawers();
return true;
}
});
最后，當菜單按鈕被點擊時，打開抽屜：
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
drawerLayout.openDrawer(GravityCompat.START);
return true;
}
return super.onOptionsItemSelected(item);
}
總結
由于引入了材料設計兼容函數(shù)庫和導航視圖（Navigation View），現(xiàn)在要創(chuàng)建一個符合材料設計標準的導航抽屜是輕而易舉的事兒。下一篇文章將會介紹有助于簡化用戶界面創(chuàng)建的另外一些新組件?，F(xiàn)在你可以進入到下一篇文章Floating Action Button的學習了，不要忘了我們的代碼都在示例工程中。
歡迎關注我的微信公眾號
