iOS适配深色DarkMode模式

如题所述

第1个回答  2022-07-22

Apple 为了适配深色模式对 UIKit 中的 UIColor 进行了重新定义,例如将 .red , .blue .yellow 定义为 .systemRed .systemBlue .systemYellow ,这些新定义的 System Colors 在深色和浅色模式下表现为不同的颜色,具体的色值可以见苹果的 官方文档 。

对于一些需要进行文字显示的控件 Apple 也做了深色模式的适配, Apple 新加了 Semantic Colors 颜色方案,使用 Semantic Colors 时不需要纠结具体的值,只需要在合适的场景使用,例如当控件是 Label 时,在没有自定义字体颜色时,可以使用 .label 类型的的 Semantic Colors ,在浅色模式下显示黑色字体,在深色模式下显示白色字体; Semantic Colors 包括 .label .separator .link .systemBackground .systemFill

对于系统适配的以上深色模式下的颜色可以使用 SemanticUI 这个App进行查看,该 App 给出了二种模式下的系统颜色的对比:

当然在实际开发中很多情况下我们都是需要自定义颜色的,有幸的是 Apple 也给出了相应的方案,那就是通过 UIColor.init(dynamicProvider: @escaping (UITraitCollection) -> UIColor) 这个方法进行创建自定义的 semantic color

自动 iOS11 开始,可以在 Asset Catalogs 保存自定义颜色,并支持 Interface Builder code 二种方式使用,自定义的 color 目前也支持深色模式。打开 Assets.xcassets ,店家左下角的 + 号按钮新增一个 Color Set ,在 Any Appearence (浅色模式)和 Dark Appearence (深色模式)分别添加一种颜色即可。

Border colors 在当主题模式发生改变时并不会自动的进行适配,所以需要手动的进行处理,可以通过 traitCollectionDidChange(_:) 这个方法在进行处理:

图片资源同样支持深色模式,需要使用 Assets.xcassets ,新建一个 Assets.xcassets 并在 Attributes inspector 点击 Appearances 选择 Any , Dark ,然后分别为 Any Appearances Dark Appearances 配置响应的图片。

为了适配深色模式,无限的增加图片资源最终会导致包的大小会增加很多,为了减少包的体积,在非必要添加图片的情况下有以下二种方案:

或者:

使用:

现在支持深色模式的 App 都会提供浅色和深色模式的选择,同时支持跟谁系统自动切换,当用户选择相应模式后需要用 Userdefaults 保存用户的选择。

当保存了用户选择后同时需要更新当前 App 的显示:

当采用 Xcode 11 新建项目时会默认开启深色模式的,当没时间或者暂不支持深色模式时可以禁用掉,简单的方法时在 Info.plist 中添加一个 UIUserInterfaceStyle = Light ,也支持为某个 View 或者 ViewController 单独设置相应的模式,但是这种设置不会影响模态弹出的 VC 的模式。

相似回答