使用 colorPrimary 来给你的 App Bar 上色

伴随Android5.0+之后，除了新增一些ToolBar、recyclerview、cardview等控件，MD的设计，App样式也改变了一些。

事实上，AppCompat 使用了提供一个调色板（color palette [2]）的技术让这一切变得非常容易。虽然 Material 主题是在 Android 5.0 引入的，但是 AppCompat 使得这种技术适用于所有Android 2.1 以上的设备。

如果你使用的是一个类似于 Theme.AppCompat 的主题，那么你只需要添加一个 colorPrimary 属性:

Java

        <div class="crayon-info" style="min-height: 18.2px !important; line-height: 18.2px !important;"></div>
        <div class="crayon-plain-wrap"><textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly="" style="tab-size: 4; font-size: 13px !important; line-height: 15px !important; z-index: 0; opacity: 0;">&lt;style name="AppTheme" parent="@style/Theme.AppCompat"&gt;

<item name=”colorPrimary”>@color/primary</item>
</style>

1 2 3

<style name =”AppTheme” parent =”@style/Theme.AppCompat”> <item name =”colorPrimary”>@color/primary</item> </style>

然后你的 App Bar 将会恰如其分地被上色。要注意到我们要用的是 colorPrimary 而不是 android:colorPrimary。和appCompat 提供的 colorPrimary不同， android:colorPrimary 只能被用在 Android 5.0 以上的设备。一定要确保你正使用的是正确的主题，这样才能使得文字和图标有足够的反差。

– Theme.AppCompat -> 深色的Activity，深色的 App Bar
– Theme.AppCompat.Light -> 浅色的Activity，浅色的 App Bar
– Theme.AppCompat.Light.DarkActionBar ->  浅色的Activity，深色的 Action Bar

也许你早已经迁移到了 Toolbars （或者包装在 Design Library 的 AppBarLayout 当中[3]）？ 在这种情况下，你很可能在使用 Theme.AppCompat.NoActionBar 或是  Theme.AppCompat.Light.NoActionBar 作为主题，并且把这些元素包含到了你的布局 XML 文件当中。值得庆幸的是，你依然可以通过 ?attr/colorPrimary 格式来利用你的 colorPrimary :

Java

<android.support.v7.widget.Toolbar android:background=”?attr/colorPrimary” />

1 2	< android . support . v7 . widget . Toolbar android : background = “?attr/colorPrimary” / >

这个 ?attr/ 格式允许你把任何元素从你的主题中剥离，这让你更轻松地把主题固化在一个地方，从而避免在很多文件之间查找或是替换。

不过我们还遗留了一件事，那就是文字上色的部分。根本没有 Theme.AppCompat.Light.DarkActionBar.NoActionBar 这个主题。这便是 ThemeOverlay 颇为受用的证据。不同于一个完整的主题那样，ThemeOverlay 只是覆盖于当前主题，改变稍许它应该改变的视图。举个例子来讲，如果我们有一个浅色的主题但是需要一个深色的 Toolbar，我们可以这么用:

Java

<android.support.v7.widget.Toolbar android:background=”?attr/colorPrimary” android:theme=”@style/ThemeOverlay.AppCompat.Dark.ActionBar”/>

1 2 3

< android . support . v7 . widget . Toolbar android : background = “?attr/colorPrimary” android : theme = “@style/ThemeOverlay.AppCompat.Dark.ActionBar” / >

随此改变，文字和图标应该回归到了白色，与深色的 Toolbar 相得益彰。

你将会发现一些其它的颜色你可以添加，并且应该添加到你的主题中：例如 colorPrimaryDark 用以改变 5.0 以上的设备的状态栏以获得更深的广告色；colorAccent 则是高对比的强调色，为了让类似于 FloatingActionButton 这样的元素更加真实地浮现而设计。如果你想了解更多AppCompat 的事情，去看看我们的视频 Consistent Design with AppCompat 吧。

现在使用 colorPrimary 来给你的 App Bar 上色，赋予App个性吧！[4]

Google Plus链接，需要梯子

#构建更佳的应用https://plus.google.com/s/%23BuildBetterApps

文中注释链接，需要梯子

[1] – http://www.google.com/design/spec/layout/structure.html?linkId=15263302#structure-app-bar
[2] – https://developer.android.com/training/material/theme.html?linkId=15263307#ColorPalette
[3] – https://developer.android.com/reference/android/support/design/widget/AppBarLayout.html?linkId=15263308
[4] – https://www.youtube.com/watch?v=5Be2mJzP-Uw