iOS-支持Dark Mode

发表于 2019-07-30 分类于教程

本文字数： 2.8k

经过多年的等待和期待，iOS13 终于支持本机Dark Mode！用户可以选择启用系统范围的深色外观，所有正式应用程序都将支持该外观。

概述

在应用中启用Dark Mode支持就像使用新的iOS13 SDK一样容易！使用最新的SDK时，iOS将自动更新系统控件，例如开关，表格视图和按钮。如我们所见，Apple还使开发人员可以轻松地添加Dark Mode支持。
但是，iOS不会自动切换图像或文本颜色，因此您可能会在Dark Mode下注意到很多与应用有关的问题。
尽管使用新的iOS13 SDK进行构建会自动更新系统控件，但Apple强烈建议所有开发人员检查并更新其应用程序，以确保在启用Dark Mode时所有文本和图像都能正确显示。
幸运的是，由于苹果在过去几年中对资产目录进行了许多改进，因此大多数iOS应用程序应该能够采用Dark Mode，而无需进行重大代码更改。

适配颜色

System Color

iOS13现在在UIColor中包括新的系统颜色，例如label颜色。通过使用iOS13中可用的新系统颜色，您的应用程序可以自动支持Dark Mode和高对比度模式。

1	label.color = UIColor.secondaryLabel

Custom Colors

尽管强烈建议您使用系统颜色来自动适应界面更改并确保各个应用程序之间的一致性，但是您可能希望在自定义颜色上支持深色模式。
使用iOS11的新资产目录颜色，可以通过添加自定义颜色的深色版本来轻松支持深色模式。
要添加资产目录颜色的深色版本，只需在目录中选择颜色，然后在“属性”检查器中将Appearances切换为Any，Dark。然后，添加颜色的深色外观版本。

就是这样-启用深色模式时，iOS会自动切换到资产目录颜色的深色版本，而您无需进行其他工作！

如果工程未使用资产目录颜色？
资产目录颜色使支持Dark Mode更加容易！请参阅Antoine van der Lee撰写的博客文章，详细了解如何使用资产目录颜色，如果您不希望切换，请参阅下面的以编程方式检测Dark Mode。

适配图片

虽然大多数图像在Dark Mode下看起来都不错，尤其是当您使用模板图像时，如果您将其放置在工作中以自动切换颜色（请参见上文的“适应颜色”），该图像会自动更改色调，但您可能希望Dark Mode下看某些图像具有不同的颜色。

与资产目录颜色一样，启用Dark Mode时自动切换资产目录中的图像很简单。要添加任何图像的深色版本，只需在目录中选择该图像，然后在“属性”检查器中将Appearances切换为Any，Dark。然后，只需添加图像的深色外观版本。

代码检测Dark Mode

在某些情况下，您需要以代码来检测外观变化并相应地更改用户界面。

⚠️警告：响应外观更改时，请确保尽快更新您的界面。不要执行与外观更改无关的任务，因为这可能会导致延迟，尤其是当用户从Control Center切换外观时。

override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
    super.traitCollectionDidChange(previousTraitCollection)

    let userInterfaceStyle = traitCollection.userInterfaceStyle // Either .unspecified, .light, or .dark
    // Update your user interface based on the appearance
}

通过在视图控制器上重写traitCollectionDidChange，检测外观变化很简单，只需访问视图控制器的traitCollection.userInterfaceStyle。
但是要记住，我们也要针对其他情况更改（例如设备旋转）调用traitCollectionDidChange。您可以使用此新方法检查当前外观是否不同：

override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
    super.traitCollectionDidChange(previousTraitCollection)

    let hasUserInterfaceStyleChanged = previousTraitCollection.hasDifferentColorAppearance(comparedTo: traitCollection) // Bool
    // Update your user interface based on the appearance
}

如果要从任何地方访问当前特征集，也可以使用UITraitCollection.current。

重写 User Interface Style

全局控制

系统会自动在与iOS13或更高版本的SDK链接的任何应用中选择采用浅色和深色外观。如果您需要更多时间来处理应用程序的Dark Mode支持，或者希望将应用保持单一样式，则可以通过在应用的Info.plist文件中添加UIUserInterfaceStyle键（值为Light或Dark）来控制。设置此键会导致系统忽略用户的偏好，并始终将特定外观应用于您的应用。

⚠️Note️注意：强烈建议支持深色模式。在改进应用程序的Dark Mode支持时，请使用UIUserInterfaceStyle键暂时停用。

特定页面

在iOS13中，您现在可以在特定视图或视图控制器上重写User Interface Style。例如，您可能只希望某个视图控制器处于Dark Mode，而应用程序的其余部分处于Light模式。
要覆盖用户界面样式，只需在顶视图或视图控制器中覆盖此变量，它将向下传播到子视图：

// Inside a UIViewController
override func viewDidLoad() {
    super.viewDidLoad()

    // Always adopt a dark interface style.    
    overrideUserInterfaceStyle = .dark
}

打印切换信息

Edit Scheme -> Run -> Arguments -> Arguments Passed On Launch
加入

1	-UITraitCollectionChangeLoggingEnabled YES

总结

在文章中，我们探讨了如何使您的应用在iOS13的Dark Mode中看起来更漂亮，以及如何调整图像，颜色和自定义用户界面元素以匹配新样式。
我迫不及待想看到肯定会在秋天出现的所有出色的Dark Mode应用程序！
本文所有信息全部摘自WWDC