苹果爸爸老是让人又爱又恨啊,今年的暗黑模式注定要让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地址,看一下效果。JXTheme Github地址api
经过给控件扩展命名空间属性theme
,相似于SnapKit
的snp
、Kingfisher
的kf
,这样能够将支持主题修改的属性,集中到theme
属性。这样比直接给控件扩展属性theme_backgroundColor
更加优雅。 核心代码以下:bash
view.theme.backgroundColor = ThemeProvider({ (style) in
if style == .dark {
return .white
}else {
return .black
}
})
复制代码
借鉴iOS13系统APIUIColor(dynamicProvider: <UITraitCollection) -> UIColor>)
。自定义ThemeProvider
结构体,初始化器为init(_ provider: @escaping ThemePropertyProvider<T>)
。传入的参数ThemePropertyProvider
是一个闭包,定义为:typealias ThemePropertyProvider<T> = (ThemeStyle) -> T
。这样就能够针对不一样的控件,不一样的属性配置,实现最大化的自定义。 核心代码参考第一步示例代码。服务器
对控件添加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> }
}
}
复制代码
为了在主题切换的时候,通知到支持主题属性配置的控件。经过在设置主题属性时,就记录目标控件。 核心代码就是第3步里面的这句代码:app
ThemeManager.shared.addTrackedObject(self.base, addedConfig: config)
复制代码
而后它会被记录到ThemeManager
的trackedHashTable
属性里面。由于trackedHashTable
是NSHashTable<AnyObject>.init(options: .weakMemory)
,经过弱引用记录控件,因此不存在内存问题。ide
经过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 ...
}
复制代码
DarkMode
;theme
命名空间属性:view.theme.xx = xx
。告别theme_xx
属性扩展用法;ThemeProvider
传入闭包配置。根据不一样的ThemeStyle
完成主题属性配置,实现最大化的自定义;ThemeStyle
可经过extension
自定义style,再也不局限于light
和dark
;customization
属性,做为主题切换的回调入口,能够灵活配置任何属性。再也不局限于提供的backgroundColor
、textColor
等属性;overrideThemeStyle
,会影响到其子视图;ThemeStyle
配置属性的常规封装、Plist文件静态加载、服务器动态加载示例;ThemeStyle
添加自定义styleThemeStyle
内部仅提供了一个默认的unspecified
style,其余的业务style须要本身添加,好比只支持light
和dark
,代码以下:
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文件加载配置的具体值,具体代码参加Example
的StaticSourceManager
类
与常规配置封装同样,只是该方法是从服务器加载配置的具体值,具体代码参加Example
的DynamicSourceManager
类
某些业务需求会存在一个控件有多种状态,好比选中与未选中。不一样的状态对于不一样的主题又会有不一样的配置。配置代码参考以下:
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()
}
复制代码
若是你的控件支持多个状态属性,好比有textColor
、backgroundColor
、font
等等,你能够不用一个一个的主题属性调用refresh
方法,可使用下面的代码完成全部配置的主题属性刷新:
func statusDidChange() {
statusLabel.theme.refresh()
}
复制代码
无论主题如何切换,overrideThemeStyleParentView
及其子视图的themeStyle
都是dark
overrideThemeStyleParentView.theme.overrideThemeStyle = .dark
复制代码
theme
命名空间属性,而不是使用theme_xx
扩展属性呢?Kingfisher
、SnapKit
等知名三方库,都使用了命名空间属性实现对系统类的扩展,这是一个更Swift
的写法,值得学习。extension Notification.Name {
public static let JXThemeDidChange = Notification.Name("com.jiaxin.theme.themeDidChangeNotification")
}
复制代码
ThemeManager
根据用户ID存储主题配置/// 配置存储的标志key。能够设置为用户的ID,这样在同一个手机,能够分别记录不一样用户的配置。须要优先设置该属性再设置其余值。
public var storeConfigsIdentifierKey: String = "default"
复制代码
当你的应用最低支持iOS13时,若是须要的话能够按照以下指南,迁移到系统方案。 迁移到系统API指南,点击阅读
最后再复习一下github地址,点击进入查看更多细节。JXTheme Github地址