iOS组件化方案实战

目录

您的star,是我前进的动力 😊
Component地址

简述

本项目是一个组件化Demo,通过MTThemeMTRouter实现业务模块的主题国际化切换和解耦

PS: 用户名密码随便输入都可以

废话不多说,先上效果图

  • 主题的切换


    主题
  • 国际化的切换


    国际化.gif

为什么要项目组件化

随着APP版本不断的迭代,新功能的不断增加,业务也会变的越来越复杂,APP业务模块的数量有可能还会继续增加,而且每个模块的代码也变的越来越多,这样发展下去单一工程下的APP架构势必会影响开发效率,增加项目的维护成本,每个工程师都要熟悉如此之多的代码,将很难进行多人协作开发,而且Android项目在编译代码的时候电脑会非常卡,又因为单一工程下代码耦合严重,每修改一处代码后都要重新编译打包测试,导致非常耗时,最重要的是这样的代码想要做单元测试根本无从下手,所以必须要有更灵活的架构代替过去单一的工程架构。


工程架构

上图是目前比较普遍使用的APP技术架构,往往是在一个界面中存在大量的业务逻辑,而业务逻辑中充斥着各种网络请求、数据操作等行为,整个项目中也没有模块的概念,只有简单的以业务逻辑划分的文件夹,并且业务之间也是直接相互调用、高度耦合在一起的。


业务耦合

上图单一工程模型下的业务关系,总的来说就是:你中有我,我中有你,相互依赖,无法分离。
然而随着产品的迭代,业务越来越复杂,随之带来的是项目结构复杂度的极度增加,此时我们会面临如下几个问题:

  1. 实际业务变化非常快,但是单一工程的业务模块耦合度太高,牵一发而动全身;
  2. 对工程所做的任何修改都必须要编译整个工程;
  3. 功能测试和系统测试每次都要进行;
  4. 团队协同开发存在较多的冲突.不得不花费更多的时间去沟通和协调,并且在开发过程中,任何一位成员没办法专注于自己的功能点,影响开发效率;
  5. 不能灵活的对业务模块进行配置和组装;

为了满足各个业务模块的迭代而彼此不受影响,更好的解决上面这种让人头疼的依赖关系,就需要整改App的架构。

组件化架构思路

ComponentDemo结构图

上图是组件化工程模型,下面会列举一些组件化工程中名词的含义

集成模式

所有的业务组件被 ComponentDemo壳工程 依赖,组成一个完整的APP;

组件模式

可以独立开发业务组件,每一个业务组件就是一个APP;

app壳工程

负责管理各个业务组件,和打包apk,没有具体的业务功能;

业务组件

根据公司具体业务而独立形成一个的工程;

功能组件

提供开发APP的某些基础功能,例如主题切换模块、路由模块;

Main组件

属于业务组件,指定APP启动页面、主界面;

CommonModule

属于功能组件,支撑业务组件的基础,提供多数业务组件需要的功能,例如基类,初始化配置;

业务模块解耦

APP组件化架构的目标是告别结构臃肿,让各个业务变得相对独立,业务组件在组件模式下可以独立开发,而在集成模式下又可以变为 pod 集成到 ComponentDemo壳工程 中,组成一个完整功能的APP

preview3.png

这是组件化工程模型下的业务关系,业务之间将不再直接引用和依赖,而是通过 MTRouter 这样一个中转站间接产生联系,而路由实际就是对URL Scheme的封装。
如此规模大的架构整改需要付出更高的成本,还会涉及一些潜在的风险,但是整改后的架构能够带来很多好处:

  1. 加快业务迭代速度,各个业务模块组件更加独立,不再出现业务耦合情况;
  2. 稳定的公共模块采用依赖库方式,提供给各个业务线使用,减少重复开发和维护工作量;
  3. 迭代频繁的业务模块采用组件方式,各业务研发可以互不干扰、提升协作效率,并控制产品质量;
  4. 为新业务随时集成提供了基础,所有业务可上可下,灵活多变;
  5. 降低团队成员熟悉项目的成本,降低项目的维护难度;
  6. 加快编译速度,提高开发效率;
  7. 控制代码权限,将代码的权限细分到更小的粒度;

组件化实施流程

解耦

在每个业务模块中添加 Initialization 类,将路由注册写在 +load 中, 这样在 pre-main 时就会自动注册路由

    [MTRouter.router registerUrl:@"main://homepageCtrl#fdd" controllerCls:HomePageController.class];
    [MTRouter.router registerUrl:@"main://settingCtrl#fdd" controllerCls:SettingController.class];
    [MTRouter.router registerUrl:@"main://themeCtrl#fdd" controllerCls:ThemeController.class];
    [MTRouter.router registerUrl:@"main://languageCtrl#fdd" controllerCls:LanguageController.class];
    
    [MTRouter.router registerUrl:@"main://setUserInfo" handler:^id(NSDictionary *parameters) {
        HomePageController *ctrl = (HomePageController *)parameters[@"pushCtrl"];
        NSString *username = parameters[@"username"];
        NSString *password = parameters[@"password"];
        [ctrl setUsername:username password:password];
        return nil;
    }];

路由触发方式:

  1. handler路由触发
    [MTRouter.router executeUrl:@"main://setUserInfo"
                         parameters:NSDictionaryOfVariableBindings(pushCtrl, username, password)];
  1. ctrl路由触发
    //push
    [MTRouter.router pushUrl:@"main://settingCtrl"
                      animated:YES
                     pushNavCtrl:self.navigationController];
    //present
    [MTRouter.router presentUrl:@"camera://cameraCtrl" animated:YES presentCtrl:self];
    
    //获取ctrl实例
    UIViewController *ctrl = [MTRouter.router executeUrl:@"main://homepageCtrl"];

具体路由设计可查看MTRouter

主题国际化切换

CommonModule 中添加 ThemeLanguageManager 管理类,根据业务封装了具体主题国际化切换方案

  1. 主题国际化的初始化
    //主题模块初始化
    NSString *path = [NSBundle mainBundle].bundlePath;
    NSString *themePath = [path stringByAppendingPathComponent:@"Theme"];
    themePath = [themePath stringByAppendingPathComponent:currentTheme];
    [MTThemeManager initializeWithDefaultThemePath:themePath];
    
    //字体模块初始化
    NSString *fontPath = [path stringByAppendingPathComponent:@"Font"];
    fontPath = [fontPath stringByAppendingPathComponent:currentLanguage];
    [MTFontManager initializeWithDefaultFontPath:fontPath];
  1. 主题国际化的视图注册
    //国际化
    [_nameLabel theme_setTextColorIdentifier:@"SettingController.cell.nameLabel.textColor"
                                      moduleName:@"main"];
                                      
    //图片
    [_arrowImageView theme_setImageIdentifier:@"icon_setting_arrow" moduleName:@"main"];
    
    //颜色
    [_lineView theme_setBackgroundColorIdentifier:@"SettingController.cell.lineView.backgroundColor" moduleName:@"main"];
                                   
  1. 主题国际化切换
    //主题切换
    NSString *path = [NSBundle mainBundle].bundlePath;
    NSString *themePath = [path stringByAppendingPathComponent:@"Theme"];
    themePath = [themePath stringByAppendingPathComponent:theme];
    [MTThemeManager.manager setThemePath:themePath];
    
    //国际化切换
    NSString *path = [NSBundle mainBundle].bundlePath;
    NSString *fontPath = [path stringByAppendingPathComponent:@"Font"];
    fontPath = [fontPath stringByAppendingPathComponent:language];
    [MTFontManager.manager setFontPath:fontPath];

具体主题设计可查看MTTheme

PrefixHeader

由于项目中需要用到常用的宏命令,所以将所有的宏命令和 CommonModule 的基类在了 CommonModule 下的 CommonModule.h 中。

各模块资源文件的导入

在业务模块中获取图片无法使用 imageNamed: ,因为此方法是在 MainBundle 路径中加载,需要使用 imageNamed:inBundle:compatibleWithTraitCollection: 方法指定Bundle路径,可以在每个业务模块的 PrefixHeader.h 中添加本模块图片加载宏命令

未来优化

  1. 由于pod使用了静态库的方式导入,在业务模块中的资源文件全部放到了MainBundle中,后期每个模块建立bundle包
  2. 本地国际化有时候无效
  3. 由于项目规模太小,去中心化意义不大,后期针对性讲解下去中心化的概念
  4. 业务模块和功能模块使用 python 编写自动化静态库编译脚本,实现源码和静态库的自动切换
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345

推荐阅读更多精彩内容