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 以及 标题:

技术分享

 

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。