iOS 深色模式适配

要求：iOS13.0以上

重点：需要所有界面进行适配，工作量巨大，需要从项目开始就进行适配；H5界面无法进行适配

 

实现方式：System Colors（常用）、Semantic Colors（常用）、Dynamic Colors（常用）、Asset Catalog、Border colors、Dynamic Images

 

1.System Colors：

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

 

2.Semantic Colors：

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

 

3.Dynamic Colors（自定义颜色）：

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

 

为系统类UIColor写一个扩展

public extension UIColor {

    static func | (lightMode: UIColor, darkMode: UIColor) -> UIColor {

        guard #available(iOS 13.0, *) else { return lightMode }

        return UIColor { (traitCollection) -> UIColor in

            return traitCollection.userInterfaceStyle == .light ? lightMode : darkMode

        }

    }

}

 

 

4.Asset Catalog：

在asset里面预先保存自定义颜色，在Any Appearence（浅色模式）和Dark Appearence（深色模式）分别添加一种颜色即可。一般用于高度重复的颜色，比如主题色等，需要UI高度统一颜色标准。

支持代码使用：view.backdroundcolor = Color(named: “自定义颜色名”)

 

5.Border colors：

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

override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {

    super.traitCollectionDidChange(previousTraitCollection)

    traitCollection.hasDifferentColorAppearance(comparedTo: traitCollection) {

        layer.backgroundColor = UIColor.layer.cgColor

    }

}

 

6.Dynamic Images：

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

后台返回图片时需要自己用代码创建Assets。

尽量不要使用图片，无限的增加图片资源最终会导致包的大小会增加很多。

可以tintColor或者反转图片颜色解决改变图片颜色问题

 

原文链接：https://www.cnblogs.com/laorenyuhail/p/17266138.html