Flutter 混合開發(fā)系列 包含如下：
- 嵌入原生View-Android
- 嵌入原生View-iOS
- 與原生通信-MethodChannel
- 與原生通信-BasicMessageChannel
- 與原生通信-EventChannel
- 添加 Flutter 到 Android Activity
- 添加 Flutter 到 Android Fragment
- 添加 Flutter 到 iOS
每個工作日分享一篇，歡迎關(guān)注、點贊及轉(zhuǎn)發(fā)。
Flutter 可以作為 frameworks 添加到 iOS 項目，iOS項目引入Flutter module需要安裝Xcode，另外Flutter支持iOS8及以上。
創(chuàng)建 Flutter module
由于 Xcode 無法像 Android Studio 一樣安裝插件，因此只能通過命令創(chuàng)建 Flutter module，打開終端，輸入如下：
cd ios 項目根目錄
flutter create --template module my_flutter
執(zhí)行完畢后，F(xiàn)lutter module將會創(chuàng)建在 ios項目/my_flutter目錄下，目錄結(jié)構(gòu)如圖：
.ios 是隱藏目錄，可以單獨運行Flutter module，測試此模塊的功能，iOS代碼添加到現(xiàn)有應(yīng)用程序的項目或插件中，而不是添加到模塊的.ios /目錄中。
由于.ios /目錄是自動生成的，因此請勿對其進(jìn)行源代碼控制。在新機(jī)器上構(gòu)建模塊之前，請先在my_flutter目錄中運行flutter pub get來重新生成.ios /目錄，然后再使用Flutter模塊構(gòu)建iOS項目。
將Flutter模塊嵌入到現(xiàn)有應(yīng)用程序中
將Flutter模塊嵌入到現(xiàn)有iOS應(yīng)用程序中有兩種方式：
- 使用CocoaPods和已安裝的Flutter SDK（推薦）。
- 為Flutter引擎，已編譯的Dart代碼和所有Flutter插件創(chuàng)建 frameworks。手動嵌入 frameworks，并在Xcode中更新現(xiàn)有應(yīng)用程序的構(gòu)建設(shè)置。
應(yīng)用程序無法在 Release 模式下的模擬器上運行，因為Flutter尚不支持為Dart代碼提前輸出x86 / x86_64二進(jìn)制（AOT）二進(jìn)制文件。在模擬器或真實設(shè)備上以調(diào)試模式運行，而在真實設(shè)備上以Release模式運行。
下面的兩種方式是將 Release frameworks 添加到 iOS 應(yīng)用程序，因此編譯的時候設(shè)備不能選擇模擬器，否則編譯失敗。
編譯成功：
選擇模擬器編譯失?。?/p>
使用CocoaPods和已安裝的Flutter SDK
此方法需要所有的相關(guān)開發(fā)的人員安裝 Flutter 環(huán)境。
假設(shè)現(xiàn)有應(yīng)用程序和Flutter模塊位于同級目錄中。如果您使用其他目錄結(jié)構(gòu)，則可能需要調(diào)整相對路徑，目錄如下：
修改iOS應(yīng)用程序中 Podfile 文件，如果沒有則手動創(chuàng)建，內(nèi)容如下：
flutter_application_path = '../my_flutter'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')
target 'My App' do
install_all_flutter_pods(flutter_application_path)
end
CocoaPods 相關(guān)請參考官網(wǎng)。
執(zhí)行 pod install 命令：
當(dāng)在my_flutter / pubspec.yaml中更改Flutter插件的依賴性或者第一次運行時，請在Flutter模塊目錄中運行flutter pub get來刷新podhelper.rb腳本讀取的插件列表。然后，從應(yīng)用程序目錄再次運行pod install。
podhelper.rb腳本將插件Flutter.framework和App.framework嵌入到項目中。
用 Xcode 打開 My App.xcworkspace，如果已經(jīng)打開則需要關(guān)閉重新打開，使用 ?B 編譯項目，編譯成功。
在Xcode中嵌入 Flutter Frameworks
通過命令生成必要的 Frameworks，并通過手動編輯現(xiàn)有的Xcode項目將它們嵌入到應(yīng)用程序中。如果團(tuán)隊成員無法在本地安裝Flutter SDK和CocoaPods，或者您不想在現(xiàn)有應(yīng)用程序中將CocoaPods用作依賴項管理器，則可以使用此方式。每次在Flutter模塊中進(jìn)行代碼更改時，都必須運行 flutter build ios 。
運行如下命令生成 Frameworks：
flutter build ios-framework --output=./Flutter/
執(zhí)行完畢后在對應(yīng)的目錄下生成相關(guān)編譯產(chǎn)物：
frameworks 已經(jīng)生成，將 frameworks 鏈接到 iOS 應(yīng)用程序有很多中方法，下面介紹一種， 打開 Xcode，
將 App.framework 和 Flutter.framework 拖入Build Settings > Build Phases > Link Binary With Libraries：
此時在項目的左側(cè)增加 Frameworks 目錄：
在 Build Settings -> Search Paths -> Framework Search Paths 中添加 ${PODS_ROOT}/../my_flutter/Flutter/Release
使用 ?B 編譯項目，編譯成功。
創(chuàng)建 FlutterEngine 和 FlutterViewController
將 Flutter 頁面嵌入 iOS 應(yīng)用程序需要創(chuàng)建 FlutterEngine（Flutter 引擎） 和 FlutterViewController，F(xiàn)lutterEngine 是Dart VM和Flutter運行時的 host，F(xiàn)lutterViewController 附著于 FlutterEngine，作用是通信和顯示 Flutter UI。
創(chuàng)建 FlutterEngine：
import UIKit
import Flutter
@UIApplicationMain
class AppDelegate: FlutterAppDelegate {
lazy var flutterEngine = FlutterEngine(name: "my flutter engine")
override func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
flutterEngine.run();
return super.application(application, didFinishLaunchingWithOptions: launchOptions);
}
}
添加一個按鈕，跳轉(zhuǎn)到 Flutter 頁面：
import UIKit
import Flutter
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let button = UIButton(type:UIButton.ButtonType.custom)
button.addTarget(self, action: #selector(showFlutter), for: .touchUpInside)
button.setTitle("顯示 Flutter", for: UIControl.State.normal)
button.frame = CGRect(x: 80.0, y: 210.0, width: 160.0, height: 40.0)
button.backgroundColor = UIColor.blue
self.view.addSubview(button)
}
@objc func showFlutter() {
let flutterEngine = (UIApplication.shared.delegate as! AppDelegate).flutterEngine
let flutterViewController =
FlutterViewController(engine: flutterEngine, nibName: nil, bundle: nil)
present(flutterViewController, animated: true, completion: nil)
}
}
上面的代碼使用了緩存 FlutterEngine，當(dāng)然這也是推薦的一種方式。
還有一種方式是是使用隱含的FlutterEngine，使用隱含的FlutterEngine會明顯增加顯示Flutter UI的時間，通常不建議這樣做，如果很少顯示 Flutter 屏幕，沒有好的方法來確定何時啟動Dart VM以及何時Flutter不需要在視圖控制器之間保持狀態(tài)，則這可能很有用。
func showFlutter() {
let flutterViewController = FlutterViewController(project: nil, nibName: nil, bundle: nil)
present(flutterViewController, animated: true, completion: nil)
}
指定入口點
默認(rèn)情況下 FlutterEngine 加載 lib/main.dart 文件中的 main() 方法，也可以指定其他文件的方法：
flutterEngine.run(withEntrypoint: "newEntrypoint", libraryURI: "main.dart")
初始化路由
從Flutter 1.22版開始，可以指定路由
let flutterEngine = FlutterEngine()
flutterEngine.run(
withEntrypoint: FlutterDefaultDartEntrypoint, initialRoute: "/one_page")
交流
老孟Flutter博客（330個控件用法+實戰(zhàn)入門系列文章）：http://laomengit.com
