使用QMUI_iOS和CTMediator实现组件化

2019-03-19 本文已影响162人 pixie星星啊

背景：之前有看到QMUI_iOS这个UI框架，发现里面几乎涵盖了所有常用的UI控件了，而且支持通过配置文件方便的实现更换主题、统一按钮颜色、tableviewcell高度等，就想去体验一把，这次想写一个组件化的demo就刚好用上辣~~~
总体来说使用CTMediator实现组件化,主要历经两大步骤：

1.基于之前做的APP原型完成基于CTMediator和QMUI_iOS的完整Demo，PXProject.

2.新建主工程PXMainProject，将Demo的各个组件和各模块做成私有库，最后演变成orgnization HelloPixie

基于CTMediator和QMUI的完整Demo

在之前项目（花都）的原型上用QMUI搭建各个界面(基本能覆盖百分之八九十的常见UI控件)。

1.模块拆分

（1）功能模块
将项目拆分成Tabbar(PXTabBarViewController)、首页（PXHome）、接种计划（PXVaccinationPlans）、健康（PXHealth）、个人中心（PXPersonalCenter）五大功能模块模块
（2）通用组件
异常处理（PXNoTarget）、空页面（PXEmptyView_Category）、控制器通用配置（QMUICommonViewController_Category）
（3）QMUI配置文件（APP控件颜色，高度等配置项）
QMUIConfigurationTemplate
Tips:这些模块和组件应该是平级的，在一个项目中不应该有general等文件夹，所有的功能或者模块应该都是平级的，便于维护和管理.

2.功能编写

要点：

推荐QMUI_iOS_CodeSnippets代码块提升编码效率
和QMUI_iOS_Templates这个还没用，需要管理员权限安装，配合QMUI使用。
模块间的引用通过CTMediator Category来降低耦合，可以先将本模块对外通信的Category设计出来，可以做到不影响其他模块的代码编写，并行任务。
每个模块都有一个对应的Target_XXX,负责提供对外的接口，这里面Action不局限于返回ViewController，还能做上传任务等，它的本质就是对外业务的一层服务化封装。Target_XXX可以引用本模块的各个文件，对应的CTMediator Category调用Target的相关Action解耦。

将Demo的各个组件和各模块做成私有库

参考文章Casa在现有工程中实施基于CTMediator的组件化方案

具体步骤：

创建一个orgnization，里面应该有个MainProject主工程(将之前PXProject里面的功能模块拆出去，只剩下QMUIConfigurationTemplate、PXPTabBarSetting.plist）
再去开一个repo，这个repo就是我们私有Pod源仓库
pod repo add [私有Pod源仓库名字] [私有Pod源的repo地址]
创立一个文件夹，例如Project。把我们的主工程文件夹放到Project下：~/Project/MainProject
在~/Project下clone快速配置私有源的脚本repo：git clone git@github.com:casatwy/ConfigPrivatePod.git
将ConfigPrivatePod的template文件夹下Podfile中source 'https://github.com/ModulizationDemo/PrivatePods.git'改成第一步里面你自己的私有Pod源仓库的repo地址
将ConfigPrivatePod的template文件夹下upload.sh中PrivatePods改成第二步里面你自己的私有Pod源仓库的名字

接下来是私有库的创建过程：

创建各个模块的工程，放置Project文件夹下，与ConfigPrivatePod平级目录
cd到ConfigPrivatePod下，执行./config.sh脚本来配置这个私有Pod（在XCode工程的代码目录下新建一个跟项目同名的目录。放在这个目录下的代码就会随着Pod的发版而发出去，这个目录以外的代码就不会跟随Pod的版本发布而发布）
修改podfile 和 .podspec文件（添加三方库依赖/支持系统版本/图片资源...）

特别注意：将图片资源作为resource_bundles引入时.podspec应该是下面这样

    s.resource_bundles = {
        'PXHome' => ['PXHome/PXHome/Assets/*.xcassets']
    }

获取图片时，代码应该是这样：

UIImage *image = [self getImageWithBoudleName:@"PXHome" imgName:dic[@"image"]];

- (UIImage *)getImageWithBoudleName:(NSString *)boudleName imgName:(NSString *)imgName {
    NSBundle *bundle = [NSBundle bundleForClass:[self class]];
    NSURL *url = [bundle URLForResource:boudleName withExtension:@"bundle"];
    NSBundle *targetBundle = [NSBundle bundleWithURL:url];
    UIImage *image = [UIImage imageNamed:imgName
                                inBundle:targetBundle
           compatibleWithTraitCollection:nil];
    return image;
}

发布私有库及关联本地代码到远程仓库

注意：修改upload.sh文件，将最后一行发布命令最后的一个参数去掉，否则会报错,如果私有库里面包含了私有库，需要指定sources，类似于：

pod repo push PXPrivatePods PXHome.podspec --sources=https://gitee.com/HelloPixie/PrivatePods.git,https://github.com/CocoaPods/Specs.git --verbose --allow-warnings --use-libraries

提交并上传私有库
git add .
git commit -m "版本号"
git tag 版本号
git push origin master --tags
./upload.sh

要注意的是，这里的版本号要和podspec文件中的s.version给到的版本号一致。upload.sh是配置私有Pod的脚本生成的，如果你这边没有upload.sh这个文件，说明这个私有Pod你还没用脚本配置过。
重复上述几个步骤，完成对各个模块的发版工作，最后，在PXMainProject的podfile将创建的私有库引入进来，编译、运行、大功告成。

远程调用

上面是本地调用的方式，远程调用使用以下API即可（参考Target_PXPersonalCenter）：

// 远程App调用入口，或者banner的跳转等都可使用
// url sample: aaa://targetA/actionB?id=1234
- (id)performActionWithUrl:(NSURL *)url completion:(void(^)(NSDictionary *info))completion