iOS 13 黑暗模式(Dark Mode)的适配
2020-05-18 本文已影响0人
PersonChen_QJ
正文
记录适配黑暗模式中的注意点,若有不足和错误请指导,谢谢
目录
- 什么是黑暗模式,是否需要强制适配
- 如何获取当前模式,如何监听模式的切换
- 如何适配颜色
- 如何适配图片
- 如何适配状态栏
- 总结
1. 什么是黑暗模式,是否需要强制适配
- 1.1 黑暗模式是iOS 13 推出的一种新的视觉效果,方便用户在夜里使用应用。再黑暗模式下,耗电量更低(拒说)。
- 1.2 目前不需要强制适配。
- 1.3 如果不需要适配,又不想影响我们的应用,可以禁止使用深色模式,或者指定我们的界面为某个固定模式
1. 全局设置指定模式
在App内禁用深色模式: 可以在Info.plist(全局) 中,设置 User Interface Style 为 Light。
2. 单界面指定某一固定模式
if (@available(iOS 13.0, *)) {
//在单个页面内禁用深色模式使用overrideUserInterfaceStyle:
self.view.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
//在单个页面内禁用浅色模式使用overrideUserInterfaceStyle:
self.view.overrideUserInterfaceStyle = UIUserInterfaceStyleDark;
}
2. 如何获取当前模式,如何监听模式的切换
- 2.1 获取当前模式
//获取当前模式
if (@available(iOS 13.0, *)) {
UIUserInterfaceStyle mode = self.traitCollection.userInterfaceStyle;
if (mode == UIUserInterfaceStyleDark) {
NSLog(@"深色模式");
} else if (mode == UIUserInterfaceStyleLight) {
NSLog(@"浅色模式");
} else {
NSLog(@"未知模式");
}
}
- 2.2 获取模式切换监听
- 监听系统模式的变化,需要我们在需要监听的Conttoller中,重写- (void)traitCollectionDidChange:(UITraitCollection *)previousTraitCollection方法
- (void)traitCollectionDidChange:(UITraitCollection *)previousTraitCollection{
NSLog(@"traitCollectionDidChange");
[super traitCollectionDidChange:previousTraitCollection];
// 注意:参数为变化前的traitCollection
// 判断模式是否一样
if (@available(iOS 13.0, *)) {
if ([self.traitCollection hasDifferentColorAppearanceComparedToTraitCollection:previousTraitCollection]) {//模式发生了变化
}
}
}
- 2.3 当再一个UIViewController监听变化时,会调用
-(void)viewWillLayoutSubviews{
}
-(void)viewDidLayoutSubviews{
}
-(void)updateViewConstraints{
}
- 2.4 当再UIView中时
-(void)drawRect:(CGRect)rect{
}
-(void)layoutSubviews{
}
-(void)updateConstraints{
}
-(void)tintColorDidChange{
}
3. 颜色适配
- 3.1 再UIColor类,新增了2个方法。用来定义一个可供切换的动态颜色,当模式发生变化时,使用该颜色的控件会发生颜色变化。
/* Create a dynamic color with a provider.
* When methods are called on this color that need color component values,
* the provider is called with UITraitCollection.currentTraitCollection.
* The provider should use that trait collection to decide a more fundamental UIColor to return.
* As much as possible, use the given trait collection to make that decision, not other state.
*/
+ (UIColor *)colorWithDynamicProvider:(UIColor * (^)(UITraitCollection *traitCollection))dynamicProvider API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchos);
- (UIColor *)initWithDynamicProvider:(UIColor * (^)(UITraitCollection *traitCollection))dynamicProvider API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchos);
- 例如,我设置界面的背景颜色,当模式发生变化时,页面颜色会跟着变
//颜色适配
if (@available(iOS 13.0, *)) {
UIColor *viewColor = [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull traitCollection) {
if (traitCollection.userInterfaceStyle == UIUserInterfaceStyleLight) {
return [UIColor redColor];
}else if (traitCollection.userInterfaceStyle == UIUserInterfaceStyleDark){
return [UIColor greenColor];
}else{
return [UIColor orangeColor];
}
}];
self.view.backgroundColor = viewColor;
}
4. 图片适配
4.1 打开Assets.xcassets,点击已存在的一张图片(如果没有新建一个Image Set),打开右侧的工具栏,找到Appearances,按照自己的需求选择场景
4.2 选择后,再对应的模式放上对应的图片即可
4.3 调用
[UIImage imageNamed:@"xxxx"]
5. 状态栏适配
- 5.1 iOS 12 状态栏只有2种状态
UIStatusBarStyleDefault 文字黑色
UIStatusBarStyleLightContent 文字白色
- 5.2 iOS 13 状态栏新增一种状态
UIStatusBarStyleDefault 自动选择黑色或白色
UIStatusBarStyleDarkContent 文字黑色
UIStatusBarStyleLightContent 文字白色
5.3 使用
- 当模式为Light 时,状态栏为: UIStatusBarStyleDarkContent
- 当模式为Dark 时,状态栏为: UIStatusBarStyleDarkContent
- 当为指定时,状态栏为: UIStatusBarStyleDefault
6. 总结
- 6.1 需要监听模式之间的切换,来实现不同模式下的不同场景
- 6.2 颜色适配需要使用动态颜色来定义,这样开发者就不用再模式切换时再去重新设置控件对应的颜色,颜色需要对应2种色值,我自己项目中使用plist文件来管理。
- 6.3 图片适配需要编辑 Image Set 的 Appearances。然后放入对应的图片
结尾
可能也没什么了。写的不是很好,大家凑合着看,有问题欢迎指出,谢谢!