开篇:

flutter是什么就不多做介绍了,目前使用纯flutter进行开发的大型项目还比较少,多数试水的还是打算和现有的原生代码进行混编,即将flutter页面嵌入到原生app中。而网上大部分都是讲安卓和flutter混编的经验,有iOS和flutter混编的也是比较老的方法,现在已经不再适用,这两天尝试了一下最新的方式,记录一下,希望大家少走弯路。

正题:

以下内容都是按照官方给出的方案进行(2019年7月31号更新的版本),毕竟官方才是硬道理,官方混编介绍。但毕竟是纯英文的,如果有什么疑惑或者看不懂的,欢迎你继续往下看。

一、创建flutter module
在开始嵌入flutter之前,首先需要创建flutter工程,但请注意,这里创建的是flutter module工程,有两种方式创建:
1.使用命令行:flutter create -t module xxx
此命令会创建一个包含Android library 和CocoaPods pod的flutter工程,供原生应用使用。
2.使用Android Stadio:

frc b27388da44a8a585044b8e329575aefe - iOS和Flutter混编系列一:如何在已有的iOS工程中添加Flutter工程
创建flutter module

需要注意的是,不管是用命令行还是使用AS创建flutter module,都需要保证创建的flutter工程和原生应用在同一目录下。
假如你在some/path/MyApp存在一个iOS原生应用,要创建flutter工程:

cd some/path/
flutter create -t module my_flutter

这会创建在这个位置some/path/my_flutter/创建一个flutter module,里面包含基础的dart代码,以及一个.ios/的隐藏文件,其中包含Cocoapods和helper Ruby script。

二、添加原生app对flutter的依赖
现在假设你的目录结构如下:

some/path/
  my_flutter/
    lib/main.dart
    .ios/
  MyApp/
    MyApp/
      AppDelegate.h
      AppDelegate.m (or swift)
      :

我们需要使用iOS中的Cocoapods来添加flutter framework的依赖,因为在my_flutter工程中包含的任何flutter plugin也需要使用这个flutter framework。

注意:如果你是在2019年7月30号之前,已经进行过添加flutter到原生app的操作,或者你的flutter版本低于Flutter 1.8.4-pre.21,就需要升级你的环境,而在升级之前,首先要确保你自己是在master channel上:

frc a32b9265684917966dcb322d23422dfe - iOS和Flutter混编系列一:如何在已有的iOS工程中添加Flutter工程
查看当前channel并切换到master channel

然后,执行flutter upgrade,更新flutter到最新。
再然后,检查你的Podfile文件,修改为最新的写法,并删除掉之前配置的两个脚本文件,最后重新链接podhelper.rb即可!详细操作参考 :升级添加到app中的flutter

如果你的项目中已经在使用CocoaPods,可以直接按照以下的步骤进行配置,如果没有使用CocoaPods,则需要先初始化一个Podfile文件(在工程目录,执行pod init)。
1.添加以下内容到Podfile中:
注意:需要添加到文件顶部的位置

flutter_application_path = 'path/to/my_flutter/'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')
frc 62155a208e5914ead4cf33367caa7171 - iOS和Flutter混编系列一:如何在已有的iOS工程中添加Flutter工程
添加到podfile

2.每一个Xcode target都需要绑定flutter,调用install_all_flutter_pods(flutter_application_path)

target 'MyApp' do
    install_all_flutter_pods(flutter_application_path)
end
target 'MyAppTests' do
    install_all_flutter_pods(flutter_application_path)
end

3.命令行执行 pod install
任何时候,如果你修改了flutter工程中some/path/my_flutter/pubspec.yaml中的三方依赖,在flutter工程所在目录,都需要执行flutter packages get来更新从podhelper.rb脚本中读取的plugins列表,然后在app所在目录执行 pod install

这个podhelper.rb脚本是干嘛使得呢?它可以确保你所有的plugins,Flutter.framework还有App.framework都会被绑定在你的原生项目中。

4.由于flutter工程不支持bitcode,所以需要在xcode中设置Build Settings->Build Options->Enable Bitcode为NO。

好了,做完了上面所有的工作,现在⌘B,如无意外,我们原生项目中集成flutter的工作就做完了,接下来就可以愉快的进行混合开发了。

iOS和Flutter混编系列一:如何在已有的iOS工程中添加Flutter工程