由於移動裝置的螢幕限制，在主介面同時顯示很多東西是不大顯示的事，因而很多時候我們都會把一些功能選項放在選單。但傳統的選單介面比較單調，而且互動體驗並不是很好，因此，側滑選單也因此應運而生。

實現側滑選單的方式有很多種，包括自定義控制元件，使用開源庫SlideMenu等，但Google在MaterialUI中推出使用DrawableLayout實現側滑選單的功能。

既然市面上已經有了不少側滑選單的實現方式，那DrawableLayout又有什麼優勢呢？筆者在使用的時候覺得有以下幾點值得我們去使用DrawableLayout。

1、介面美觀。這也是很多人覺得MaterialUI推出後Android介面並不比IOS差的原因了。

2、使用簡單。相比自定義一個側滑選單的成本低很多。

那下面我們就來看一下怎麼使用DrawableLayout

1、佈局。在介面中放入兩個子的佈局，第一個子佈局是主介面，第一個子佈局是左側滑選單，當然我們也可以在右邊也放一個側滑選單，不過目前市面上似乎沒見過有左右側滑選單的APP，這個視實際情況決定。下面是activity_main.xml的程式碼

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout     
    xmlns:android="http://schemas.android.com/apk/res/android"
 

    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
 
            android:id="@+id/activity_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <include layout="@layout/title_bar" />

            <FrameLayout
                android:id="@+id/fl_main"
                android:layout_width="match_parent"
                android:layout_height="match_parent"> 
            </FrameLayout>
        </LinearLayout>
    </FrameLayout>

    <ListView
        android:id="@+id/list_view_menu"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#ffffff"
        android:divider="#ffffff"></ListView>


</android.support.v4.widget.DrawerLayout>

以上是筆者使用DrawableLayout實現的一個仿知乎日報側滑選單的主介面。從程式碼可以清楚的看到最外層佈局使用的是DrawableLayout，然後多了xmlns:app=”http://schemas.android.com/apk/res-auto”這麼一行程式碼，關於名稱空間的這裡不去講解，有興趣的讀者可以自行搜尋，只有加了這一行程式碼後我們才可以使用MaterialUI的新屬性。然後就是第二個子佈局筆者使用了一個ListView控制元件，當然也可以使用其他控制元件。細心的讀者可能會發現多了這麼一行程式碼android:layout_gravity=”start”。這個屬性是必須制定的，如果去掉，第二個子控制元件就會覆蓋在第一個控制元件上了。這樣子就完成了側滑選單就完成了。

細心的讀者肯恩貴發現，QQ點選左側頭像的時候也可以調出側滑選單，下面我們就在Java中實現這一功能。

public class MainActivity extends AppCompatActivity {

    private DrawerLayout drawerLayout;
    private ImageButton menu_title_bar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        menu_title_bar = (ImageButton)findViewById(R.id.menu_title_bar);
        menu_title_bar.setOnClickListener(new MyOnClickListener());
    }
    class MyOnClickListener implements View.OnClickListener{

        @Override
        public void onClick(View v) {
            switch (v.getId()) {
                case  R.id.menu_title_bar:
                  drawer_layout.openDrawer(GravityCompat.START);
                    break;
            }
        }
    }
}

這裡為了簡潔，筆者把其他程式碼刪去了，只留下呼叫側滑選單的方法。這關鍵的就是這一句

drawer_layout.openDrawer(GravityCompat.START);

傳進去的引數要跟在佈局檔案中定義的一致。

以下是筆者根據知乎日報API做的一個介面效果圖。