SDTheme 0.1.0

SDTheme 0.1.0

SDTheme 维护。



SDTheme 0.1.0

  • 作者:
  • maligh 和 culeo

SDTheme

Build Status https://github.com/SlashDevelopers/SDTheme/blob/master/LICENSE codebeat badge

效果图

Demo运行效果图

演示做得有点丑,请多加宽容😅

使用方法非常简单:

初始化:

[[SDThemeManager sharedInstance] setupThemeNameArray:@[@"SDTheme-White", @"SDTheme-Black"]];

SDTheme-WhiteSDTheme-Black是资源主题Bundle的名称,下面会讲解如何引入资源Bundle。

切换主题:

[[SDThemeManager sharedInstance] changeTheme:@"SDTheme-Black"];

具体设置皮肤:

具体调用非常简单,例如,对于需要换肤的视图控件,原本是调用backgroundColor设置颜色,只需将其替换为调用扩展方法theme_backgroundColor即可,例如:

self.view.theme_backgroundColor = @"block_bg";
self.textField.theme_textColor = @"text_h1";
self.image.theme_image = @"icon_face";

富文本需要使用SDThemeForegroundColorAttributeName替换NSForegroundColorAttributeName,例如:

navBar.theme_titleTextAttributes = @{SDThemeForegroundColorAttributeName:@"text_h1"};

还有一些常用的属性在XIB等可视化视图也可以直接设置,例如:

如果直接设置属性的方式不满足需求,还可以自己监听通知SDThemeChangedNotification,收到通知后自行进行颜色图标等切换。

资源管理

颜色字符串和图片是放在单独的Bundle中进行管理,所以刚开始要新建自己的主题Bundle。在Bundle中新建ColorsMap.plistImages.xcassets

  • 图片:将图片放在相应的主题bundle中的Images.xcassets中进行管理,图片在不同主题下的名称要保持一致。
  • 颜色字符串:可以参考Demo中的文件,首先要有一个大分类,例如Demo中的block、text、line(分类可以根据自己的需求进行,这里的分类是我参考了竞品富途牛牛的),如果你有一个分类叫SomeThing,那么分类下的内容命名要带上相应的前缀SomeThing_,否则会出现找不到的情况。颜色字符串的格式为HEX或AHEX。🤠),如果你有一个分类叫SomeThing,那分类下内容命名要带上相应的前缀SomeThing_,不然会报找不到,color string是HEX或者AHEX格式。

Bundle创建注意事项:

资源bundle不要直接新建文件夹后更改扩展名或使用Settings Bundle

推荐Bundle创建方式:

文件->新建->目标->macOS->Bundle

创建完成后,将 Base SDK 设置为 iOS Build Active Architecture Only 并选择 "YES",安装目录无需修改,删除后面的路径 Code Signing Identity,选择不进行代码签名,iOS Deployment Target 设置为合适的版本,Skip Install 设置为 "NO",Strip Debug Symbols During Copy 设置为 "YES",COMBINE_HIDPI_IMAGES 设置为 "NO",并设置依赖 好的,到现在 Bundle 已经完成了。

主要实现原理:

实现原理非常简单,以下以 UIView 为例:

@interface UIView (SDTheme)

@property (nonatomic, copy) NSString *theme_backgroundColor;
@property (nonatomic, copy) IBInspectable NSString *sd_background;
@property (nonatomic, copy) NSString *theme_tintColor;

@en

这是针对UIView提供的扩展,大家可以看到其中有换肤属性theme_backgroundColor,如下图,我们在属性theme_backgroundColorSetter方法中有根据主题配置调用系统的相应方法,然后对控件注册监听,等切换主题之后就会收到通知,然后执行theme_didChanged方法,为控件设置正确的主题UI,That’s all~