AndroidTraining学习------Adding the Action Bar

Adding the Action Bar

Action bar的关键功能包括以下这些:

  • 在app中留一处专门的空间标识你的app并指明使用者所处的位
  • 通过可预见的方式进行重要的动作
  • 支持导航和视图切换(标签和下拉菜单)

Setting Up the Action Bar

创建一个最基本的action bar需要你的app使用一个支持action bar的activity主题。需要怎样的主题取决于你的app支持的最低安卓版本。

Support Android 3.0 and Above Only

从Android 3.0开始,action bar包含在所有使用Theme.Holo主题(或者它的子主题)的activity中,当targetSdkVersion或minSdkVersion属性设置为“11”或更高时,它是默认主题。

Support Android 2.1 and Above

当在比Android 3.0更老的版本上添加action bar时,需要你在你的应用中导入Android支持库。
一旦有了与你项目集成的支持库:
1.更新你的activity,使它继承ActionBarActivity,例如:

public class MainActivity extends ActionBarActivity{...}

2.在你的配置文件中,更新你的<application>或独立的<activity>元素,使用Theme.AppCompat主题中的一个,例如:

<activity android:theme:"@style/Theme.AppCompat.Light"...>

Adding Action Bar

Action bar允许你添加与app当前上下文有联系的最重要行动项目的按钮。那些直接出现在action bar中的图标和文字被称为动作按钮,不能在action bar或不那么重要的动作被隐藏在下拉菜单中。

Specify the Action Bar

所有的动作按钮和下拉菜单中的项目都定义在一个XML menu resource中,为了添加action到action bar中,先在你的项目的res/menu/目录中创建一个新的XML文件
为每一个你想放置在action bar中的项目添加<item>元素,例如:

    <menu xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <!-- Search, should appear as action button -->
        <item
            android:id="@+id/action_search"
            android:icon="@drawable/ic_action_search"
            android:showAsAction="ifRoom"
            android:title="@string/action_search" />
        <!-- Settings, should always be in the overflow -->
        <item
            android:id="@+id/action_settings"
            android:showAsAction="never"
            android:title="@string/action_settings" />
    </menu>
  • showAsAction属性有四个值:
  • always:这个值会使菜单项一直显示在Action Bar上
  • ifRoom:如果有足够空间,这个值会使菜单项显示在Action Bar上
  • never:这个值使菜单项永远不会显示在ActionBar上
  • withText:这个值使菜单项和它的图标,文本一起显示
    注意:当为你的app创建icon或者bitmap图片时,要为不同屏幕密度下的显示效果提供多个优化的版本,这一点非常重要。
    如果你要兼容Android2.1的support库,在android:命名空间下showAsAction属性不能使用。Support库提供了替代的属性,你必须定义你自己的XML命名空间并用该命名空间作为属性的前缀。(一个自定义的XML命名空间应该以你的app名称为基础,但是可以取任何你想要的名字,它的作用域仅仅在你的声明文件范围之内)比如:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:yourapp="http://schemas.android.com/apk/res-auto"
         <!--Search,should appear as action button --->
         <item android:id="@+id/action_search"
               android:icon="@drawable/ic_action_search"
               android:title="@string/action_search"
               yourapp:showAsAction="ifRoom"/>
         ...
</menu>

Add the Action to the Action Bar

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

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        //Inflate the menu items for use in the action bar
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main_activity_actions, menu);
        return super.onCreateOptionsMenu(menu);
    } 

Respond to Action Buttons

当用户点击某一个操作按钮或者下拉菜单时,系统会调用activity中的onOptionsItemSelected()回调方法。在该方法的实现中会调用MenuItem的getItemId()方法去判断哪个条目被点击了--返回的ID会匹配我们声明对应的<item>元素中的android:id属性的值。

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        //Handle presses on the action bar items
        switch (item.getItemId()) {
            case R.id.action_search:
                Toast.makeText(MainActivity.this, "you click the search button", Toast.LENGTH_SHORT).show();
                return true;
            case R.id.action_settings:
                Toast.makeText(MainActivity.this, "you click the settings button", Toast.LENGTH_SHORT).show();
                return true;
            default:
                return super.onOptionsItemSelected(item);
        }
    }

Add Up Button for Low-level Activities

在不是程序入口的所有其他屏中(activities不是“home”页)需要为用户提供一个导航到逻辑父屏的Up Button(向上按钮)。
当运行在Android4.1或更高的版本,或者使用Support库中的ActionBarActivity时,实现向上只需要你在manifest文件中定义父activity,并且设置action bar中的Up Button可用。比如:

    <activity android:name=".DisplayMessageActivity"
        android:label="@string/title_activity_display_message"
        android:parentActivityName=".MainActivity">
    </activity>

然后通过setDisplayHomeAsUpEnabled()将app icon设置成可用的Up按钮:

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

        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        //If your minSdkVersion is 11 or higher, instead use:
        //getActionBar().setDisplayHomeAsUpEnabled(true);
    }

因为系统现在知道MainActivity时DisplayMessageActivity的父activity,当用户点击Up按钮时,系统会导航到恰当的父activity--你需要处理Up Button的点击事件。

Styling the Action Bar

Android包括少部分内置的activity主题,这些主题包括"drak"或"light"action bar样式。你可以扩展这些主题,以便更好地为action bar自定义外观。
注意:如果你在action bar中使用了Support库的API,你必须使用(或重写)Theme.AppCompat家族样式(甚至Theme.Holo家族样式,在API level 11及以上可用)。如此一来,声明的每个样式属性都必须声明两次:一次使用平台的样式属性(android:属性),一次使用Support库的样式属性(appcompat.R.attr 属性 -- 这些属性的上下文其实就是我们的app)。

Use an Android Theme

Android包括两种基本的activity主题,它们决定了action bar的颜色:

  • Theme.Holo for a "drak" theme.

  • Theme.Holo.light for a "light" theme.
    这些主题可以被应用到整个app,也可以通过在manifest文件中设置<application>元素或<activity>元素的android:theme属性,对单一的activities进行设置。比如:

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

通过声明Theme.Holo.Light.DarkActionBar可以使action bar为dark,而其余部分为light。
当使用Support库时,必须用Theme.AppCompat主题替代:

  • Theme.AppCompat for the "dark" theme.
  • Theme.AppCompat.Light for the "light" theme.
  • Theme.AppCompat.Light.DarkActionBar for the light theme with a dark action bar.
    确保你使用的action bar icon和action bar本身有差异。

Customize the Background

为改变action bar的背景,可以通过为activity自定义一个主题,并重写actionBarStyle属性。该属性指向另一个样式,在这个样式里,我们可以通过指定一个drawable资源来重写background属性。
如果你的app使用了navigation tabs或split action bar,你也可以通过分别设置backgroundStacked和backgroundSplit属性来为bars指定背景。
警告:声明合适的父主题非常重要,你自定义的主题和样式继承它们的样式。如果没有父样式,你的action bar将会失去许多默认的样式属性,除非我们显式的对它们进行声明。

For Android 3.0 and higher only

仅当支持Android 3.0和更高版本时,你可以这样定义action bar的背景:

  <?xml version="1.0" encoding="utf-8"?>
  <resources>
      <!--the theme applied to the application or activity-->
      <style name="CustomActionBarTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
          <item name="android:actionBarStyle">@style/MyActionBar</item>
      </style>

      <!--ActionBar styles-->
      <style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
          <item name="android:background">#ff0000</item>
      </style>
  </resources>

然后将我们的主题应用到整个app中或单独的activity中:

  android:theme="@style/CustomActionBarTheme"...>

For Android 2.1 and higer

当你使用Support库时,上面同样的主题必须替代如下:

  <?xml version="1.0" encoding="utf-8"?>
  <resources>
      <!--the theme applied to the application or activity-->
      <style name="CustomActionBarTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
          <item name="android:actionBarStyle">@style/MyActionBar</item>

          <!--Support libray compatibility-->
          <item name="actionBarStyle">@style/MyActionBar</item>
      </style>

      <!--ActionBar styles-->
      <style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
          <item name="android:background">#ff0000</item>

          <!--Support library compatibility-->
          <item name="background">@color/red</item>
      </style>
  </resources>

然后将我们的主题应用到整个app中或单独的activity中:

  android:theme="@style/CustomActionBarTheme"...>

Customize the Text Color

为了修改action bar文本的颜色,你需要重写每个元素的属性:

  • Action bar title:创建一个自定义样式,并指定textColor属性;同时在我们自定义的actionBarStyle中指定titleTextStyle属性。
    注意:被应用到titleTextStyle的自定义样式应该使用TextAppearance.Holo.Widget.ActionBar.Title 作为父样式。
  • Action bar tabs:在我们的activity主题中重写actionBarTabTextStyle。
  • Action buttons:在我们的activity主题中重写actionMenuTextColor。

For Android 3.0 and higher only

当仅支持Android3.0和更高版本时,你的Style XML文件用该这样:

  <?xml version="1.0" encoding="utf-8"?>
  <resources>
      <!--the theme applied to the application or activity-->
      <style name="CustomActionBarTheme" parent="@style/Theme.AppCompat">
          <item name="android:actionBarStyle">@style/MyActionBar</item>
          <item name="android:actionBarTabStyle">@style/MyActionBarTabText</item>
          <item name="android:actionMenuTextColor">@color/actionbar_text</item>
      </style>

      <!--ActionBar styles-->
      <style name="MyActionBar" parent="@style/Widget.AppCompat.ActionBar">
          <item name="android:titleTextStyle">@style/MyActionBarTitleStyle</item>

      </style>

      <!--ActionBar tab text-->
      <style name="MyActionBarTabText" parent="@style/Widget.AppCompat.ActionBar.TabText">
          <item name="android:textColor">@color/actionbar_text</item>
      </style>

      <!--ActionBar title text-->
      <style name="MyActionBarTitleStyle" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
          <item name="android:textColor">@color/actionbar_text</item>
      </style>
  </resources>

For Android 2.1 and higher

当时使用Support库时,我们的style XML文件应该是这样的:
<?xml version="1.0" encoding="utf-8"?>
<resources>

<style name="CustomActionBarTheme" parent="@style/Theme.AppCompat">
<item name="android:actionBarStyle">@style/MyActionBar</item>
<item name="android:actionBarTabStyle">@style/MyActionBarTabText</item>
<item name="android:actionMenuTextColor">@color/actionbar_text</item>

          <!--Support libray compatibility-->
          <item name="actionBarStyle">@style/MyActionBar</item>
          <item name="actionBarTabTextStyle">@style/MyActionBarTabText</item>
          <item name="actionMenuTextColor">@color/actionbar_text</item>
      </style>

      <!--ActionBar styles-->
      <style name="MyActionBar" parent="@style/Widget.AppCompat.ActionBar">
          <item name="android:titleTextStyle">@style/MyActionBarTitleStyle</item>

          <!--Support library compatibility-->
          <item name="titleTextStyle">@style/MyActionBarTitleStyle</item>
      </style>

      <!--ActionBar tab text-->
      <style name="MyActionBarTabText" parent="@style/Widget.AppCompat.ActionBar.TabText">
          <item name="android:textColor">@color/actionbar_text</item>
      </style>

      <!--ActionBar title text-->
      <style name="MyActionBarTitleStyle" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
          <item name="android:textColor">@color/actionbar_text</item>
      </style>
  </resources>

Overlaying the Action Bar

默认情况下,action bar显示在activity窗口的顶部,会稍微减少其他布局的可用空间。如果在用户交互的过程中,你想要隐藏或显示action bar可以调用hide()和show()来实现。然而,这将导致activity会基于它的新尺寸重新计算和重新绘制布局。
为避免在显示和隐藏action bar时重新调整布局大小,我们可以在action bar上启用叠加模式(overlay mode),布局可以使用所有的可用空间,就好像action bar不存在一样,并且系统会将action bar叠加在布局之上。这样布局顶部就会有点被遮挡,但是现在action bar隐藏或显示时,系统就不需要重新调整布局的大小而是无缝过渡。

Enable Overlay Mode

要为action bar 启用overlay mode,我们需要创建一个自定义主题,该主题继承与一个已存在的action bar 主题,并且把android:windowActionBarOverlay属性设置为true。

For Android 3.0 and higher only

如果minSDKVersion设为11或更高版本,我们的自定义主题应该使用Theme.Holo 主题(或者它的一个子主题)作为父主题。比如:

  <resources>
      <!--the theme applied to the application or activity-->
      <style name="CustomActionBarTheme" parent="@style/Theme.Holo">
          <item name="android:windowActionBarOverlay">true</item>
      </style>
  </resources>

For Android 2.1 and higher

如果你的app为了兼容运行在Android 3.0之下的设备而使用了Support库,你的自定义主题应该使用Theme.AppCompat主题(或它的一个子主题)作为父主题。比如:

  <resources>
      <!--the theme applied to the application or activity-->
      <style name="CustomActionBarTheme" parent="@style/Theme.AppCompat">
          <item name="android:windowActionBarOverlay">true</item>
       
          <!--Support library compatibility-->
          <item name="windowActionBarOverlay">true</item>
      </style>
  </resources>

注意,这个主题包括两种不同的windowActionBarOverlay样式定义:一个带有android:前缀,一个没有。带有android:前缀的适用于包括该样式的Android系统版本,不带前缀的适用于从Support读取样式的旧版本。

Specify Layout Top-margin

当action bar启用了overlay mode,可能会遮挡某些本应该可见的布局。为了确保这些布局始终处于action bar的下面,可以通过使用actionBarSize来指定顶部margin或padding的高度来实现。比如:

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingTop="?android:attr/actionBarSize">
  </LinearLayout>

如果你在action bar中使用了Support库,你需要删除android:前缀。比如:

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingTop="?android:attr/actionBarSize">
  </LinearLayout>

在这种情况下,不带前缀的?attr/actionBarSize适用于包括Android3.0和更高版本的所有版本。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容