博客> iOS 13 DarkModel适配(一)
iOS 13 DarkModel适配(一)
2019-11-13 09:22 评论:0 阅读:160 lvhahaha
ios model Dark 暗夜模式

iOS 13终于引来了暗黑模式。 首先下载Xcode 11,配置 iOS13,在你 模拟器中 在“设置”-“开发者”中打开“Dark Appearance”后,你的项目就自动运行在暗黑模式了。

iOS 13 DarkModel 模式设置

还没适配完又不想给用户看,可以先暂时全局关闭暗黑模式: 在 Info.plist 文件中,添加 key 为 User Interface Style,类型为 String,value 设置为 Light 即可。

注意 如果使用 xcode 10 版本提交审核的app 不要带此属性!!!

overrideUserInterfaceStyle 新属性,可设置某个页面是否开启 暗夜模式

在 iOS 13中,UIView、UIViewController 、UIWindow 有了一个 overrideUserInterfaceStyle 的新属性,可以覆盖系统的模式。

单个页面或视图关闭暗黑模式,设置 overrideUserInterfaceStyle 为对应的模式,强制限制该视图与其子视图以设置的模式进行展示,不跟随系统模式改变进行改变。

self.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;

设置此属性会影响当前view/viewController/window 以及它下面的任何内容。

如果你希望一个子视图监听系统的模式,请将 overrideUserInterfaceStyle 属性设置为.unspecified。

iOS 13 模式颜色适配

1、系统颜色

在 iOS 13中,苹果引入了全新系统颜色,系统颜色是动态的,会根据当前系统是默认模式还是暗黑模式动态调整颜色。

苹果还提供了一组动态的灰度颜色。

2、语义化颜色

苹果提供了一套根据颜色使用目的而约定颜色命名的语义化颜色。语义化颜色也是动态颜色。

例如系统背景色(SystemBackground)、分割线颜色(SeparatorColor)等等,使用语义化颜色确保你的 App 具有和系统应用高度类似的配色风格。通过使用语义化颜色,可以让你的 App 更加贴近原生体验,这是官方希望达到的最佳体验。

3、自定义颜色:通过 Assets 配置

在 iOS 11和 Xcode 9 中,我们可以在 Images.xcassets 中添加颜色。

现在我们可以为颜色再配置一个用于暗黑模式的对应的颜色。

 4113217-ffde5adf5e6e87a0.png

4、通过代码自定义颜色

UIColor 有两个新方法。

  • (UIColor )colorWithDynamicProvider:(UIColor (^)(UITraitCollection *))dynamicProvider;
    • (UIColor )initWithDynamicProvider:(UIColor (^)(UITraitCollection *))dynamicProvider;

iOS 13 提供了的新方法,可以在 block 中判断 traitCollection.userInterfaceStyle,根据系统模式设置返回的颜色。

+(UIColor )generateDynamicColor:(UIColor )lightColor darkColor:(UIColor )darkColor{ if (@available(iOS 13.0, )) { UIColor dyColor = [UIColor colorWithDynamicProvider:^UIColor _Nonnull(UITraitCollection * _Nonnull traitCollection) { if (traitCollection.userInterfaceStyle == UIUserInterfaceStyleLight) { return lightColor; }else { return darkColor; } }]; return dyColor; }else{ return lightColor; } }

图片 适配

只介绍一种可推荐使用的方式: 就是和自定义颜色相同的方法,在 Images.xcassets 中配置不同模式下的图片。

 4113217-c4685c745d20b28b.png

在 Images.xcassets 中设置颜色和图片是向下兼容的,iOS 13 以下的系统会默认取Any状态下的设定,iOS 13 会根据系统模式取Any或Dark下的设定。

不同界面 dark mode调试 (XIB 模式)

 4113217-799f576fe9ed1d1f.JPG

可设置本XIB 页面的 模式,进行预览。

下篇写Dark Model 显示控件的适配吧。

参考: https://www.fivestars.blog/code/ios-dark-mode-how-to.html https://www.jianshu.com/p/af9ab7a33e8f

show me the code :1 https://github.com/darkdong/DarkModel 2 https://github.com/YanShby/DarkMode-Demo

收藏
1
sina weixin mail 回到顶部