Android学习路线(九)为Action Bar添加Style

这里先贴出原文,下次再来翻译;:p

原文地址:http://developer.android.com/training/basics/actionbar/styling.html

The action bar provides your users a familiar and predictable way to perform actions and navigate your app, but that doesn‘t mean it needs to look exactly the same as it does in other apps. If you want to style the action bar to better fit your product brand,
you can easily do so using Android‘s style and theme resources.

Android includes a few built-in activity themes that include "dark" or "light" action bar styles. You can also extend these themes to further customize the look for your action bar.

Note: If you are using the Support Library APIs for the action bar, then you must use (or override) theTheme.AppCompat family
of styles (rather than the Theme.Holo family,
available in API level 11 and higher). In doing so, each style property that you declare must be declared twice: once using the platform‘s style properties (the android: properties)
and once using the style properties included in the Support Library (theappcompat.R.attr properties—the
context for these properties is actually your app). See the examples below for details.

Use an Android Theme



Android includes two baseline activity themes that dictate the color for the action bar:

You can apply these themes to your entire app or to individual activities by declaring them in your manifest file with the android:theme attribute for the<application> element
or individual <activity>elements.

For example:

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

You can also use a dark action bar while the rest of the activity uses the light color scheme by declaring the Theme.Holo.Light.DarkActionBar theme.

When using the Support Library, you must instead use the Theme.AppCompat themes:

Be sure that you use action bar icons that properly contrast with the color of your action bar. To help you, theAction
Bar Icon Pack
 includes standard action icons for use with both the Holo light and Holo dark action bar.

Customize the Background



To change the action bar background, create a custom theme for your activity that overrides theactionBarStyle property.
This property points to another style in which you can override the backgroundproperty
to specify a drawable resource for the action bar background.

If your app uses navigation tabs or the split
action bar
, then you can also specify the background for these bars using the backgroundStacked and backgroundSplit properties,
respectively.

Caution: It‘s important that you declare an appropriate parent theme from which your custom theme and style inherit their styles. Without a parent style, your action bar will be without many style properties unless you explicitly declare them
yourself.

For Android 3.0 and higher only

When supporting Android 3.0 and higher only, you can define the action bar‘s background like this:

res/values/themes.xml

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

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

Then apply your theme to your entire app or individual activities:

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

For Android 2.1 and higher

When using the Support Library, the same theme as above must instead look like this:

res/values/themes.xml

<?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 library 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">@drawable/actionbar_background</item>

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

Then apply your theme to your entire app or individual activities:

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

Customize the Text Color



To modify the color of text in the action bar, you need to override separate properties for each text element:

For Android 3.0 and higher only

When supporting Android 3.0 and higher only, your style XML file might look like this:

res/values/themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <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 styles -->
    <style name="MyActionBar"
           parent="@style/Widget.Holo.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

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

    <!-- ActionBar tabs text styles -->
    <style name="MyActionBarTabText"
           parent="@style/Widget.Holo.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>
</resources>

For Android 2.1 and higher

When using the Support Library, your style XML file might look like this:

res/values/themes.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:actionBarTabTextStyle">@style/MyActionBarTabText</item>
        <item name="android:actionMenuTextColor">@color/actionbar_text</item>

        <!-- Support library 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/MyActionBarTitleText</item>

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

    <!-- ActionBar title text -->
    <style name="MyActionBarTitleText"
           parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
        <!-- The textColor property is backward compatible with the Support Library -->
    </style>

    <!-- ActionBar tabs text -->
    <style name="MyActionBarTabText"
           parent="@style/Widget.AppCompat.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
        <!-- The textColor property is backward compatible with the Support Library -->
    </style>
</resources>

Customize the Tab Indicator



To change the indicator used for the navigation tabs, create an activity theme that overrides theactionBarTabStyle property.
This property points to another style resource in which you override thebackground property
that should specify a state-list drawable.

Note: A state-list drawable is important so that the tab currently selected indicates its state with a background different than the other tabs. For more information about how to create a drawable resource that handles multiple button states,
read the State List documentation.

For example, here‘s a state-list drawable that declares a specific background image for several different states of an action bar tab:

res/drawable/actionbar_tab_indicator.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<!-- STATES WHEN BUTTON IS NOT PRESSED -->

    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false"
          android:state_pressed="false"
          android:drawable="@drawable/tab_unselected" />
    <item android:state_focused="false" android:state_selected="true"
          android:state_pressed="false"
          android:drawable="@drawable/tab_selected" />

    <!-- Focused states (such as when focused with a d-pad or mouse hover) -->
    <item android:state_focused="true" android:state_selected="false"
          android:state_pressed="false"
          android:drawable="@drawable/tab_unselected_focused" />
    <item android:state_focused="true" android:state_selected="true"
          android:state_pressed="false"
          android:drawable="@drawable/tab_selected_focused" />

<!-- STATES WHEN BUTTON IS PRESSED -->

    <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false"
          android:state_pressed="true"
          android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="false" android:state_selected="true"
        android:state_pressed="true"
        android:drawable="@drawable/tab_selected_pressed" />

    <!-- Focused states (such as when focused with a d-pad or mouse hover) -->
    <item android:state_focused="true" android:state_selected="false"
          android:state_pressed="true"
          android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="true" android:state_selected="true"
          android:state_pressed="true"
          android:drawable="@drawable/tab_selected_pressed" />
</selector>

For Android 3.0 and higher only

When supporting Android 3.0 and higher only, your style XML file might look like this:

res/values/themes.xml

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

    <!-- ActionBar tabs styles -->
    <style name="MyActionBarTabs"
           parent="@style/Widget.Holo.ActionBar.TabView">
        <!-- tab indicator -->
        <item name="android:background">@drawable/actionbar_tab_indicator</item>
    </style>
</resources>

For Android 2.1 and higher

When using the Support Library, your style XML file might look like this:

res/values/themes.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:actionBarTabStyle">@style/MyActionBarTabs</item>

        <!-- Support library compatibility -->
        <item name="actionBarTabStyle">@style/MyActionBarTabs</item>
    </style>

    <!-- ActionBar tabs styles -->
    <style name="MyActionBarTabs"
           parent="@style/Widget.AppCompat.ActionBar.TabView">
        <!-- tab indicator -->
        <item name="android:background">@drawable/actionbar_tab_indicator</item>

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

More resources

Android学习路线(九)为Action Bar添加Style

时间: 2024-10-10 18:06:08

Android学习路线(九)为Action Bar添加Style的相关文章

Android中文翻译 - Adding the Action Bar 添加活动栏(action bar)

2014-10-28 张云飞VIR 翻译自:https://developer.android.com/training/basics/actionbar/index.html 添加活动栏(Adding the Action Bar) 译者注:我找不到更好的词汇翻译action bar,虽然我也认为 活动栏 不是个好的翻译,但总要有个中文名字.不过为了方便识别,本文仍继续使用英文的actionbar 活动栏action bar 是非常重要的设计元素之一,你可以为你的app中的activity来实

Android学习路线(二十四)ActionBar Fragment运用最佳实践

通过前面的几篇博客,大家看到了Google是如何解释action bar和fragment以及推荐的用法.俗话说没有demo的博客不是好博客,下面我会介绍一下action bar和fragment在实战中的应用,以及相关demo源码,希望和大家相互交流. 了解过fragment的同学们应该都知道,fragment是android 3.0版本才出现的的,因此如果要在支持android 3.0一下版本的工程中使用fragment的话是需要添加Support Library的.具体如何添加我就不再赘述

Android学习路线(八)为Action bar添加action按钮

Action bar允许你为与当前应用上下文相关的最重要的action items添加action按钮.那些直接显示在action bar上的icon或者文字都被称作action buttons.那些不适合action bar或者不是那么重要的Actions将会被隐藏在action overflow(译者注:action bar最右侧的垂直的三个点)里. 图1. 一个包含Search功能的action button和用来展示附加action的action overflow. 在XML文件中指定A

Android学习路线(七)设置Action Bar

在action bar最今本的形式中,它仅仅在左边展示了activity的标题以及应用的icon.即使在这种简单的形式中,它也只是告诉用户现在在应用的哪个activity中,同时为你的应用保持一个标识. 图1. 一个展示应用icon和activity标题的action bar 设置一个基本的action bar需要你的应用使用支持action bar的主题.如何来请求这样的主题要看你所选择的你的应用最低支持的Android版本.因此本课会根据应用支持的不同的Android最低版本分为两个部分.

Android学习路线(十)如何将Action Bar叠放在你的布局上

为了第六篇的完整性,这里先贴出原文,下次再来翻译::p 原文地址:http://developer.android.com/training/basics/actionbar/overlaying.html By default, the action bar appears at the top of your activity window, slightly reducing the amount of space available for the rest of your activi

Android学习路线(十九)支持不同设备——支持不同(Android)平台版本

当最新的Android版本为你的应用提供着很棒的APIs时,你却要在更多的设备更新之前继续支持老的系统版本.这篇课程如何在继续支持低版本的系统的情况下使用新版本的高级API. Platform Versions 仪表板展示了最新的活跃设备上运行的Android系统版本的分布,基于设备访问Google Play商店的次数.通常情况下,支持90%的活跃设备同时使用最新版本作为target是一个好习惯. 贴士: 为了在不同的Android版本上提供最好的特性和功能,你应该在你的应用中使用Android

Android学习路线(六)为Android应用添加ActionBar

Action bar 是你可以为你的应用的Activity实现的最为重要的设计元素之一.它提供了集中UI特性,并且通过提供和其他的Android应用的一致性体验让你的应用能够很快被用户熟悉.主要的功能包括: 一个专用的显示应用表示的地方,并且能够指出用户当前在应用中的位置. 用户能够很方便地访问重要的功能(例如搜索). 提供视图切换导航(通过tab,或者下拉列表). 这次的训练课程提供了对action bar基础知识的快速引导.有关action bar的各种特性的更多信息,请查看Action B

Android学习路线(二十一)运用Fragment构建动态UI——创建一个Fragment

你可以把fragment看成是activity的模块化部分,它拥有自己的生命周期,接受它自己的输入事件,你可以在activity运行时添加或者删除它(有点像是一个"子activity",你可以在不同的activity中重用它).本课将向你展示如何使用Support Libaray继承 Fragment 类来让你的应用能够兼容正在运行Android 1.6的设备. 提示: 如果你决定你的应用需求的最低API级别是11或者更高,那么你不需要使用Support Library,你可以直接使用

Android学习路线(五)开启另一个Activity

在完成了 上一篇课程后,你已经有了一个应用.这个应用展示了一个包含一个文本框和一个按钮的activity(一个单独的界面).在这次的课程中,你将会通过在MainActivity中添加一些代码,来让当给你点击Send按钮时能够跳转到另一个activity中. 响应Send按钮 为了响应按钮的点击事件,打开fragment_main.xml 布局文件,然后在 <Button> 元素中加入android:onClick属性: <Button     android:layout_width=&