成熟的夜间模式

成熟的夜间模式

从开始写DKNightVersion这个框架到现在已经将近一年了,目前整个框架的设计也趋于稳定。

其实夜间模式的实现就是相当于多主题加颜色管理。而最新版本的DKNightVersion已经很好的解决了这个问题。

在正式介绍目前版本的实现之前,我会先简单介绍一下 1.0 时代的 DKNightVersion 的实现,为各位读者带来一些新的思路,也确实想梳理一下这个框架是如何演变的。

我们会以对backgroundColor为例说明整个框架的工作原理。

方法调剂的版本

如何在不改变原有的架构,甚至不改变原有的代码的基础上,为应用优雅地添加夜间模式成为很多开发者不得不面对的问题。这也是 1.0 时代的 DKNightVersion 想要实现的目标。

其核心思路就是使用方法调剂修改backgroundColor的存取方法

使用 nightBackgroundColor

在思考之后,我想到,想要在不改动原有代码的基础上实现夜间模式只能通过在分类中添加nightBackgroundColor属性,并且使用方法调剂改变backgroundColor的 setter 方法。

-(void)hook_setBackgroundColor:(UIColor*)backgroundColor{if([DKNightVersionManager currentThemeVersion]==DKThemeVersionNormal){[selfsetNormalBackgroundColor:backgroundColor];}[selfhook_setBackgroundColor:backgroundColor];}

在当前主题为DKThemeVersionNormal时,将颜色保存至normalBackgroundColor中,然后再调用原backgroundColor的 setter 方法,更新视图的颜色。

DKNightVersionManager

这里只解决了颜色设置的问题,下面会说明,如果在主题改变时,实时更新颜色,而不用重新进入当前页面。

整个 DKNightVersion 都是由一个DKNightVersionManager的单例来管理的,而它的主要工作就是负责改变应用的主题、并在主题改变时通知其它视图更新颜色

-(void)changeColor:(id)object{if([object respondsToSelector:@selector(changeColor)]){[object changeColor];}if([object respondsToSelector:@selector(subviews)]){if(![object subviews]){// Basic case, do nothing.return;}else{for(id subviewin[object subviews]){// recursive darken all the subviews of current view.[selfchangeColor:subview];if([subview respondsToSelector:@selector(changeColor)]){[subview changeColor];}}}}}

如果主题更新,那么就会递归地调用changeColor方法,刷新全部的视图颜色,而这个方法的实现比较简单:

-(void)changeColor{if([DKNightVersionManager currentThemeVersion]==DKThemeVersionNormal){self.backgroundColor=self.normalBackgroundColor;}else{self.backgroundColor=self.nightBackgroundColor;}}

上面就是整个框架在 1.0 版本时的实现思路。不过这个版本的 DKNightVersion 在实际应用中会有比较多的问题:

在高速滚动的scrollView上面来回切换夜间模式,会出现颜色错乱的问题

由于对backgroundColor属性进行不合适的方法调剂,其行为无法预测,比如:在设置颜色后,再取出,不一定与设置时传入的颜色相同

无法适配第三方 UI 控件

使用色表的版本

为了解决 1.0 中的各种问题,我决定在 2.0 版本中放弃对nightBackgroundColor的使用,并且重新设计底层的实现,转而使用更为稳定安全的方法实现夜间模式,先看一下效果图:

新的实现不仅能够支持夜间模式,而且能够支持多主题。

DKColorPicker

与上一个版本实现上的不同,在 2.0 中删除了全部的nightBackgroundColor,使用一个名为dk_backgroundColorPicker的属性取代它。

@property(nonatomic,copy)DKColorPicker dk_backgroundColorPicker;

这个属性其实就是一个 block,它接收参数DKThemeVersion *themeVersion,但是会返回一个UIColor *:

在第一次传入 picker 或者每次主题改变时,都会将当前主题DKThemeVersion传入 picker 并执行,然后,将得到的UIColor赋值给对应的属性backgroundColor更新视图颜色。

typedefUIColor*(^DKColorPicker)(DKThemeVersion*themeVersion);

比如下面使用DKColorPickerWithRGB创建一个临时的DKColorPicker:

在DKThemeVersionNormal时返回0xffffff

在DKThemeVersionNight时返回0x343434

在自定义的主题下返回0xfafafa(这里的顺序与色表中主题的顺序有关)

cell.dk_backgroundColorPicker=DKColorPickerWithRGB(0xffffff,0x343434,0xfafafa);

同时,每一个对象还持有一个pickers数组,来存储自己的全部DKColorPicker:

@interfaceNSObject()@property(nonatomic,strong)NSMutableDictionary*pickers;@end

在第一次使用这个属性时,当前对象注册为DKNightVersionThemeChangingNotificaiton通知的观察者。

在每次收到通知时,都会调用night_update方法,将当前主题传入DKColorPicker,并再次执行,并将结果传入对应的属性[self performSelector:sel withObject:result]。

-(void)night_updateColor{[self.pickers enumerateKeysAndObjectsUsingBlock:^(NSString*_Nonnull selector,DKColorPicker  _Nonnull picker,BOOL*_Nonnull stop){SEL sel=NSSelectorFromString(selector);id result=picker(self.dk_manager.themeVersion);[UIView animateWithDuration:DKNightVersionAnimationDuration                        animations:^{#pragma clang diagnostic push#pragma clang diagnostic ignored "-Warc-performSelector-leaks"[selfperformSelector:sel withObject:result];#pragma clang diagnostic pop}];}];}

也就是说,在每次改变主题的时候,都会发出通知。

DKColorTable

虽然我们在上面临时创建了一些DKColorPicker。不过在DKNightVersion中,我更推荐使用色表,来减少相同的DKColorPicker的创建,并且能够更好地管理整个应用中的颜色:

NORMAL  NIGHT    RED#ffffff  #343434  #fafafa BG#aaaaaa  #313131  #aaaaaa SEP#0000ff  #ffffff  #fa0000 TINT#000000#ffffff  #000000TEXT#ffffff  #444444  #ffffff BAR

上面就是默认色表文件DKColorTable.txt中的内容,其中,第一行表示主题,NORMAL主题必须存在,而且必须为第一列,而最右面的BG、SEP就是对应DKColorPicker的 key。

self.tableView.dk_backgroundColorPicker=DKColorPickerWithKey(BG);

在使用时,上面的代码就相当于返回了一个在NORMAL时返回#ffffff、NIGHT时返回#343434以及RED时返回#fafafa的DKColorPicker。

pickerify

虽然说,我们使用色表以及DKColorPicker解决了,但是,到目前为止我们还没有解决第三方框架的问题。

比如我们使用了某个第三方框架,或者自己添加了某个color属性,比如说:

@interfaceDKView()@property(nonatomic,strong)UIColor*weirdColor;@end

weirdColor并没有对应的DKColorPicker,但是,我们可以通过pickerify在想要使用dk_weirdColorPicker的地方生成这个对应的 picker:

@pickerify(DKView,weirdColor);

然后,我们就可以使用dk_weirdColorPicker属性了:

view.dk_weirdColorPicker=DKColorPickerWithKey(BG);

pickerify其实是一个宏:

#define pickerify(KLASS, PROPERTY) interface \

KLASS (Night) \

@property (nonatomic, copy, setter = dk_set ## PROPERTY ## Picker:) DKColorPicker dk_ ## PROPERTY ## Picker; \

@end \

@interface \

KLASS () \

@property (nonatomic, strong) NSMutableDictionary *pickers; \

@end \

@implementation \

KLASS (Night) \

- (DKColorPicker)dk_ ## PROPERTY ## Picker { \

return objc_getAssociatedObject(self, @selector(dk_ ## PROPERTY ## Picker)); \

} \

- (void)dk_set ## PROPERTY ## Picker:(DKColorPicker)picker { \

objc_setAssociatedObject(self, @selector(dk_ ## PROPERTY ## Picker), picker, OBJC_ASSOCIATION_COPY_NONATOMIC); \

[self setValue:picker(self.dk_manager.themeVersion) forKeyPath:@keypath(self, PROPERTY)];\

[self.pickers setValue:[picker copy] forKey:_DKSetterWithPROPERTYerty(@#PROPERTY)]; \

} \

@end

这个宏根据传入的类和属性名,为我们生成了对应picker的存取方法,它也可以说是一种元编程的手段。

这里生成的 setter 方法不是标准意义上的驼峰命名法dk_setweirdColorPicker:,因为我不知道怎么才能让大写首字母之后的属性添加到这里(如果各位读者有解决方案,欢迎提 PR 或者 issue)。

嵌入式 Ruby

由于框架中很多的代码,都是重复的,所以在这里使用了嵌入式 Ruby 模板来生成对应的文件color.m.irb:

////  <%= klass.name %>+Night.m//  <%= klass.name %>+Night////  Copyright (c) 2015 Draveness. All rights reserved.////  These files are generated by ruby script, if you want to modify code//  in this file, you are supposed to update the ruby code, run it and//  test it. And finally open a pull request.#import "<%= klass.name %>+Night.h"#import "DKNightVersionManager.h"#import @interface<%=klass.name%>()@property(nonatomic,strong)NSMutableDictionary*pickers;@end@implementation<%=klass.name%>(Night)<%klass.properties.eachdo|property|%><%="""-(DKColorPicker)dk_#{property.name}Picker{returnobjc_getAssociatedObject(self,@selector(dk_#{property.name}Picker));}-(void)dk_set#{property.cap_name}Picker:(DKColorPicker)picker{objc_setAssociatedObject(self,@selector(dk_#{property.name}Picker),picker,OBJC_ASSOCIATION_COPY_NONATOMIC);self.#{property.name}=picker(self.dk_manager.themeVersion);[self.pickers setValue:[picker copy]forKey:@\"#{property.setter}\"];}"""%><%end%>@end

这部分的实现并不在这篇文章的讨论范围之内,如果,对这部分看兴趣,可以看一下仓库中的generator文件夹,其中包含了代码生成器的全部代码。

小结

如果你对 DKNightVersion 的使用有兴趣,可以查看仓库的README文件,有人会说不要在项目中 ObjC runtime,我个人觉得是没有问题,AFNetworking、BlocksKit也使用方法调剂来改变原有方法的实现,不能因为它强大就不使用它;正相反,有时候,使用 runtime 才能优雅地解决问题。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349

推荐阅读更多精彩内容