iOS已有项目引入Flutter

iOS、Flutter混合开发中，经常会遇到向已有项目中引入Flutter的情况。为了模拟这种情况下引入Flutter的场景，我会新建一个iOS工程，然后在新的iOS工程中，引入Flutter。

大致步骤如下：
1.新建iOS工程，使用CocoaPods管理工程；
2.新建Flutter Module；
3.iOS接入flutter module；
4.编写测试代码，查看结果;
当然前提是Mac电脑已经配置了Flutter环境变量，并安装了Cocoapods管理工具，这里不详述了，需要的可自行百度。

1、新建iOS工程，使用CocoaPods管理工程

新建文件夹FlutterMixDemo，并在目录下新建Xcode project : ios_app;
启动终端在FlutterMixDemo/ios_app目录下依次执行一下命令：

pod init
pod install

2、新建Flutter Module

打开终端切换到iOS_Flutter_MixBuilder目录下，执行下面命令：

flutter create -t module my_flutter

my_flutter为module的名字，执行完命令等待即可。

创建完成build一下，命令如下：

flutter build ios

如果执行上面的命令出现证书相关错误，也可以使用下方的指令在build的时候选择不签名，命令如下：

flutter build ios --no-codesign

3、iOS接入flutter module

官方给出了三种接入方案，这三种方案各有优缺点，我们先简单看看这三种方案：

使用 CocoaPods 和 Flutter SDK 集成：ios项目中用CocoaPods直接接入管理flutter module。这种方案需要所有开发人员都配置flutter环境，且安装CocoaPods；优点是通过CocoaPods自动集成，配置简单。

在 Xcode 中集成 frameworks：将flutter module先build成FrameWork文件，然后在ios项目中引入文件。这种方案的优点是ios开发人员不需要flutter环境，且项目不需要安装CocoaPods；缺点是每次修改都需要重新build，重新导入。

通过CocoaPods打包Framework：与2类似，只不过在build时加入--cocoapods参数：flutter build ios-framework --cocoapods --xcframework --no-universal --output=some/path/MyApp/Flutter/。打包出来的是Flutter.podspec 文件，ios项目中通过CocoaPods管理集成。这个方案的与2方案差不多，缺点也是每次改动需要重新build，优点是ios开发人员不需要flutter环境。

所以要根据自身的情况来选择符合自己的方案。官方推荐第一种方案，我也尝试了第一个方案，并很顺利的引入了Flutter，如果你想尝试其它两种方式，可以自行百度指引，本文就不多做延伸了。

使用Cocoapods+Flutter SDK引入

先打开上一步创建的iOS项目的podfile文件，并在开头添加上下面的代码：

flutter_application_path = '../my_flutter/'

load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')

post_install do |installer|
  flutter_post_install(installer)
end

然后在target中添加：

target 'xxx' do
  install_all_flutter_pods(flutter_application_path)
end

修改后的podfile文件如下：

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

flutter_application_path = '../my_flutter/'

load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')

post_install do |installer|
  flutter_post_install(installer)
end

target 'ios_app' do

  use_frameworks!

  install_all_flutter_pods(flutter_application_path)

end

最后终端切换到iOS_Flutter_MixBuilder目录下，执行下面命令：

pod install

CocoaPods会自动将flutter module编辑出的产物集成到ios项目中。如果没有问题，执行⌘+B 编译项目就会成功。

4、编写测试代码，查看结果

我们在ViewController原生controller界面，添加代码实现跳转到Flutter界面FlutterViewController，

#import "ViewController.h"
#import <Flutter/Flutter.h>

@interface ViewController ()
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    UILabel *label = [[UILabel alloc]init];
    label.textAlignment = NSTextAlignmentCenter;
    label.numberOfLines = 0;
    label.textColor = [UIColor blackColor];
    label.text = @"这是原生界面\n点击跳转Flutter";
    [self.view addSubview:label];
    
    CGFloat screenWidth = [UIScreen mainScreen].bounds.size.width;
    CGFloat screenHeight = [UIScreen mainScreen].bounds.size.height;
    label.frame = CGRectMake((screenWidth-200)/2, (screenHeight-40)/2, 200, 60);
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    
    [self jumpToFlutterViewController];
}

- (void)jumpToFlutterViewController {
    
    FlutterViewController *vc = [[FlutterViewController alloc]init];
    [self presentViewController:vc animated:YES completion:nil];
}
@end

参考资料：
[稀土掘金]Flutter、iOS混合开发实践
[阿里云开发者社区]Flutter混合开发：在已有iOS项目中引入Flutter（上）