Android Studio深浅主题适配：矢量图标变色及配色分离疑问

前置原理说明 #

你新建项目默认使用Material Components主题框架，自动生成的深浅两套theme文件中，系统通用属性（比如textColorPrimary、colorOnSurface等）已经预设了不同色值。你布局内的文本默认引用了主题属性的颜色值，而非硬编码的固定色，所以深色模式下会自动匹配theme中对应属性的白色值，实现自动变色。
你之前的矢量图标没有自动变色，核心原因是图标颜色没有绑定主题属性，要么是硬编码了固定色值，要么没有使用主题属性做着色。

1. 矢量图标深浅主题适配方案 #

方案1（最推荐）：使用主题属性做着色 #

不需要修改矢量图标本身的文件，通过主题属性控制图标着色即可：

• 首先在res/values/attrs.xml中自定义图标颜色属性：

<attr name="iconNormalColor" format="color"/>

• 分别在浅色、深色theme文件中配置该属性的对应色值：
  浅色theme配置：

  <item name="iconNormalColor">@color/grey</item>
  

  深色theme配置：

  <item name="iconNormalColor">@color/white</item>
  

• 最后在布局的ImageView控件中添加tint属性绑定该主题属性：

  app:tint="?attr/iconNormalColor"
  

方案2：适配多份颜色配置 #

如果你需要把颜色写在矢量图标xml文件中，需要确保图标引用的色值做了深浅模式适配：

• 矢量图标内的path颜色不要硬编码十六进制色值，统一引用色值资源：android:fillColor="@color/icon_normal"
• 在res/values/colors.xml中配置浅色模式色值：<color name="icon_normal">#FF888888</color>
• 在res/values-night/colors.xml中配置深色模式色值：<color name="icon_normal">#FFFFFFFF</color>
  你之前新增夜间colors文件后未生效，大概率是矢量图标内依然使用了硬编码色值，或者引用的色值没有在夜间colors文件中做对应修改。

2. 深浅两套theme下是否必须拆分colors文件？ #

不需要强制拆分。

• 你完全可以把所有差异化颜色直接写在两套theme文件中，不需要单独创建夜间版colors.xml，比如直接在theme中写<item name="iconNormalColor">#FF888888</item>，一样可以生效。
• 拆分深浅两套colors文件是官方推荐的最佳实践，核心作用是方便色值统一管理，避免在多个theme、多个布局中重复写相同色值，后期调整颜色时只需要修改colors文件即可，不需要挨个修改各处的配置。

内容的提问来源于stack exchange，提问作者Jaloliddin