前奏：
目前基於flutter的活躍程度，有很多的開發人員開始學習flutter，我也是其中的一枚小卒。由於本公司項目涉及一些小遊戲的開發，兩端或者是三端（包括web）開發起來可能比較耗費人力物力，並且在計算邏輯上可能還會存在一些差異問題等。混合開發成爲了一個首選的定義。RN在這一步上面的靈活性沒有flutter的靈活性大，簡單的來講，如果使用RN的話，項目的的打包依賴對平臺的依賴性比較高，而flutter既可以作爲一個模塊開發，也可以作爲一個應用開發，比較靈活。
本篇基於flutter的基本介紹這裏就不再贅述。
對於flutter的瞭解。這裏可以參考官網： Flutter中文網，這裏推薦快速入門的人員可以先看《編寫第一個Flutter應用》和《Flutter for iOS 開發者》這兩個章節，其他組件的使用可以慢慢了解。熟能生巧嘛，萬事不能期望一次就熟練的程度。既然有興趣就不要浪費這三分鐘的熱度。
下面這裏我們來配置swift項目的依賴flutter混合開發。網上也有很多人來講swift舊項目中嵌入flutter，但是運行下來發現會多少存在一些問題。這裏將我的問題以及緣由一一解說，如有問題，還望各位看官不吝賜教。
這裏我們混合flutter開發有兩種模式：1.項目獨立開發，2.靜態包倒入。
這裏我採用的是項目獨立開發，由於項目的不穩定性，產品基於這一塊新品遊戲的不確定性，概念性試水。對目前來看使用靜態包的話可能修改起來不太方便，下一篇我也會整理一下靜態包的方式給大家展示使用步驟。
第一
一個成熟的flutter環境，終端運行：flutter doctor。直至沒有問題以及警告。
第二（這裏我用swift項目，OC酌情配置相同）
我們創建一個iOS項目，或者是已經存在的iOS項目:
這個項目我建在了桌面的mixText文件夾下的FlutterIos項目。
然後我們在這個項目FlutterIos的同級目錄下：即mixText文件夾下執行命令：
flutter create -t module flutter_module
這裏的flutter_module只是這個flutter的module名，（可以自定義，不過自定義下的話下面會講到的新建的flutter的module路徑也要相應的調整哈，不要這裏任性改了，下面的不該照着我的打，編譯不通過那就不怪我了😂）
- 通過cocopod將iOS/swift工程和flutter進行關聯
- 進入FlutterIos文件夾
- 執行 pod init
- 將配置項添加到pod文件夾中
# Flutter
flutter_application_path = '../flutter_module/'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')
-
看起來應該是這樣
其中的source這裏也順便一提。之前我們的cocoapods的索引地址是cocoapods/specs.git（即上文寫的），但是目前cocoapods的索引地址換爲了CDN(trunk)。你也可以執行pod repo來查看下載你本地的索引庫是哪幾個，由於trunk近期也是經常出問題。這裏我們索引還是用git的索引源：https://github.com/CocoaPods/Specs.git
-
保存，終端執行pod install （這裏執行會報錯，需要將依賴包的iOS版本號提高至10以及以上即可解決，應該是flutter的環境需要至少是iOS10以及以後的版本纔可以）
-
打開我們pod創建好的 FlutterIos.xcworkspace，進行基礎配置
-
iOS工程Enable Bitcode 需要關閉，因爲Flutter混合開發不支持Bitcode
這裏如果我們項目中的其他一些第三方使用Enable bitcode的話，可以在podfile裏面添加這樣一段：
# Flutter相關集成是不支持bitcode的，所以需要將相關產物的bitcode功能關閉。如果你的現有工程中倉庫衆多，有的倉庫是必須bitcode的，這樣的話就需要每次pod install之後再在工程配置中手動設置回來，以下腳本放在podfile中可以解決此問題。
post_install do |installer|
installer.pods_project.targets.each do |target|
if target.name =="App" || target.name =="Flutter"
target.build_configurations.each do |config|
config.build_settings['ENABLE_BITCODE'] ='NO'
end
end
end
end
好了，我們接着來：
-
添加Run Script
"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" build
"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" embed
我們可以看到這兩個腳本中涉及這個shell腳本：xcode_backend.sh 這個腳本很重要，這個路徑呢是你本地安裝Flutter SDK的路徑下可以找到的這個文件。
然後是進行User-Defined的環境路徑添加（這個文件是在上面pod install的時候會生成相應的連接的），這裏也是一個項目獨立的弊端，需要同時開發這個項目的都安裝flutter環境，而framework則不用這樣。（雙刃劍，各取所需吧。）
然後我們編譯flutter_module項目中的iOS環境：cd到flutter_module文件夾下，flutter run -d (ios)，會在flutter_module目錄下生成一個build文件夾，我們將文件夾中的flutter_assets文件夾拖拽進FlutterIos項目中（勾選Create floder reference）
然後在項目中需要的地方導入Flutter頭文件，然後使用：
import UIKit
import Flutter
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
self.title = "混合開發測試"
let btn: UIButton = UIButton()
btn.backgroundColor = .cyan
btn.frame = CGRect(x: 50, y: 100, width: 100, height: 50)
btn.addTarget(self, action: #selector(btnChoose), for: .touchUpInside)
self.view.addSubview(btn);
}
@objc func btnChoose() {
let vc = FlutterViewController()
self.navigationController?.pushViewController(vc, animated: true)
// self.present(vc, animated: true, completion: nil)
}
}
至此，項目運行起來。接下來就愉快的敲起心愛的Flutter的Hello World吧。