背景

       Google android S 新特性，当你更换壁纸，整个手机主题的颜色会根据壁纸的配色方案而改变。也就说，每当你更新壁纸，你的手机界面也会焕然一新

       当用户在 Android 12 设备上更改壁纸时，系统会分析图像以选择一种颜色，并使用初始种子颜色通过算法选择主要（Primary）、次要（Secondary）、第三（Tertiary）和错误（Error）颜色。同时，它应用了色彩理论和可访问性规则。从这些颜色中，该算法创建从 0% 亮度（黑色）到 100%（白色）的色调调色板。

环境准备

1、应用的最低 SDK 设置为 31 或更高版本。

2、material主题包应用升级到1.5.0或以上 'com.google.android.material:material:1.5.0'

3、Material You 主题生成网站

Material Theme Builder

       添加自定义的颜色点击EXPORT导出XML，会生成两套主题即日常模式和黑暗模式（values，valu-night），这些文件可以按原样复制替换，但必须更改AndroidManifest.xml 或主题文件中的主题名称以相互匹配。工具导出主题的默认名称是 AppTheme。

//生成的主题继承自Material3 <style name="AppTheme" parent="Theme.Material3.Light.NoActionBar"> <item name="colorPrimary">@color/md_theme_light_primary</item> <item name="colorOnPrimary">@color/md_theme_light_onPrimary</item> <item name="colorPrimaryContainer">@color/md_theme_light_primaryContainer</item> <item name="colorOnPrimaryContainer">@color/md_theme_light_onPrimaryContainer</item> ...... <item name="colorColor90">#286b2a</item> <item name="colorOnColor90">#ffffff</item> <item name="colorColor90Container">#abf5a3</item> <item name="colorOnColor90Container">#012104</item> <item name="harmonizeColor90">false</item> <item name="colorColor29">#00639c</item> <item name="colorOnColor29">#ffffff</item> <item name="colorColor29Container">#cce5ff</item> <item name="colorOnColor29Container">#001d33</item> <item name="harmonizeColor29">false</item> <item name="colorPrimaryInverse">@color/md_theme_light_primaryInverse</item> </style>

对应方式

        Material 库中的DynamicColors类利用 Activity Lifecycle Callbacks来确定何时以及如何应用颜色叠加。使用提供的 API 调用，可以将动态颜色应用于activity或整个应用程序。还可以确定应在何时何地应用动态颜色。

       避免意外影响，应确保应用程序代码组件引用Material主题属性即

android:color="?attr/colorPrimary"，而不是应用任何硬编码颜色（HEX代码或@color/）

讯享网

讯享网import android.app.Application; import com.google.android.material.color.DynamicColors; public class MyApplication extends Application { @Override public void onCreate() { super.onCreate(); DynamicColors.applyToActivitiesIfAvailable(this); } }

       如果不需要整个应用生效

class MainActivity : AppCompatActivity() { private lateinit var binding: ActivityMainBinding override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) DynamicColors.applyIfAvailable(this) ...... }

       如果想要将原色为其他部分颜色

①color.xml

讯享网<resources> <color name="overlay_light_primary">#9C4146</color> <color name="overlay_light_onPrimary">#FFFFFF</color> <color name= "overlay_light_primaryContainer">#FFDADB</color> <color name="overlay_light_onPrimaryContainer">#</color> </resources >

②style.xml

<style name="AppTheme.Overlay" parent="ThemeOverlay.Material3.DynamicColors.Light"> <item name="colorPrimary">@color/overlay_light_primary</item> <item name="colorOnPrimary">@color/overlay_light_onPrimary</item> <item name="colorPrimaryContainer">@color/overlay_light_primaryContainer</item> <item name="colorOnPrimaryContainer">@color/overlay_light_onPrimaryContainer<item> </style>

③更换API

讯享网DynamicColors.applyToActivitiesIfAvailable(this, R.style.AppTheme_Overlay)

       若果应用中控件的颜色还是无法跟随系统改变颜色，还可以使用以下方法

style.xml中，将颜色取值改为@android:color/system_accent1_100

<style name="AppTheme.Overlay" parent="ThemeOverlay.Material3.DynamicColors.Light"> <item name="colorPrimary">@android:color/system_accent1_100</item> <item name="colorOnPrimary">@android:color/system_accent1_100</item> <item name="colorPrimaryContainer">@android:color/system_accent1_100</item> <item name="colorOnPrimaryContainer">@android:color/system_accent1_100<item> </style>

具体的色值选取，可以参考

讯享网<!-- Lightest shade of the accent color used by the system. White. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_0">#ffffff</color> <!-- Shade of the accent system color at 99% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_10">#F1FFFC</color> <!-- Shade of the accent system color at 95% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_50">#9CFFF2</color> <!-- Shade of the accent system color at 90% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_100">#8DF5E3</color> <!-- Shade of the accent system color at 80% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_200">#71D8C7</color> <!-- Shade of the accent system color at 70% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_300">#53BCAC</color> <!-- Shade of the accent system color at 60% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_400">#34A192</color> <!-- Shade of the accent system color at 49% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_500">#008375</color> <!-- Shade of the accent system color at 40% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_600">#006C5F</color> <!-- Shade of the accent system color at 30% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_700">#005747</color> <!-- Shade of the accent system color at 20% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_800">#003E31</color> <!-- Shade of the accent system color at 10% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_900">#002214</color> <!-- Darkest shade of the accent color used by the system. Black. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent1_1000">#000000</color> <!-- Lightest shade of the secondary accent color used by the system. White. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_0">#ffffff</color> <!-- Shade of the secondary accent system color at 99% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_10">#F0FFFC</color> <!-- Shade of the secondary accent system color at 95% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_50">#CDFAF1</color> <!-- Shade of the secondary accent system color at 90% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_100">#BFEBE3</color> <!-- Shade of the secondary accent system color at 80% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_200">#A4CFC7</color> <!-- Shade of the secondary accent system color at 70% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_300">#89B4AC</color> <!-- Shade of the secondary accent system color at 60% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_400">#6F9991</color> <!-- Shade of the secondary accent system color at 49% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_500">#537C75</color> <!-- Shade of the secondary accent system color at 40% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_600">#3D665F</color> <!-- Shade of the secondary accent system color at 30% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_700">#254E47</color> <!-- Shade of the secondary accent system color at 20% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_800">#0C3731</color> <!-- Shade of the secondary accent system color at 10% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_900">#00211C</color> <!-- Darkest shade of the secondary accent color used by the system. Black. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent2_1000">#000000</color> <!-- Lightest shade of the tertiary accent color used by the system. White. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_0">#ffffff</color> <!-- Shade of the tertiary accent system color at 99% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_10">#FFFBFF</color> <!-- Shade of the tertiary accent system color at 95% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_50">#F9EAFF</color> <!-- Shade of the tertiary accent system color at 90% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_100">#ECDBFF</color> <!-- Shade of the tertiary accent system color at 80% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_200">#CFBFEB</color> <!-- Shade of the tertiary accent system color at 70% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_300">#B3A4CF</color> <!-- Shade of the tertiary accent system color at 60% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_400">#988AB3</color> <!-- Shade of the tertiary accent system color at 49% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_500">#7B6E96</color> <!-- Shade of the tertiary accent system color at 40% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_600">#64587F</color> <!-- Shade of the tertiary accent system color at 30% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_700">#4C4165</color> <!-- Shade of the tertiary accent system color at 20% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_800">#352B4D</color> <!-- Shade of the tertiary accent system color at 10% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_900">#1E1636</color> <!-- Darkest shade of the tertiary accent color used by the system. Black. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_accent3_1000">#000000</color> <!-- Lightest shade of the neutral color used by the system. White. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_0">#ffffff</color> <!-- Shade of the neutral system color at 99% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_10">#fbfbfb</color> <!-- Shade of the neutral system color at 95% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_50">#f0f0f0</color> <!-- Shade of the neutral system color at 90% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_100">#e2e2e2</color> <!-- Shade of the neutral system color at 80% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_200">#c6c6c6</color> <!-- Shade of the neutral system color at 70% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_300">#ababab</color> <!-- Shade of the neutral system color at 60% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_400">#</color> <!-- Shade of the neutral system color at 49% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_500">#</color> <!-- Shade of the neutral system color at 40% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_600">#5e5e5e</color> <!-- Shade of the neutral system color at 30% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_700">#</color> <!-- Shade of the neutral system color at 20% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_800">#</color> <!-- Shade of the neutral system color at 10% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_900">#1b1b1b</color> <!-- Darkest shade of the neutral color used by the system. Black. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral1_1000">#000000</color> <!-- Lightest shade of the secondary neutral color used by the system. White. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_0">#ffffff</color> <!-- Shade of the secondary neutral system color at 99% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_10">#fbfbfb</color> <!-- Shade of the secondary neutral system color at 95% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_50">#f0f0f0</color> <!-- Shade of the secondary neutral system color at 90% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_100">#e2e2e2</color> <!-- Shade of the secondary neutral system color at 80% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_200">#c6c6c6</color> <!-- Shade of the secondary neutral system color at 70% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_300">#ababab</color> <!-- Shade of the secondary neutral system color at 60% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_400">#</color> <!-- Shade of the secondary neutral system color at 49% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_500">#</color> <!-- Shade of the secondary neutral system color at 40% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_600">#5e5e5e</color> <!-- Shade of the secondary neutral system color at 30% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_700">#</color> <!-- Shade of the secondary neutral system color at 20% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_800">#</color> <!-- Shade of the secondary neutral system color at 10% lightness. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_900">#1b1b1b</color> <!-- Darkest shade of the secondary neutral color used by the system. Black. This value can be overlaid at runtime by OverlayManager RROs. --> <color name="system_neutral2_1000">#000000</color> <!-- Accessibility shortcut icon background color --> <color name="accessibility_feature_background">#5F6368</color> <!-- Google grey 700 --> <color name="accessibility_magnification_background">#F50D60</color> <color name="accessibility_daltonizer_background">#00BCD4</color> <color name="accessibility_color_inversion_background">#546E7A</color>