ActionBar介绍

        本文简单的介绍一下ActionBar。如有错误之处请多指教。

一、概述

       Action Bar是Android 3.0之后引入的新的对象,它通常位于应用程序的顶部,是一个用来定义用户区域的Windows特性,系统能够很好根据不同的屏幕配置来适应Action Bar的外观。ActionBar是我们可以为activity实现的最重要的设计元素之一。其提供了多种 UI 特性,可以让我们的 app 与其他 Android app 保持较高的一致性,从而为用户所熟悉。

    其核心的功能包括:

  • 一个专门的空间用来显示你的app的标识(Logo),以及指出目前所处在app的哪个页面。

  • 以一种可预见的方式访问重要的操作(比如搜索、创建、共享等)。

  • 支持导航和视图切换(通过Tabs和下拉列表)。

actionbar-actions

二、建立Action Bar

注意:仅支持 Android 3.0 及以上版本

          ActionBar APIs第一次被添加进来是在Android 3.0(API lever 11) ,但是它在Support Library 兼容Android 2.1 (API level 7) 或者更高中也是可用的。

注意:要注意从合适的包中导入ActionBar 类:

  • 如果 支持的 API 等级低于 11: 
    import android.support.v7.app.ActionBar

  • 如果支持的 API 等级仅仅是 11和更高: 
    import android.app.ActionBar

三、添加Action Bar按钮

        Action Bar 允许我们为当前环境下最重要的操作添加按钮。那些直接出现在 action bar 中的 icon 和/或文本被称作action buttons(操作按钮)。安排不下的或不足够重要的操作被隐藏在 action overflow (超出空间的action,译者注)中。

    1.编写XML资源文件

        所有的操作按钮和 action overflow 中其他可用的条目都被定义在 menu资源 的 XML 文件中。通过在项目的res/menu 目录中新增一个 XML 文件来为 action bar 添加操作。

<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 搜索, 应该作为动作按钮展示-->
    <item android:id="@+id/action_search"
          android:icon="@drawable/ic_action_search"
          android:title="@string/action_search"
          app:showAsAction="ifRoom" />
    <!-- 设置, 在溢出菜单中展示 -->
    <item android:id="@+id/action_settings"
          android:title="@string/action_settings"
          app:showAsAction="never" />
</menu>

        上述代码声明,当 action bar 有可用空间时,搜索操作将作为一个操作按钮来显示,但设置操作将一直只在 action overflow 中显示。(默认情况下,所有的操作都显示在 action overflow 中,但为每一个操作指明设计意图是很好的做法。

        icon 属性要求每张图片提供一个 resource id。在 @drawable/ 之后的名字必须是存储在项目目录res/drawable/ 下位图图片的文件名。例如:ic_action_search.png 对应 "@drawable/ic_action_search"。同样地,title 属性使用通过 XML 文件定义在项目目录 res/values/ 中的一个 string 资源,详情请参见 创建一个简单的 UI 。

注意: 使用showAction属性时需要在其之上使用一个定义在<menu>标签中的用户自定义的命名空间,当使用Support Libray定义XML资源时这是必须的,因为这个属性在旧的Android Framework中是不存在的,所以你必须要为所有定义在Support Libray中的属性用自己的命令空间作为他们的前缀。

注意:当创建 icon 和其他 bitmap 图片时,要为不同屏幕密度下的显示效果提供多个优化的版本,这一点很重要。在 支持不同屏幕 课程中将会更详细地讨论。

    2.添加操作

        要为 action bar 布局菜单条目,就要在 activity 中实现 onCreateOptionsMenu() 回调方法来 inflate 菜单资源从而获取 Menu 对象。例如:

@Override
public boolean onCreateOptionsMenu(Menu menu) {    
    // 为ActionBar扩展菜单项
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.main_activity_actions, menu);    
    return super.onCreateOptionsMenu(menu);
}

    3.为操作按钮添加响应事件

        当用户按下某一个操作按钮或者 action overflow 中的其他条目,系统将调用 activity 中onOptionsItemSelected()的回调方法。在该方法的实现里面调用MenuItem的getItemId()来判断哪个条目被按下 - 返回的 ID 会匹配我们声明对应的 <item> 元素中 android:id 属性的值。

@Override
public boolean onOptionsItemSelected(MenuItem item) {    
    // 处理动作按钮的点击事件
    switch (item.getItemId()) {        
        case R.id.action_search:
            openSearch();            
            return true;        
        case R.id.action_settings:
            openSettings();            
            return true;        
         default:            
         return super.onOptionsItemSelected(item);
    }
}

    4.为下级 Activity 添加向上按钮

        在不是程序入口的其他所有屏中(activity 不位于主屏时),需要在 action bar 中为用户提供一个导航到逻辑父屏的不是程序入口的其他所有屏中(activity 不位于主屏时),需要在 action bar 中为用户提供一个导航到逻辑父屏的up button(向上按钮)

actionbar-up.png

图 2. Gmail 中的 up button。

        当运行在 Android 4.1(API level 16) 或更高版本,或者使用 Support 库中的 ActionBarActivity 时,实现向上导航需要在 manifest 文件中声明父 activity ,同时在 action bar 中设置向上按钮可用。

在 manifest 中声明一个 activity 的父类,例如:

<application ... >
    ...   
     <!-- 主 main/home 活动 (没有上级活动) -->
    <activity
        android:name="com.example.myfirstapp.MainActivity" ...>
        ...    
     </activity>
    <!-- 主活动的一个子活动-->
    <activity
        android:name="com.example.myfirstapp.DisplayMessageActivity"
        android:label="@string/title_activity_display_message"
        android:parentActivityName="com.example.myfirstapp.MainActivity" >
        <!--  meta-data 用于支持 support 4.0 以及以下来指明上级活动 -->
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.example.myfirstapp.MainActivity" />
    </activity>
</application>

        然后,通过调用setDisplayHomeAsUpEnabled() 来把 app icon 设置成可用的向上按钮:

@Override
public void onCreate(Bundle savedInstanceState) {    
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_displaymessage);

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);   
    // 如果你的minSdkVersion属性是11活更高, 应该这么用:
    // getActionBar().setDisplayHomeAsUpEnabled(true);}

        由于系统已经知道 MainActivity 是 DisplayMessageActivity 的父 activity,当用户按下向上按钮时,系统会导航到恰当的父 activity , 你不需要去处理向上按钮的事件。

        也可以重写 getSupportParentActivityIntent() and onCreateSupportNavigateUpTaskStack() 在你的activity 中,详细见https://developer.android.com/guide/topics/ui/actionbar.html。

    5.配置ActionBar

manifests/AndroidManifest.xml
<activity android:theme="@style/Theme.AppCompat.Light" ... >

四、自定义Action Bar的风格

        普通属性:

        actionBarStyle:这是一个特殊的的样式资源,通过它可以为ActionBar定义很多样式。Widget.AppCompat.ActionBar  这个颜色默认的样式,你应该使用它作为父样式。

    • background :背景。

    • backgroundStacked : 层叠背景。

    • backgroundSplit :split背景。

    • actionButtonStyle :action按钮样式,使用Widget.AppCompat.ActionButton, 作为其父样式。

    • actionOverflowButtonStyle 使用 Widget.AppCompat.ActionButton.Overflow, 作为其父样式。

    • displayOptions 定义一个或者多个呈现样式, 例如是否使用logo, Activity标题 等等,详细查看官方文档。

    • divider:分割。

    • titleTextStyle:标题样式。使用 TextAppearance.AppCompat.Widget.ActionBar.Title,作为其父样式。                             

    1.使用Android主题

    Android包含两个基本的 activity 主题,这两个主题决定了 action bar 的颜色:

  • ‍‍‍‍‍‍‍Theme.Holo,一个 “dark” 的主题

ActionBar介绍_第1张图片

  • ‍‍Theme.Holo.Light‍‍,一个 “light” 的主题

ActionBar介绍_第2张图片

这些主题即可以被应用到 app 全局,也可以通过在 manifest 文件中设置 <application> 元素 或 <activity>元素的 android:theme 属性,对单一的 activity 进行设置。

例如:

<application android:theme="@android:style/Theme.Holo.Light" ... />

可以通过声明 activity 的主题为 Theme.Holo.Light.DarkActionBar 来达到如下效果:action bar 为dark,其他部分为light。

ActionBar介绍_第3张图片

当使用 Support 库时,必须使用 Theme.AppCompat 主题替代:

  • Theme.AppCompat,一个“dark”的主题

  • Theme.AppCompat.Light,一个“light”的主题

  • Theme.AppCompat.Light.DarkActionBar,一个带有“dark” action bar 的“light”主题

一定要确保我们使用的 action bar icon 的颜色与 action bar 本身的颜色有差异。Action Bar Icon Pack 为 Holo “dark”和“light”的 action bar 提供了标准的 action icon。

    2.自定义背景

res/values/themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 应用于程序或者活动的主题 -->
    <style name="CustomActionBarTheme"
           parent="@android:style/Theme.Holo.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>

    <!-- ActionBar 样式 -->
    <style name="MyActionBar"
           parent="@android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@drawable/actionbar_background</item>
    </style>
</resources>

    3.自定义文本颜色

    修改 action bar 中的文本颜色,需要分别设置每个元素的属性:

  • Action bar 的标题:创建一种自定义样式,并指定 textColor 属性;同时,在自定义的 actionBarStyle中为 titleTextStyle 属性指定为刚才的自定义样式。

注意:被应用到 titleTextStyle 的自定义样式应该使用 TextAppearance.Holo.Widget.ActionBar.Title 作为父样式。

  • Action bar tabs:在 activity 主题中重写 actionBarTabTextStyle

  • Action 按钮:在 activity 主题中重写 actionMenuTextColor

res/values/themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 应用于程序或者活动的主题 -->
    <style name="CustomActionBarTheme"
           parent="@style/Theme.Holo">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="android:actionBarTabTextStyle">@style/MyActionBarTabText</item>
        <item name="android:actionMenuTextColor">@color/actionbar_text</item>   
    </style>

    <!-- ActionBar 样式 -->
    <style name="MyActionBar"
           parent="@style/Widget.Holo.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

    <!-- ActionBar 标题文本 -->
    <style name="MyActionBarTitleText"
           parent="@style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>

    <!-- ActionBar Tab标签 文本样式 -->
    <style name="MyActionBarTabText"
           parent="@style/Widget.Holo.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>
</resources>

     这是对ActionBar的一次简单使用,本文中没有提到Navigation Tabs 、ShareActionProvider等,后续更新。


你可能感兴趣的:(android,Actionbar)