Training--风格化动作栏

最新推荐文章于 2025-08-10 12:00:48 发布

夏商周

最新推荐文章于 2025-08-10 12:00:48 发布

阅读量717

点赞数

分类专栏： Android官网文档译文文章标签： android sdk

Android官网文档译文专栏收录该内容

39 篇文章

订阅专栏

本文介绍如何通过Android的样式和主题来定制动作栏的外观，包括背景、文本颜色及标签页指示条等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

风格化动作栏

动作栏给你的用户提供了一个熟悉而又直观的方式来执行动作和导航你的app。但是这不是说动作栏必须和其他的APP都是一模一样的。如果你想更改动作栏的样貌的话，你可以通过使用安卓的“风格和主题”轻松实现。

安卓包含了一些内置的activity主题能够实现“深色”和“浅色”的动作栏风格。你也可以通过扩展这些主题来定制你自己的动作栏。

使用安卓主题

安卓包含了两个基本的activity主题，主要是颜色上的区别：

Theme.Holo 深色主题

Theme.Holo.Light 浅色主题

你可以将这些主题应用你的整个APP或者某个activity，这时需要更改配置文件，在<application>或者<activity>里添加android:theme属性。

例如：

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

你也可以应用主题 Theme.Holo.Light.DarkActionBar，这样可以使动作栏是深色的，而其他界面是浅色的。

如果使用的是支持库的话，你应该替换使用Theme.AppCompat主题：

Theme.AppCompat 深色主题

Theme.AppCompat.Light 浅色主题

Theme.AppCompat.Light.DarkActionBar 浅色主题，深色动作栏

请确保动作栏上的动作按钮图标与你的动作栏风格保持匹配。你可以阅读 Action Bar Icon Pack 指南来学习一下。

定制背景

为了更改动作栏的背景，你需要为你的activity创建一个自定义主题，并且覆写属性actionBarStyle。这个属性需要指向另一个style（style意义风格，主题，但是为了和XML文件中的元素对应起来，我打算直接使用英文），在那个style里覆写background属性，background定义了动作栏的背景，需要指向一个图片资源。

如果你使用了导航标签页或者是分离式动作栏，你也可以指定背景，分别修改backgroundStacked和backgroundSplit属性。

针对安卓3.0及以上版本

你可以像下面这样定义动作栏背景：

res/values-v14/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/ab_solid_example</item>
    </style>
</resources>

上面的@android:style/表示引用的是系统SDK自带的主题。还记得我们之前说的@drawable用法吗？我们需要一个ab_solid_example图片文件。如下所示：

res\drawable-hdpi\ab_solid_example.9.png

然后对整个应用或者某个activity应用主题：

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

下载示例代码

针对安卓2.1及以上

（本人不再翻译此相关的东西，因为有些过时，大部分人应该用不到，如果你确实需要的话，还是请参考官方文档吧^_^。）

定制文本颜色

为了更改动作栏的文本颜色，你同样需要覆写相关的文本元素属性值：

动作栏标题：定义一个自定义主题，指定actinBarStyle到中的titleTextStyle的属性textColor值。注意：titleTextStyle需要继承主题TextApperance.Holo.Widget.ActionBar.Title。

动作栏标签页：需要覆写actionBarTabTextStyle。

动作按钮：需要覆写actionMenuTextColor。

针对安卓3.0及以上

假设你在安卓3.0版本及以上的系统上开发，那么需要创建如下一个主题文件：

res/values-v14/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">
        <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="@android:style/Widget.Holo.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

    <!—动作栏的标题风格 -->
    <style name="MyActionBarTitleText"
           parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>

    <!—动作栏标签页的文本风格 -->
    <style name="MyActionBarTabText"
           parent="@android:style/Widget.Holo.ActionBar.TabText">
        <item name="android:textColor">@color/actionbar_text</item>
    </style>
</resources>

上面的文件用到了颜色，我们需要再自定义一个颜色(#ff0000代表红色，顺序为#RRGGBB)：

res/values-v14/colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
    <color name="actionbar_text">#ff0000</color>
</resources>

然后对整个应用或者某个activity应用主题：

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

在上面我们对整个应用使用了自定义主题，分别设定动作栏标题文本，标签页文本，动作按钮文本为红色。因此，我们还需要更改代码和资源文件来添加标签页和动作按钮：

MainActivity.java

@Override
	protected void onCreate(Bundle savedInstanceState) {
		……
		ActionBar ab = getActionBar();
		ab.setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD | 
				ActionBar.NAVIGATION_MODE_TABS);;
		ab.addTab(ab.newTab().setText("Tab 1").setTabListener(tablistener));
		ab.addTab(ab.newTab().setText("Tab 2").setTabListener(tablistener));
		ab.addTab(ab.newTab().setText("Tab 3").setTabListener(tablistener));
	}
	
	private ActionBar.TabListener tablistener = new ActionBar.TabListener() {
		
		@Override
		public void onTabUnselected(Tab tab, FragmentTransaction ft) {
			// TODO Auto-generated method stub
			
		}
		
		@Override
		public void onTabSelected(Tab tab, FragmentTransaction ft) {
			// TODO Auto-generated method stub
			
		}
		
		@Override
		public void onTabReselected(Tab tab, FragmentTransaction ft) {
			// TODO Auto-generated method stub
			
		}
	};

建立一个菜单文件，添加动态按钮：

res/menu/main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.example.actionbartitletext.MainActivity" >

    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:showAsAction="ifRoom"
        android:title="@string/action_settings"/>

</menu>

执行程序，效果图如下：

下载示例代码

定制标签页的指示条

为了更改标签页的指示条（默认是蓝色，我们将把它改成白色的），你需要覆写actionBarStyle属性。这个属性指向另一个主题，在那里你需要修改background指向一个状态型的图像资源。（所谓状态型图像资源，就是根据某个标签页选中或不选中等状态变化显示不同的背景图片。）

例如，下面我们建立了一个状态型的图像资源：

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>

上面还需要一些图片资源，请下载后面的示例代码。

接下来，需要自定义主题：

res/values-v14/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">
        <item name="android:actionBarTabStyle">@style/MyActionBarTabs</item>
    </style>

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

然后对整个应用或者某个activity应用主题：

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

修改MainActivity.java，添加几个标签页，否则看不到效果。具体如何添加，请参考上面的代码示例。

效果图如下：

下载代码示例

如果你想更改动作栏更多的东西，请参考网站 Android Action Bar Style Generator，这个网站可以帮你自动生成所需的资源，非常方便，你下载下来看看就了解怎么回事了。推荐使用360浏览器下载，别的浏览器好像下载不下来。