iOS 13 黑暗模式(Dark Mode)的适配

正文

记录适配黑暗模式中的注意点，若有不足和错误请指导，谢谢

目录

• 1. 什么是黑暗模式,是否需要强制适配
• 2. 如何获取当前模式，如何监听模式的切换
• 3. 如何适配颜色
• 4. 如何适配图片
• 5. 如何适配状态栏
• 6. 总结

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。然后放入对应的图片

结尾

可能也没什么了。写的不是很好，大家凑合着看，有问题欢迎指出，谢谢！