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

时间: 2024-10-06 21:53:36

Android Navigation Drawer,自定义ActionBar(标题居中)的相关文章

Android Navigation Drawer(导航抽屉)

Google I/O 2013 Android 更新了Support库,新版本的Support库中新加入了几个比较重要的功能. 添加 DrawerLayout 控件,支持创建  Navigation Drawer模式.可以设置从左边划出菜单或者右边,也可以左右菜单同时存在. 添加 SlidingPaneLayout 控件来支持各种屏幕上的摘要.详情界面模式.比如 Gmail邮件列表和单个邮件详情界面.当在手机上显示的时候,邮件列表和详情界面分别为两个界面:当在平板上显示的时候,则为一个界面. 添

自定义ActionBar标题与菜单中的文字样式

自定义标题文字样式 标题样式是ActionBar样式的一部分,所以要先定义ActionBar的样式 <style name="AppTheme" parent="AppBaseTheme"> <item name="android:actionBarStyle">@style/CustomActionBar</item> </style> 然后在ActionBar的样式中通过android:titl

android nagative drawer图标跟标题适配

<?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">xxx</string> <string name="navigation_drawer_open">Open navigation drawer</string> <string name="

自定义 ActionBar 标题与菜单中的文字样式

自定义标题文字样式 标题样式是 ActionBar 样式的一部分,所以要先定义 ActionBar 的样式 <style name="AppTheme" parent="AppBaseTheme"> <item name="android:actionBarStyle">@style/CustomActionBar</item> </style> 然后在 ActionBar 的样式中通过 andro

Android - Navigation Drawer

http://www.jianshu.com/p/c8cbeb7ea43a 用Navigation Drawer 和 Navigation View 来实现左右侧滑 Activity里甚至什么都不用写 NavigationDrawer 简介 NavigationDrawer 是 Google 在 Material Design 中推出的一种侧滑导航栏设计风格.说起来可能很抽象,我们直接来看看 网易云音乐 的侧滑导航栏效果 Google 为了支持这样的导航效果,推出一个新控件 -- DrawerL

Android官方终于支持 Navigation Drawer(导航抽屉)模式

在2013 google IO当天,Android团的更新了Support库,新版本(V13)的Support库中新加入了几个比较重要的功能. 添加 DrawerLayout 控件,支持创建  Navigation Drawer模式.可以设置从左边划出菜单或者右边,也可以左右菜单同时存在.    添加 SlidingPaneLayout 控件来支持各种屏幕上的摘要.详情界面模式.比如 Gmail邮件列表和单个邮件详情界面.当在手机上显示的时候,邮件列表和详情界面分别为两个界面:当在平板上显示的时

Android 自定义ActionBar

Android 3.0及以上已经有了ActionBar的API,可以通过引入support package在3.0以下的平台引用这些API,但这儿呢,完全自定义一个ActionBar,不用引入额外jar包,参照的是开源的UI组件 GreeenDroid,项目主页:https://github.com/cyrilmottier/GreenDroid .提取出关于ActionBar的相关文件,你可以放在自己的项目中,最后会附下载地址.下面说下在程序中的用法. 新建一个TestActionBar项目,

【Android 应用开发】 ActionBar 样式详解 -- 样式 主题 简介 Actionbar 的 icon logo 标题 菜单样式修改

作者 : 万境绝尘 ([email protected]) 转载请著名出处 : http://blog.csdn.net/shulianghan/article/details/39269163 示例代码下载 : -- GitHub : https://github.com/han1202012/Octopus_ActionBarStyle.git -- CSDN : http://download.csdn.net/detail/han1202012/7926959 一. 样式 和 主题 资源

ANDROID – TOOLBAR 上的 NAVIGATION DRAWER(转)

在 Material Design 釋出後,Google 也開始陸續更新了 Google app 的介面,讓大家有個範例可以看.而過去大力推動的 actionbar 自然而然也成了眾開發者觀注的部份:其中的 up button 的設定在前一篇所介紹的 Toolbar 也已看到.這邊還未提到的一個部份是 material design 中有提到的人機互動效果,簡言之,就是讓使用者明顯地感受到在操作 app 時,可以獲得明顯的回應,從而得到豐富地操作體驗感:因此,在剛開始釋出的幾支 Google a