IOS 暗黑模式适配---基础适配

前言

暗黑模式是苹果在ios13中提供系统风格。19年时候发布时苹果也没出强制要求适配的公告还有业务也没有太大的需求一直就没考虑适配的问题。前段时间,某大厂关于适配问题闹的沸沸扬扬。还以为苹果出了新公告,要求强制适配。于是就翻了公告列表也没有发现有强制适配的要求,查看了账号邮箱也没有类似的邮件,虚惊一场。
不过现在很多App开始适配暗黑模式,适配也应该做起来了。顺便整理了一份适配方案,主要分为两部分:一 是基础适配方案。二 项目通用化适配方案。

适配DarkMode

一 .图片适配

在Assets文件里图片资源文件属性选项Apperances,可以修改属性添加暗黑模式图片,并且不影响原有图片。苹果官方也提供了适配文档
在这里插入图片描述
适配效果图:
暗黑模式图片效果
浅色模式图片效果

二.颜色适配

1.系统动态色值

从 iOS13 开始UIColor是一个动态的颜色,在Light Mode和Dark Mode可以分别设置不同的颜色,系统提供了一些动态颜色。

self.textLabel.textColor = [UIColor systemGrayColor];

效果:
暗黑模式颜色效果
浅色模式颜色效果

2.定义颜色

ios13 UIColor 增加了自定颜色的方法。通过系统提供方法可以动态设置色值。

+ (UIColor *)colorWithDynamicProvider:(UIColor * (^)(UITraitCollection *))dynamicProvider API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchos);
- (UIColor *)initWithDynamicProvider:(UIColor * (^)(UITraitCollection *))dynamicProvider API_AVAILABLE(ios(13.0), tvos(13.0)) API_UNAVAILABLE(watchos);
   UIColor *labelColor = [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull trainCollection) {
           if ([trainCollection userInterfaceStyle] == UIUserInterfaceStyleLight) {
           //浅色模式
               return [UIColor blackColor];
           }
           else {
            //暗黑模式
               return [UIColor whiteColor];
           }
       }];
       
    self.textLabel.textColor = labelColor;

三. UITextField 适配

UITextField在暗黑模式下placeholder颜色很不友好。可以通过下面方法修改颜色

txtField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"请输入手机号码"attributes:@{NSForegroundColorAttributeName: [UIColor grayColor]}];

模式配置

一. 关闭暗黑模式

1.在Info.plist 文件中,添加 key 为 User Interface Style 类型String。
2.将UIUserInterfaceStyle key 的值设置为 Light。
在这里插入图片描述

二.关闭单页面暗黑模式

在ios13系统下UIViewcontroller与UIView有一个新的属性overrideUserInterfaceStyle
可以强制设置关闭暗黑模式的属性:UIUserInterfaceStyleLight

typedef enum UIUserInterfaceStyle : NSInteger {
	UIUserInterfaceStyleUnspecified
	//An unspecified interface style.
	UIUserInterfaceStyleLight
	//The light interface style.
	UIUserInterfaceStyleDark
	//The dark interface style.
} UIUserInterfaceStyle;

三.调试模式

1. 切换模式

模拟器环境切换模式有两种方法。
  • 在模拟器设置里:develop->Dark Appearance 开启关闭暗黑模式。
    在这里插入图片描述
  • 编译环境下修改,在 Debug ->View Debugging->Configure Environment Overrides. 可以在调试环境下动态开启关闭暗黑模式。

在这里插入图片描述
在这里插入图片描述

总结

以上适配方法总结了网上和官网文档的是方案。不过这只是基础适配方法,对于项目适配并不能说是一个合理的方案。毕竟一个完整的项目UI设计有很多个性设计,需要大量自定义修改颜色图片,使用系统色值的情况有时候并不多。个人认为暗黑模式的适配更多的是一种换肤模式,只不过切换场景交个了系统了。下一篇会总结自己项目的适配方案,更多的是通用化适配,减少不必要重复代码量的方法。

发布了16 篇原创文章 · 获赞 23 · 访问量 3万+

猜你喜欢

转载自blog.csdn.net/DARKSang/article/details/105366050