應工作需要在app加入menu功能, 本範例參考自google sample, 網路上third party就不再這邊解說了, 因為我們希望在任何硬體都能穩定呈現, 所以就保守採用google的做法(其實是怕死)XD


app在製作menu時, 考量到pad與phone這兩種硬體種類, UI部分大多分為兩種呈現方式, 一是在整個畫面中切一區塊來放menu, 二是使用滑動的方式來呈現.

• 方法一:根據UI操作流程(習慣), 通常這種方式會在畫面的上方(或左邊)切一區塊來放menu, 相對的這就會壓縮到畫面上放的東西.
• 方法二:有了方法1的缺點後, 我們嘗試將menu放在畫面之外, 並以特效的方式, 將menu移動進畫面中.

此次我們將google sample中一些不要的功能拿掉, 單純只看menu的展開收合功能, 以下為MainActivity.java和activity_main.xml整理後的內容以及執行結果的畫面.
package com.example.android.navigationdrawerexample; import android.app.Activity; import android.os.Bundle; import android.support.v4.app.ActionBarDrawerToggle; import android.support.v4.widget.DrawerLayout; import android.util.Log; import android.view.Menu; import android.view.MenuItem; import android.view.View; public class MainActivity extends Activity { private DrawerLayout mDrawerLayout; private ActionBarDrawerToggle mDrawerToggle; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); getActionBar().setDisplayHomeAsUpEnabled(true); getActionBar().setHomeButtonEnabled(true); mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_drawer, R.string.drawer_open, R.string.drawer_close) { public void onDrawerClosed(View view) { invalidateOptionsMenu(); Log.i("Operational processes", "onDrawerClosed()"); } public void onDrawerOpened(View drawerView) { invalidateOptionsMenu(); Log.i("Operational processes", "onDrawerOpened()"); } }; mDrawerLayout.setDrawerListener(mDrawerToggle); } @Override public boolean onCreateOptionsMenu(Menu menu) { Log.i("Operational processes", "onCreateOptionsMenu()"); getMenuInflater().inflate(R.menu.main, menu); return super.onCreateOptionsMenu(menu); } @Override public boolean onOptionsItemSelected(MenuItem item) { Log.i("Operational processes", "onOptionsItemSelected()"); if (mDrawerToggle.onOptionsItemSelected(item)) { return true; } else { return super.onOptionsItemSelected(item); } } @Override protected void onPostCreate(Bundle savedInstanceState) { Log.i("Operational processes", "onPostCreate()"); super.onPostCreate(savedInstanceState); mDrawerToggle.syncState(); } } <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:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="start" android:background="#789" android:orientation="vertical" > </LinearLayout> </android.support.v4.widget.DrawerLayout>

---