Android 側邊滑動選單效果 (Side Menu Drawer)
幾周前在 GTUG Taipei 活動,聽了 David Wu 分享的 "A Deep Dive into Android Open Source Project" 演講,回來後對 Slide Menu 效果很感興趣,也在gPaper 改版時使用到這個技巧。
後來我選擇使用的是 Simple Side Drawer 這個 Library https://github.com/adamrocker/simple-side-drawer
Simple Side Drawer 的好處是只要把它提供的 jar 檔放到專案中,就可以搭配如ActionBarSherlock等函式庫一起使用。
使用 Simple Side Drawer
使用時首先是下載 jar 檔放進專案的 lib 目錄中並匯入。
接著需要在 onCreate 中初始化:
> protected void onCreate (Bundle data) {
> ....
>
> mSlidingMenu = new SimpleSideDrawer(this);
> mSlidingMenu.setBehindContentView(R.layout.behind_menu);`</pre><pre>` `</pre><pre>`}`</pre><pre>`之後在程式裡的任何地方,都可以透過呼叫:`</pre><pre>` `</pre>> <pre>`<code>mSlidingMenu.toggleDrawer();` </code></pre><pre>`
來控制側邊欄的開關。下面以常見的點選 App 圖示來控制側邊滑動選單做例子,來介紹側邊滑動選單可以如何整合到 App 中。
透過點選App圖示控制側邊滑動選單
將 Side Menu Drawer 設定好之後,並不會有按了 App 圖示就開啟側邊選單的效果,需要一些程式碼來控制。
在程式中的 onCreate 或 onResume 裡加入控制碼,強制顯示 App 圖示旁的小箭頭,作為側邊滑動選單的視覺參照,讓使用者注意到 App 圖示點選了還有功能:
ActionBar actionBar = this.getSupportActionBar(); actionBar.setDisplayHomeAsUpEnabled(true);
在 onOptionsItemSelected 的判斷裡,加入點選 App 圖示時的動作:
case android.R.id.home: mSlidingMenu.toggleDrawer(); return true;
這樣點選 App 圖示後,就會出現開關側邊滑動選單的效果。