使用 Theme Editor 设计应用主题背景

警告:从版本 3.3 开始,Theme Editor 不再包含在 Android Studio 中。

Android Studio 包含一个名为 Theme Editor 的视觉辅助工具,该工具可以帮助您:

  • 创建和修改应用的主题背景
  • 调整不同资源分类器的主题背景。
  • 直观呈现常见界面元素颜色变化的效果。

本页介绍您可以使用 Theme Editor 执行的基本任务,并说明如何执行此类任务。

Theme Editor 基础知识

本部分介绍主题 Theme Editor 的访问方式及其布局方式。

访问 Theme Editor

有两种方法可以打开 Theme Editor:

  • 在打开的样式 XML 文件(例如 styles.xml)中,点击文件窗口右上方附近的 Open editor
  • Tools 菜单中,选择 Theme Editor

在 Theme Editor 中导航

Theme Editor 的主屏幕分为两个部分:左侧显示将当前主题背景应用于特定界面元素(如应用栏或凸起按钮)时它们会是什么样子;右侧显示正在预览的当前主题背景的名称、该主题背景是在哪个模块上定义的,以及主题背景资源(如 Theme parentcolorPrimary)的设置。您可以通过更改这些资源设置来修改设计主题背景。

主题背景和颜色

在 Theme Editor 中,您可以创建新的主题背景、修改现有的主题背景,以及管理构成主题背景的颜色。

创建新主题背景

要创建主题背景,请按以下步骤操作:

  1. 打开 Theme Editor 右上方附近的 Theme 下拉菜单。
  2. 点击 Create New Theme
  3. New Theme 对话框中,为新主题背景输入一个名称。
  4. Parent theme name 列表中,点击主题背景从其继承初始资源的父主题背景。

重命名主题背景

要重命名主题背景,请执行以下步骤:

  1. 打开 Theme Editor 右上方附近的 Theme 下拉菜单。
  2. 点击 Rename theme-name
  3. Rename 对话框中,为主题背景输入一个新名称。
  4. (可选)要查看更改后会是什么样子,请点击 Preview
  5. 要应用更改,请点击 Refactor

更改颜色资源

要更改现有颜色资源(如 colorPrimary),请按以下步骤操作:

  1. 在 Theme Editor 中,点击要更改的资源的名称旁边的彩色方格。此时将显示 Resources 对话框,该对话框左侧显示颜色组的列表,右侧显示当前选定资源颜色的设置和信息。
  2. 设置主题背景资源的颜色,方法是从左侧面板中选择一种颜色,或定义一种新颜色,如下所述。

选择颜色

颜色列位于 Resources 对话框的左列中并分成以下几组。

  • Project:这些是项目中的颜色。有些颜色可以修改,因为它们是项目源的一部分;有些颜色不能修改,因为它们是您包含在项目中的库的一部分。
  • android:这些是属于 android 命名空间的颜色资源。它们是 Android 框架的一部分,不能修改。
  • Theme Attributes:这些是当前选定主题背景的属性。它们由主题背景引用,可能会根据您选择的主题背景而发生变化。绝对无法在 Resources 对话框中修改主题背景属性。

定义新颜色

    图 1. 颜色编辑器

  1. Resources 对话框右上角的下拉菜单中,依次点击 Add new resource > New color ValueResources 对话框将显示可修改的右侧窗格,其中包含一个空白的 Name 字段,因此您可以为自定义颜色输入一个名称。
  2. 按以下步骤操作来创建自定义颜色。这些步骤与图 1 中的标注对应。
    1. 在空的 Name 字段中,为新颜色值输入一个名称。名称中不允许使用空格或特殊字符,但允许使用下划线和数字。
    2. 色标、Custom color 字段和颜色提取器:
      • 在色标上,点击所需的颜色。相应颜色将显示在 Custom color 字段中。
      • 您可以使用 Custom color 字段左侧的颜色提取器来选择一种颜色。点击颜色提取器图标 ,然后点击计算机屏幕上的可见的任意内容。Custom color 字段中的颜色将更改为您选择的颜色。
    3. Custom color 字段正下方,使用可修改的字段和左侧的下拉菜单以数值形式指定 RGBHSBARGB 颜色。相应颜色的 HEX 等效值将显示在最右侧的可修改字段中。
    4. 要设置颜色不透明度和色调,请移动色标下方的滑块。
    5. 选择某个可用的预定义颜色方块。相应颜色将显示在 Custom Color 字段中,并且名称将更改为您选择的颜色的名称。
  3. 点击 OK 保存您的设置。Resources 对话框随即关闭,并使您返回 Theme Editor。

修改颜色

您可以修改任何可修改的颜色。如果某种颜色可修改,您会看到可修改的颜色、色调、不透明度和名称字段,以及设备配置字段。如果您想知道为什么某些字段可修改而其他字段不可修改,请参阅选择颜色

  1. 调整设置。
  2. 点击 OK

匹配素材颜色

如果您已定义或修改某种自定义项目颜色,则可以点击位于 Custom color 旁边的 CLOSEST MATERIAL COLOR 来确保该颜色与最接近的素材调色板颜色匹配。Android Studio 会将您选取的颜色的颜色值和不透明度值更改为与该颜色最相似的素材颜色的相应值,并将 Custom color 替换为素材调色板中的颜色的名称。

注意:仅当相应颜色还不是素材颜色时,才会显示 CLOSEST MATERIAL COLOR 功能。

查看状态列表和颜色

在 Theme Editor 中,您可以预览与不同状态关联的颜色。为此,请点击可修改的状态列表资源名称旁边的颜色集方块以打开 Resources 对话框。Resources 对话框会显示状态(如“Selected”)的列表,以及与状态关联的颜色值。点击颜色,使状态可选择其他颜色值。

要更全面地控制状态本身,您可以直接在用来定义状态的 XML 文件中查看和修改状态的属性。如需了解详细信息,请参阅 ColorStateList 类的文档。

设备专用配置

如果某种颜色可修改,您可以选择要让应用支持的设备专用配置。为此,请执行以下步骤:

  1. 打开 Resources 对话框。如需了解如何打开 Resources 对话框,请参阅更改颜色资源
  2. 选择一种 Project 颜色,然后在右侧窗格的底部点击以展开 Device Configuration,从而显示包含相应资源的 XML 文件的源集和名称,以及存放该文件的配置专用目录的列表。
  3. 如有必要,可更改 XML 文件名。
  4. 找到您希望支持的设备专用配置对应的目录,勾选该目录旁边的框。如果您没有为配置指定任何目录,该配置将默认使用 values 目录。

如需详细了解目录名称与配置之间的关系,请参阅支持多种屏幕。如需详细了解支持的目录名称,请参阅提供资源