官方文檔 有興趣的可以康康
Supporting Dark Mode in Your Interface
Providing Images for Different Appearances
系統(tǒng)預(yù)設(shè)顏色
雖然系統(tǒng)有自帶暗黑模式的顏色，但是吧，但凡稍微有個活著的UI，咱也別顯著這么寒磣不是。但還是放出來給大家康康叭，跟一般的[UIColor redColor]/.red一個用法。
使用系統(tǒng)預(yù)設(shè)定好的顏色類型。示例如下：
button.setTitleColor(.label, for: .normal)
button.backgroundColor = .systemBackground
OC:
@property (class, nonatomic, readonly) UIColor *systemBrownColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *systemIndigoColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *systemGray2Color API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemGray3Color API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemGray4Color API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemGray5Color API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemGray6Color API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *labelColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *secondaryLabelColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *tertiaryLabelColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *quaternaryLabelColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *linkColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *placeholderTextColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *separatorColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *opaqueSeparatorColor API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchOS);
@property (class, nonatomic, readonly) UIColor *systemBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *secondarySystemBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *tertiarySystemBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemGroupedBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *secondarySystemGroupedBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *tertiarySystemGroupedBackgroundColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *systemFillColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *secondarySystemFillColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *tertiarySystemFillColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
@property (class, nonatomic, readonly) UIColor *quaternarySystemFillColor API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(tvos, watchOS);
Swift: 參考OC
項目中實用的方法
- 在工具類定義iOS13暗黑顏色適配的方法
OC:
// MARK: - iOS 13 暗黑模式顏色適配
func ios13ColorWithDark(_ darkColor: UIColor, _ defaultColor:UIColor) -> UIColor {
if #available(iOS 13.0, *) {
let colorDynamic = UIColor.init { (traitCollection) -> UIColor in
if (traitCollection.userInterfaceStyle == .dark) {
return darkColor
} else {
return defaultColor
}
}
return colorDynamic
}
return defaultColor
}
Swift:
// MARK: - iOS 13 暗黑模式顏色適配
func ios13ColorWithDark(_ darkColor: UIColor, _ defaultColor:UIColor) -> UIColor {
if #available(iOS 13.0, *) {
let colorDynamic = UIColor.init { (traitCollection) -> UIColor in
if (traitCollection.userInterfaceStyle == .dark) {
return darkColor
} else {
return defaultColor
}
}
return colorDynamic
}
return defaultColor
}
- 判斷是否是暗黑模式
OC:
if (@available(iOS 13.0, *)) {
// 判斷是否是暗黑模式
BOOL isDark = (self.traitCollection.userInterfaceStyle == UIUserInterfaceStyleDark);
if (isDark) {
}
}
Swift:
if #available(iOS 13.0, *) {
// 判斷是否是暗黑模式
let isDark = self.traitCollection.userInterfaceStyle == .dark
if (isDark) {
}
}
- 如果碰到 Light Mode 和 Dark Mode 相互切換設(shè)置的顏色不起作用，需要在監(jiān)聽模式切換的指定方法，另外進(jìn)行設(shè)置。
OC:
- (UITraitCollection *)traitCollection{
}
Swift:
override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
}
- 關(guān)于顏色
通過 Assets.xcassets -> 添加 New Color Set ，設(shè)置 Appearances 為自己所需要的類型，進(jìn)行 light 和 dark 模式下不同的顏色設(shè)置，即可使用。示例代碼如下：
button.backgroundColor = UIColor.init(named: "ColorBackground")
image.png
或者純代碼定義
OC:
if (@available(iOS 13.0, *)) {
UIColor *dynamicColor = [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trainCollection) {
if ([trainCollection userInterfaceStyle] == UIUserInterfaceStyleLight) {
return [UIColor greenColor];
}
else {
return [UIColor blueColor];
}
}];
[self.view.backgroundColor setBackgroundColor:dynamicColor];
}
Swift:
if #available(iOS 13.0, *) {
let dynamicColor = UIColor.init { (trainCollection) -> UIColor in
if self.traitCollection.userInterfaceStyle == .light {
return .green
} else {
return .blue
}
}
self.view.backgroundColor = dynamicColor
}
- 關(guān)于圖片
在 Assets .xcassets 里，可以創(chuàng)建New Image Set，根據(jù)需要對圖片進(jìn)行命名和設(shè)置即可。示例代碼如下：
imageView.image = UIImage.init(named: "LOrDImage")
image.png
其他代碼參照第四點。
設(shè)置 Light/Dark 模式
如果需要單獨設(shè)置展示模式，不跟隨系統(tǒng)設(shè)置變化的話～
// Always adopt a light interface style.
overrideUserInterfaceStyle = .light
模擬器設(shè)置暗黑模式測試
設(shè)置->Developer(開發(fā)者)->Dark Appearance
通過指定方法去更新自定義視圖
當(dāng)用戶更改系統(tǒng)外觀時，系統(tǒng)會自動要求每個窗口和視圖重新繪制。蘋果官方建議，在這些指定的方法去修改顏色，因為如果在創(chuàng)建時設(shè)置 layer 的顏色之類的，會因為 CGColorRef 對象不適應(yīng)而不發(fā)生改變，創(chuàng)建時設(shè)置背景顏色什么倒是可以的。示例如下：
override func viewWillLayoutSubviews() {
super.viewWillLayoutSubviews()
label.layer.borderWidth = 2
label.layer.borderColor = UIColor.init(named: "LabelBorder")?.cgColor
}
1585647459360.jpg
