美文网首页
iOS - iOS13的Dark Mode 暗模式的适配

iOS - iOS13的Dark Mode 暗模式的适配

作者: echo海猫 | 来源:发表于2021-04-18 16:57 被阅读0次

    "在macOS和iOS中,用户可以选择采用系统范围的明暗外观。深色外观被称为深色模式,实现了许多应用程序已经采用的界面风格。用户选择自己喜欢的美观,也可以根据环境照明条件或特定的时间表选择切换界面。"

    所以在iOS 13版本之后,需要支持界面中的暗模式,通过更新颜色、图像和行为,以便在黑暗模式处于活动状态时自动适应应用程序

    当前文字测试版本:
    Xcode:Version 12.4 (12D4e)
    iPhone:iOS 14.4.2
    语言:Swift
    模式:可通过手机直接操作查看具体的效果变化

    适配方案:

    1、颜色

    • 点击Assets.xcassets,点击底部的“+”,选择Color Set


      颜色适配
    • 生成了一个Color Set,自己起一个名字,点击右边的 Appereance,选择 Any,Light,Dark,然后根据不同的模式下,配置上不同的颜色即可,如下:

    Color Set
    • 在iOS开发使用需要适配的颜色时候,直接通过以下设置。
    • 在该处的可以在Swift的全局配置文件,将字体颜色和背景颜色分别确定好,提前配置好,然后在开发过程中直接使用即可
    //swiftDemoColor 就是你设置的Color Set
     self.view.backgroundColor = UIColor(named: "swiftDemoColor")
    

    2、图片

    • 和设置颜色相同,点击Assets.xcassets,点击底部的“+”,选择Image Set,配置 Appereance,在Any,Light,Dark下分别设置上自己的图片即可,这里不做赘述

    3、系统其他的操作:代码中

    • 通过下述代码可获取当前的模式
    UITraitCollection.current.userInterfaceStyle
    //
    //userInterfaceStyle 为UIUserInterfaceStyle的枚举样式,如下:
    //public enum UIUserInterfaceStyle : Int {
    //    case unspecified = 0
    //    case light = 1
    //    case dark = 2
    //}
    
    • UIViewController 监听当前系统的显示模式的改变方法,下面为具体的监听方法,可在基类中直接设置该监听,然后根据监听到的变化去设置想处理的界面
    override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
            super.traitCollectionDidChange(previousTraitCollection)
            if #available(iOS 13.0, *) {
                if self.traitCollection.hasDifferentColorAppearance(comparedTo: previousTraitCollection) {
                    if UITraitCollection.current.userInterfaceStyle == .dark {
                          //暗黑模式
                        self.view.backgroundColor = UIColor.black
                    } else {
                          //其他模式
                        self.view.backgroundColor = UIColor.white
                    }
                } else {
                    // Fallback on earlier versions
                }
            }
    }
    

    参考的网站:Apple Developer -> 文稿 -> 外观定制->支持界面的暗模式,跳转链接如下:
    苹果官网的指导适配暗模式的网站

    • 在切换了APP主题的时候,我们的界面UIViewController UIView都会有方法进行监听,重新绘制,可根据网站的的方法进行更新


      使用特定方法更新自定义视图

    相关文章

      网友评论

          本文标题:iOS - iOS13的Dark Mode 暗模式的适配

          本文链接:https://www.haomeiwen.com/subject/mcrvlltx.html