Android Navigation Drawer,自訂ActionBar(標題置中)

標籤：

整個樣本都是改造自 Google Android Training 中的 NavigationDrawer 樣本(http://developer.android.com/training/implementing-navigation/nav- drawer.html)

因為我需要使用自訂的 ActionBar，而ActionBarDrawerToggle 只能通過 ActionBar 中的 Action Menu 進行觸發，且需要提供一個indicator圖片，而不支援自訂按鈕的觸發（如下代碼）：

public boolean onOptionsItemSelected(MenuItem item) {     if (item != null && item.getItemId() == ID_HOME && mDrawerIndicatorEnabled) {         if (mDrawerLayout.isDrawerVisible(GravityCompat.START)) {             mDrawerLayout.closeDrawer(GravityCompat.START);         } else {             mDrawerLayout.openDrawer(GravityCompat.START);         }         return true;     }     return false; }

因此考慮參考 ActionBarDrawerToggle 重寫自己的 MabDrawerToggle，然後去掉 onOptionsItemSelected 方式來觸發 drawer，新增了一個 switchDrawer 方法，如下：

public void switchDrawer() {     if (mDrawerLayout.isDrawerVisible(GravityCompat.START))     {         mDrawerLayout.closeDrawer(GravityCompat.START);     }     else    {         mDrawerLayout.openDrawer(GravityCompat.START);     } }

下面看一下 ActionBar 自訂 View 中標題置中的問題，折騰了好久，最後採用 FrameLayout 方式解決的，如下 action_bar_title.xml：

<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:layout_width="fill_parent"              android:layout_height="wrap_content">     <TextView            android:id="@android:id/title"            android:layout_height="match_parent"            android:layout_width="match_parent"            android:gravity="center"            android:text="hello"            android:textColor="@android:color/holo_red_light"/>     <ImageButton            android:id="@+id/left_btn"            android:layout_height="wrap_content"            android:layout_width="wrap_content"            android:layout_gravity="left|center_vertical"            android:layout_marginLeft="12.0dip"            android:src="@android:drawable/ic_media_play"/>     <ImageButton            android:id="@+id/right_btn"            android:layout_height="wrap_content"            android:layout_width="wrap_content"            android:layout_gravity="right|center_vertical"            android:layout_marginRight="12.0dip"            android:src="@android:drawable/ic_media_pause"/> </FrameLayout>

在 onCreate 中實現如下：

protected void onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     setContentView(R.layout.activity_main);     mTitle = getTitle();     mPlanetTitles = getResources().getStringArray(R.array.planets_array);     mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);     mDrawerList = (ListView) findViewById(R.id.left_drawer);     // set a custom shadow that overlays the main content when the drawer opens www.it165.net     mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);     mDrawerList.setAdapter(new ArrayAdapter<String>(this,             R.layout.drawer_list_item, mPlanetTitles));     mDrawerList.setOnItemClickListener(new DrawerItemClickListener());     ActionBar.LayoutParams lp = new ActionBar.LayoutParams(             ActionBar.LayoutParams.MATCH_PARENT,             ActionBar.LayoutParams.MATCH_PARENT,             Gravity.CENTER);     View viewTitleBar = getLayoutInflater().inflate(R.layout.action_bar_title, null);     getActionBar().setCustomView(viewTitleBar, lp);     getActionBar().setDisplayShowHomeEnabled(false);     getActionBar().setDisplayShowTitleEnabled(false);     getActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);     getActionBar().setDisplayShowCustomEnabled(true);     tvTitle = (TextView) getActionBar().getCustomView().findViewById(android.R.id.title);     ImageButton ibtnNav = (ImageButton) getActionBar().getCustomView().findViewById(R.id.left_btn);     ibtnNav.setOnClickListener(new View.OnClickListener() {         @Override        public void onClick(View v) {             mDrawerToggle.switchDrawer();         }     });     // MabDrawerToggle ties together the the proper interactions     // between the sliding drawer and the action bar app icon     mDrawerToggle = new MabDrawerToggle(             this,                  /* host Activity */             mDrawerLayout,         /* DrawerLayout object */             R.drawable.ic_drawer,  /* nav drawer image to replace ‘Up‘ caret */             R.string.drawer_open,  /* "open drawer" description for accessibility */             R.string.drawer_close  /* "close drawer" description for accessibility */            );     mDrawerLayout.setDrawerListener(mDrawerToggle);     if (savedInstanceState == null)     {         selectItem(0);     } }

下面為兩張運行：

選擇 Navigation 列表中的項後，切換 Fragment 以及 標題：

 

Android Navigation Drawer,自訂ActionBar(標題置中)