iOS13的暗黑模式来了,项目最低支持iOS9怎么办?

苹果爸爸老是让人又爱又恨啊,今年的暗黑模式注定要让iOS开发者折腾半天。可是也再次体现了iOS开发者的价值,iOS生态独特的特性和其不断的变化与进步,才让iOS开发者始终被人铭记,不会彻底被大前端和多端统一技术给淹没。从这个角度来讲,要感谢苹果爸爸😘前端

说回正题,iOS13的dark mode相关API只能在iOS13之后才能使用。可是大部分的项目都仍是会坚持支持老系统,以获取更多的用户。如今网上有许多关于iOS13 dark mode的适配文章,相关的技术点都很简单。主要的是字体颜色、图片的适配。看过以后,心里更加悲凉,iOS13 dark mode适配我都会了,老系统肿么办呢😂?git

你须要一个轻量级、api友好、高度自定义且最低支持iOS9+的换肤方案。别担忧!个人战友👬 ,让我为你推荐JXTheme方案,它主要借鉴了iOS13的暗黑模式适配API,使用JXTheme你会感到很是亲切。并且当你的应用最低支持iOS13时,能够方便的从JXTheme切换到系统API。github

Github地址

你们能够先进入github地址,看一下效果。JXTheme Github地址api

让咱们从整个暗黑模式适配的流程来熟悉JXTheme的原理:

1.如何优雅的设置主题属性

经过给控件扩展命名空间属性theme,相似于SnapKitsnpKingfisherkf,这样能够将支持主题修改的属性,集中到theme属性。这样比直接给控件扩展属性theme_backgroundColor更加优雅。 核心代码以下:bash

view.theme.backgroundColor = ThemeProvider({ (style) in
    if style == .dark {
        return .white
    }else {
        return .black
    }
})
复制代码

2.如何根据传入的style配置对应的值

借鉴iOS13系统APIUIColor(dynamicProvider: <UITraitCollection) -> UIColor>)。自定义ThemeProvider结构体,初始化器为init(_ provider: @escaping ThemePropertyProvider<T>)。传入的参数ThemePropertyProvider是一个闭包,定义为:typealias ThemePropertyProvider<T> = (ThemeStyle) -> T。这样就能够针对不一样的控件,不一样的属性配置,实现最大化的自定义。 核心代码参考第一步示例代码。服务器

3.如何保存主题属性配置闭包

对控件添加Associated object属性providers存储ThemeProvider。 核心代码以下:闭包

public extension ThemeWrapper where Base: UIView {
    var backgroundColor: ThemeProvider<UIColor>? {
        set(new) {
            if new != nil {
                let baseItem = self.base
                let config: ThemeCustomizationClosure = {[weak baseItem] (style) in
                    baseItem?.backgroundColor = new?.provider(style)
                }
                //存储在扩展属性providers里面
                var newProvider = new
                newProvider?.config = config
                self.base.providers["UIView.backgroundColor"] = newProvider
                ThemeManager.shared.addTrackedObject(self.base, addedConfig: config)
            }else {
                self.base.configs.removeValue(forKey: "UIView.backgroundColor")
            }
        }
        get { return self.base.providers["UIView.backgroundColor"] as? ThemeProvider<UIColor> }
    }
}
复制代码

4.如何记录支持主题属性的控件

为了在主题切换的时候,通知到支持主题属性配置的控件。经过在设置主题属性时,就记录目标控件。 核心代码就是第3步里面的这句代码:app

ThemeManager.shared.addTrackedObject(self.base, addedConfig: config)
复制代码

而后它会被记录到ThemeManagertrackedHashTable属性里面。由于trackedHashTableNSHashTable<AnyObject>.init(options: .weakMemory),经过弱引用记录控件,因此不存在内存问题。ide

5.如何切换主题并调用主题属性配置闭包

经过ThemeManager.changeTheme(to: style)完成主题切换,方法内部再调用被追踪的控件的providers里面的ThemeProvider.provider主题属性配置闭包。 核心代码以下:函数

public func changeTheme(to style: ThemeStyle) {
    currentThemeStyle = style
    self.trackedHashTable.allObjects.forEach { (object) in
        if let view = object as? UIView {
            view.providers.values.forEach { self.resolveProvider($0) }
        }
    }
}
private func resolveProvider(_ object: Any) {
    //castdown泛型
    if let provider = object as? ThemeProvider<UIColor> {
        provider.config?(currentThemeStyle)
    }else ...
}
复制代码

预览

preview

特性

  • 支持iOS 9+,让你的APP更早的实现DarkMode;
  • 使用theme命名空间属性:view.theme.xx = xx。告别theme_xx属性扩展用法;
  • 使用ThemeProvider传入闭包配置。根据不一样的ThemeStyle完成主题属性配置,实现最大化的自定义;
  • ThemeStyle可经过extension自定义style,再也不局限于lightdark;
  • 提供customization属性,做为主题切换的回调入口,能够灵活配置任何属性。再也不局限于提供的backgroundColortextColor等属性;
  • 支持控件设置overrideThemeStyle,会影响到其子视图;
  • 提供根据ThemeStyle配置属性的常规封装、Plist文件静态加载、服务器动态加载示例;

使用示例

扩展ThemeStyle添加自定义style

ThemeStyle内部仅提供了一个默认的unspecifiedstyle,其余的业务style须要本身添加,好比只支持lightdark,代码以下:

extension ThemeStyle {
    static let light = ThemeStyle(rawValue: "light")
    static let dark = ThemeStyle(rawValue: "dark")
}
复制代码

基础使用

view.theme.backgroundColor = ThemeProvider({ (style) in
    if style == .dark {
        return .white
    }else {
        return .black
    }
})
imageView.theme.image = ThemeProvider({ (style) in
    if style == .dark {
        return UIImage(named: "catWhite")!
    }else {
        return UIImage(named: "catBlack")!
    }
})
复制代码

自定义属性配置

view.theme.customization = ThemeProvider({[weak self] style in
    //能够选择任一其余属性
    if style == .dark {
        self?.view.bounds = CGRect(x: 0, y: 0, width: 30, height: 30)
    }else {
        self?.view.bounds = CGRect(x: 0, y: 0, width: 80, height: 80)
    }
})
复制代码

配置封装示例

JXTheme是一个提供主题属性配置的轻量级基础库,不限制使用哪一种方式加载资源。下面提供的三个示例仅供参考。

常规配置封装示例

通常的换肤需求,都会有一个UI标准。好比UILabel.textColor定义三个等级,代码以下:

enum TextColorLevel: String {
    case normal
    case mainTitle
    case subTitle
}
复制代码

而后能够封装一个全局函数传入TextColorLevel返回对应的配置闭包,就能够极大的减小配置时的代码量,全局函数以下:

func dynamicTextColor(_ level: TextColorLevel) -> ThemeProvider<UIColor> {
    switch level {
    case .normal:
        return ThemeProvider({ (style) in
            if style == .dark {
                return UIColor.white
            }else {
                return UIColor.gray
            }
        })
    case .mainTitle:
        ...
    case .subTitle:
        ...
    }
}
复制代码

主题属性配置时的代码以下:

themeLabel.theme.textColor = dynamicTextColor(.mainTitle)
复制代码

本地Plist文件配置示例

常规配置封装同样,只是该方法是从本地Plist文件加载配置的具体值,具体代码参加ExampleStaticSourceManager

根据服务器动态添加主题

常规配置封装同样,只是该方法是从服务器加载配置的具体值,具体代码参加ExampleDynamicSourceManager

有状态的控件

某些业务需求会存在一个控件有多种状态,好比选中与未选中。不一样的状态对于不一样的主题又会有不一样的配置。配置代码参考以下:

statusLabel.theme.textColor = ThemeProvider({[weak self] (style) in
    if self?.statusLabelStatus == .isSelected {
        //选中状态一种配置
        if style == .dark {
            return .red
        }else {
            return .green
        }
    }else {
        //未选中状态另外一种配置
        if style == .dark {
            return .white
        }else {
            return .black
        }
    }
})
复制代码

当控件的状态更新时,须要刷新当前的主题属性配置,代码以下:

func statusDidChange() {
    statusLabel.theme.textColor?.refresh()
}
复制代码

若是你的控件支持多个状态属性,好比有textColorbackgroundColorfont等等,你能够不用一个一个的主题属性调用refresh方法,可使用下面的代码完成全部配置的主题属性刷新:

func statusDidChange() {
    statusLabel.theme.refresh()
}
复制代码

overrideThemeStyle

无论主题如何切换,overrideThemeStyleParentView及其子视图的themeStyle都是dark

overrideThemeStyleParentView.theme.overrideThemeStyle = .dark
复制代码

其余说明

为何使用theme命名空间属性,而不是使用theme_xx扩展属性呢?

  • 若是你给系统的类扩展了N个函数,当你在使用该类时,进行函数索引时,就会有N个扩展的方法干扰你的选择。尤为是你在进行其余业务开发,而不是想配置主题属性时。
  • KingfisherSnapKit等知名三方库,都使用了命名空间属性实现对系统类的扩展,这是一个更Swift的写法,值得学习。

主题切换通知

extension Notification.Name {
    public static let JXThemeDidChange = Notification.Name("com.jiaxin.theme.themeDidChangeNotification")
}
复制代码

ThemeManager根据用户ID存储主题配置

/// 配置存储的标志key。能够设置为用户的ID,这样在同一个手机,能够分别记录不一样用户的配置。须要优先设置该属性再设置其余值。
public var storeConfigsIdentifierKey: String = "default"
复制代码

迁移到系统API指南

当你的应用最低支持iOS13时,若是须要的话能够按照以下指南,迁移到系统方案。 迁移到系统API指南,点击阅读

Github地址

最后再复习一下github地址,点击进入查看更多细节。JXTheme Github地址

相关文章
相关标签/搜索