前言

腾讯Now直播iOS App在近期版本嵌入了Flutter功能开发模块，本文旨在讨论我们Now直播终端团队对iOS Flutter混合开发模式的一些思路和实践，欢迎大家探讨。整体来看团队经历了三个混编开发模式阶段，分别是Xcode工程集成Flutter产出模式，Flutter工程集成Xcode工程模式和多团队协作远程构建产出集成模式。

Flutter标准工程结构

我们首先来看标准的iOS Flutter工程结构，其中Flutter工程包含了一个Xcode工程，而Xcode工程依赖于Flutter工程的产出，主要包括App.framework, Flutter.framework, flutter_assets等。

Xcode工程集成Flutter产出模式

基于Xcode工程仅依赖于Flutter工程产出的原理，为了应对产品快速上线的诉求，我们在独立的Flutter工程内开发调试完Dart代码后，将Flutter编译产出直接以动态库方式集成到Now工程。

这种集成方式不会影响现有工程项目的编译，与现有的开发模式无缝集成。但是由于Dart代码开发存储在本地，不适用于多人协作开发，同时也无法方便地进行代码调试。

Flutter工程集成Xcode工程模式

鉴于以上开发模式的缺陷，我们改变思路以Flutter工程为主体，将Xcode工程集成到Flutter工程下，同时对主体Xcode目录进行调整，修正构建脚本参数，使得开发环境能够正常出包。

在这种开发模式下我们同时支持三种开发方式

1. 版本需求只需要修改Native部分，直接打开Xcode项目进行开发

2. 版本需求只需要修改Flutter部分，直接使用AndroidStudio打开Flutter工程开发

3. 混合调试开发方式，版本需求同时修改Flutter和Native代码，也要支持Flutter Native断点调试

我们以Now直播动态搜索页获取Native图片Url为例，看下如何进行断点调试

1）AndroidStudio打开Flutter项目启动debug，在入口处挂breakpoint

2）Xcode Attach到手机对应的App进程，同时在MessageChannel调用处挂breakpoint

3）Xcode挂住调用入口breakpoint

4）Xcode函数处理完成后回调给Dart

5）Flutter工程收到回调内容并展示

这种集成方式在单独iOS团队集成开发来看，是可以满足需求的，但是不能支持iOS/Android团队公用Flutter代码开发的场景。

多团队协作远程构建产出模式

为了凸显Flutter一份代码同时支持iOS/Android的优势，我们最终考虑将Flutter代码单独分离出去，由RDM机器自动编译产出集成提交到指定的Xcode/Android分支目录的方案。

首先我们在本地配置具备Flutter环境的编译机器挂载映射到RDM上，在该机器上启动定时任务，检测到SVN有代码更新则自动启动编译，并将产出分别提交到对应的Xcode/Android工程SVN上。我们在提交的Flutter产出中标记上分支及revision版本信息，以便后期方便地找到对应版本代码。

SVN代码库分三个，Flutter，iOS，Android，分别维护各自的主流与分支版本。

每个版本需求开发分如下几种情况

1）仅涉及到Native代码

iOS/Android团队分别拉取Native代码开发，Flutter产物使用其主干最新的

2）涉及到Dart代码

iOS/Android团队分别拉取Native代码分支，同时拉取Flutter分支，标记上iOS/Android分支地址信息，开发同时通过SVN定时任务将编译产出同步到iOS/Android分支

总结

以上是我们Now直播终端团队对iOS Flutter混合工程改造的思路和实践过程，欢迎大家前来探讨。Now直播终端团队致力于为Flutter生态作出一点自己的贡献，期待Flutter越来越好！

作者：NOW终端技术团队,腾讯NOW直播 - mirageqliu（刘强）

链接：https://juejin.im/post/5b6cea3c6fb9a04fca3ca608