鸿蒙开发实战 Beta5.0版：基于原生能力的深色模式适配

场景描述

对于原生开发的应用，深色模式适配是开发过程中常见的业务场景，系统可以通过状态栏中的深色模式开关配置系统的颜色模式，当系统颜色模式方式变化时，应用经常会遇到如下的业务诉求：

场景一：跟随系统变化，感知系统颜色模式发生变化，无需重启应用，完成资源切换。

场景二：不跟随系统变化，应用固定使用某种颜色模式，不跟随系统颜色模式变化。

方案描述

场景一：跟随系统

效果

普通暗夜模式

方案

1.基于资源文件的组件颜色适配：

自定义两套颜色资源（resources/dark/element/color.json和resources/base/element/color.json），通过$r的方式加载颜色资源的key值。通过系统资源实现，开发者可直接使用的系统预置资源，即分层参数，同一资源ID在设备类型、深浅色等不同配置下有不同的取值。通过使用系统资源，不同的开发者可以开发出具有相同视觉风格的应用，不需要自定义2份颜色资源，在深浅色模式下也会自动切换成不同的颜色值。

2.基于媒体文件的图片资源适配：

HarmonyOS图标库链接： https://developer.huawei.com/consumer/cn/design/harmonyos-icon/

采用资源限定词目录的方式，自定义两套资源（resources/dark/media和resources/base/media），通过$r的方式加载颜色资源的key值。

对于 SVG 格式的一些简单图标，可以使用 fillColor 属性配合系统资源改变图片的绘制颜色。不通过两套图片资源的方式，也可以实现深浅色模式适配（补充：通过两套图片资源的方式也可以实现，修改svg图片中fill属性的颜色，然后将两张图片分别放置在不同的目录下）

3.页面状态栏的适配：

此处的代码要用到窗口的属性来设置状态栏图标的颜色，写在entry下（参考此章核心代码1）；值得一提的是，barContentColor并不支持使用$r的方式加载颜色资源的key值，它是一个string类型的，因此，这里的是不是暗夜模式就要开发者自己去写代码判断。

4.基于Web组件适配：

支持对前端页面进行深色模式