背景

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 {@Overridepublic void onCreate() {super.onCreate();DynamicColors.applyToActivitiesIfAvailable(this);}
}

如果不需要整个应用生效

class MainActivity : AppCompatActivity() {private lateinit var binding: ActivityMainBindingoverride 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">#400008</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">#909090</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">#757575</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">#464646</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">#303030</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">#909090</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">#757575</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">#464646</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">#303030</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>

Android12 ---- Material You 应用相关推荐

android12适配机型,OPPO率先适配安卓12版本
原标题:OPPO率先适配安卓12版本 5月19日凌晨,谷歌公布了Android12系统,而首批适配Android12的机型包括了华硕.Pixel.一加.OPPO.realme.夏普.传音.TCL.vi ...
android12.0(S) Launcher3 导入 AndroidStudio 调试编译
验证环境 aosp 12.0 源码,分支 android-12.0.0_r3 可以参考之前写的 android12.0(S) Pixel 3XL (QCOM 845) 编译刷机 AndroidStud ...
Android12 新特性及适配指南
Android 12(API 31)于2021年10月4日正式发布,正式版源代码也于当日被推送到AOSP Android开源项目.截止到笔者撰写这篇文章时,国内各终端厂商的在售Android设备,已经 ...
盘点 Material Design 3 最新设计规范
前言 2014 年 Google 发布了 Material Design(简称MD),成为了 Google 系产品统一的 UI 设计语言.时至今日 MD 已经有了两次大升级,2018年发布的 Mate ...
android theme material,Android Studio 换主题（Material Theme..）
1.去如下网址下载自己喜欢的主题文件xx.jar http://color-themes.com/?view=index 2. 导入方式下载主题-xxx.jar 注意:如果我们下载下来的jar名字如 ...
Creating Apps With Material Design —— Defining Custom Animations
转载请注明 http://blog.csdn.net/eclipsexys 翻译自Developer Android,时间仓促,有翻译问题请留言指出.谢谢定义动画在材料设计动画让用户与您的应用程序 ...
android5.0后新特性修改标题头,Android5.0中Material Design的新特性
Material Design简介 Material Design是谷歌新的设计语言,谷歌希望寄由此来统一各种平台上的用户体验,Material Design的特点是干净的排版和简单的布局,以此来突出 ...
创建Material Design风格的Android应用--使用Drawable
2019独角兽企业重金招聘Python工程师标准>>> 以下Drawables的功能帮助你在应用中实现Material Design: 图片资源着色在android 5.0(api ...
android md风格Switch,带有图标动画和颜色转换的Switch – material...
Material Animated Switch 一个MD风格的Switch,带有图标动画和颜色转换. 如何使用默认情况下显示收件箱锁定开关 android:id="@+id/pin&qu ...

Android12 ---- Material You 应用

背景

环境准备

对应方式

Android12 ---- Material You 应用相关推荐

最新文章

热门文章