Android Theme.AppCompat 中,你应该熟悉的颜色属性

建立一个 Android 工程,第一步,也是必不可少的一步,就是定制 Application 主题样式。利用系统诸多属性定义 App 各类 View 的默认样式,可以减小 layout 文件中不少重复性的属性设置代码。在开发者官网 R.attr 栏目中,Google 列出了全部 Android SDK 中的系统级属性。如何取舍,如何区分,又有哪些经常使用的属性呢?本文就来列举颜色相关的一些属性介绍,以供参考。html

一般,在 res/values/styles.xml 文件中定义的 application 主题样式里,你可能见到的最多见的使用组合是这样:android

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style>

</resources>复制代码

事实上,远不止这样...git

Theme.AppCompat


自 Lollipop 开始,Android 系统引入 Material Design 风格,各个控件的呈现样式大有改变。为了在不一样版本的系统中统一 UI 样式,设置自定义的 Application Theme 的 parent 样式为 Theme.AppCompat 系列便可。好比这里的 Theme.AppCompat.Light.NoActionBar 主题。程序员

关于 AppCompat 相关主题提供的系统属性,能够参考源码:v7/appcompat/res/values-v21/themes_base.xmlgithub

同时,因为部分属性的版本兼容问题,为了不添加多个版本的 styles 文件,能够省略 android: 命名空间。微信

colorPrimaryapp

App Bar 的背景色,即 ActionBar,一般也是一个 App 的主题色调。不过 ActionBar 已经退出历史舞台,由 Toolbar 代替使用,可是 Toolbar 须要在 layout 文件中单独使用 background 属性设置背景色,如:ide

<android.support.v7.widget.Toolbar android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" />复制代码

colorPrimaryDark测试

status bar(状态栏)背景色。仅做用于 Lollipop 及更高版本。字体

colorAccent

许多控件在选中状态或获取焦点状态下使用这个颜色,常见有:

  • CheckBox:checked 状态
  • RadioButton:checked 状态
  • SwitchCompat:checked 状态
  • EditText:获取焦点时的 underline 和 cursor 颜色
  • TextInputLayout:悬浮 label 字体颜色
  • 等等

除了这三种常见的控制颜色属性,事实上,还有一些颜色相关的属性也是很是实用的。

android:navigationBarColor

navigation bar 背景色。仅做用于 Lollipop 及更高版本。

colorControlNormal

某些 Views “normal” 状态下的颜色,常见如:unselected CheckBox 和 RadioButton,失去焦点时的 EditText,Toolbar 溢出按钮颜色,等等。

colorControlActivated

某种程度上,是 colorAccent 的替代者,好比对于 CheckBox 和 RadioButton 的 checked 状态,colorControlActivated 属性会覆盖 colorAccent 属性的对应颜色。

colorControlHighlight

全部可点击 Views 触摸状态下的 Ripple(涟漪)效果。仅做用于 Lollipop 及更高版本。

colorButtonNormal

Button normal 状态下的背景色。注意,这种设置与 Button 的 android:background 属性改变背景色不一样的是,前者在 Lollipop 及更高版本上会让 Button 依旧保持阴影和 Ripple 触摸效果。

android:windowBackground

窗口背景色,诸如此类的还有:android:backgroundandroid:colorBackground 等。

android:textColorPrimary

EditText 的 text color,等等文本颜色。

诸如此类,还有不少颜色相关的系统属性。GitHubGist 上面有一份参考指南:Android Lollipop Widget Tinting Guide,列举了经常使用控件的着色相关属性。

ThemeOverlay.AppCompat


做为 Application Theme 的 parent 主题,Theme.AppCompat 提供了诸多属性设置 App 全局 Views 样式。可是有时候,咱们仍是须要单独给某个或者某些 View 设置与全局样式不同的样式。这种状况下,ThemeOverlay.AppCompat 就派上用场啦。

正如命名所表达的含义通常,ThemeOverlay.AppCompat 系列主题用于覆盖基本的 AppCompat.Theme 样式,按照需求仅仅改变部分属性的样式。这里列举一些常见用法:

ThemeOverlay.AppCompat

继承自 @style/Base.ThemeOverlay.AppCompat。这是一个空主题,可是却将 AppCompat 主题中的相关属性复制了一遍。这在给个别 View 单独设置部分样式时很是实用。举个例子:

<style name="AppTheme.Secondary" parent="ThemeOverlay.AppCompat"> <item name="colorAccent">@color/colorPrimary</item> </style>复制代码

而后再借助 android:theme 属性使用在 layout 中的某个 View 上:

android:theme="@style/AppTheme.Secondary"复制代码

在这个例子中,重写了 colorAccent 属性,同时保证其余属性继续延用 parent 为 Theme.AppCompat 的 AppTheme 中的设置。从 ThemeOverlay.AppCompat 文档介绍中能够看出,好比 colorPrimary 属性是这样复制的:

android:colorPrimary = ?attr/colorPrimary

若是 parent 使用 Theme.AppCompat 或者其余主题就不行,至关于只设置 colorAccent 属性,其余属性使用默认样式。

ThemeOverlay.AppCompat.Light(Dark)

与 ThemeOverlay.AppCompat 不一样的是,这个主题修改背景色、文本颜色、高亮状态颜色来匹配 Light(Dark)主题。好比 Light 样式下的白色背景里,显示黑色(Dark)文本;Dark 样式下的黑色背景里,显示白色(Light)文本。

这个主题的使用场景能够是这样,好比咱们的全局主题是 Light,可是有一部分 UI 可能须要使用一个 Dark 样式的背景,这种状况下,每一个 View 单独设置颜色就比较麻烦,能够在 ViewGroup 中统一设置,好比:

<FrameLayout android:background=”@color/dark_background” android:theme="@style/ThemeOverlay.AppCompat.Dark”> <TextView /> </FrameLayout>复制代码

ThemeOverlay.AppCompat.Dark.ActionBar
ThemeOverlay.AppCompat.Light.ActionBar

相比而言,因为 Toolbar 的普遍使用,这对主题使用的就比较多啦。前面咱们说过,colorControlNormal 和 textColorPrimary 属性均可以影响 Toolbar 或者 ActionBar 的溢出按钮颜色和溢出文本颜色,同时也改变着其余 View 的显示颜色。综合考虑下,咱们不会使用在 Application Theme 使用这些属性控制 Toolbar 的内容颜色,而是使用这对主题单独设置给 Toolbar 的 theme 属性。

好比全局使用的是 Light 主题,Toolbar 的背景色是蓝色或者红色之类的颜色,要求溢出按钮的颜色是白色。若是没有特殊设置的话,默认状况下溢出按钮显示为黑色。此时,即可以用上这个主题:

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="?android:attr/actionBarSize" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" android:background="?attr/colorPrimary">

</android.support.v7.widget.Toolbar>复制代码

总结


系统主题提供的属性样式很是之多,同时也会相互影响,多对多关系,错综复杂,而且有些还会存在版本兼容问题,使用时必定要多多测试。固然,使用恰当的话,可以减小不少重复性的 xml 代码,也方便后续 App 主题变动的需求,拓展之类的场景。

关于我:亦枫,博客地址:yifeng.studio/,新浪微博:IT亦枫

微信扫描二维码,欢迎关注个人我的公众号:安卓笔记侠

不只分享个人原创技术文章,还有程序员的职场遐想

相关文章
相关标签/搜索