Flutter 產(chǎn)物集成原生 iOS 項(xiàng)目指南 (包含插件)

Flutter 產(chǎn)物集成原生 iOS 項(xiàng)目指南 (包含插件)

隨著 Flutter 1.5 版本的發(fā)布, 越來(lái)越多的原生項(xiàng)目開(kāi)發(fā)者開(kāi)始學(xué)習(xí) Flutter, 通過(guò)在項(xiàng)目中引入 Flutter 混合開(kāi)發(fā)的方式嘗試 Flutter 是一個(gè)不錯(cuò)的選擇

混合方案

目前混合開(kāi)發(fā)方案有兩種集成方式:

源碼集成:

谷歌官方提供的方案 https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps,

開(kāi)發(fā)調(diào)試方便, 但會(huì)產(chǎn)生編譯依賴, 所有項(xiàng)目開(kāi)發(fā)者都需要安裝 flutter 環(huán)境 ,每次編譯都會(huì)重新生成 flutter 產(chǎn)物, 編譯速度會(huì)有一定影響

產(chǎn)物集成:

不影響原生項(xiàng)目, 把編譯生成的 flutter 產(chǎn)物集成到項(xiàng)目中, Flutter 所有相關(guān)內(nèi)容就只是一個(gè) pod , 添加或移除方便

鑒于源碼集成方式依賴性強(qiáng), 使用產(chǎn)物集成方式是原生項(xiàng)目嘗試接入最好的選擇, 對(duì)原生項(xiàng)目沒(méi)有任何侵害, 我這邊目前的做法是 flutter 開(kāi)發(fā)者通過(guò)源碼集成方式開(kāi)一個(gè)分支開(kāi)發(fā)相關(guān)功能, 而其他成員通過(guò)產(chǎn)物集成方式拉取 Pod 即可集成 flutter

這里主要講講產(chǎn)物集成的過(guò)程包含插件的集成

創(chuàng)建 Flutter 項(xiàng)目

創(chuàng)建 Flutter項(xiàng)目和源碼集成,谷歌的教程是相同的

$ flutter create -t modult my_flutter

源碼集成和產(chǎn)物集成主要差別是 flutter 生成的產(chǎn)物, 源碼集成通過(guò) pod 和 編譯腳本在每次編譯時(shí)生成 flutter 產(chǎn)物自動(dòng)添加到項(xiàng)目中, 而產(chǎn)物集成是把生成的產(chǎn)物拿出來(lái)直接使用

生成 Flutter 產(chǎn)物

在 flutter 項(xiàng)目路徑,終端輸入 flutter build ios 即可生成產(chǎn)物

$ my_flutter: flutter build ios --debug
$ my_flutter: flutter build ios --release

iOS 項(xiàng)目路徑(隱藏文件):

/my_flutter/.ios

如果執(zhí)行 flutter build ios 失敗, 一般是證書(shū)問(wèn)題, 可打開(kāi) .ios/Runner.xcworkspace 修復(fù)問(wèn)題, 確保 Runner 可編譯通過(guò)

執(zhí)行成功后可看到在 .ios/Flutter 文件中會(huì)生成 App.framework 和 Flutter.framework, 這就是生成的 Flutter 產(chǎn)物了

我們可以直接把這兩個(gè) framework 拖進(jìn)原生項(xiàng)目中使用, 無(wú)任何侵害的使用 flutter, 但是制作成 pod 是最好的選擇, 打包和團(tuán)隊(duì)開(kāi)發(fā)都方便, flutter 開(kāi)發(fā)者通過(guò) my_flutter 開(kāi)發(fā)完成后, 執(zhí)行 flutter build ios 生成產(chǎn)物, 發(fā)布到 pod , 其它成員拉取 pod 即可更新

MyFlutterSDK
    /MyFlutterSDK
        /App.framework
        /Flutter.framework
    MyFlutterSDK.podspec

集成插件

產(chǎn)物集成的方式集成插件的原生代碼是比較麻煩的事情, 源碼集成通過(guò)腳本會(huì)自動(dòng)添加插件生成 pod, 而產(chǎn)物集成我們需要手動(dòng)集成插件, 插件的文件目錄

/my_flutteer/.ios/Flutter/.symlinks/{插件名稱(chēng)}/ios

插件文件是一個(gè)路徑映射, 它真正所在的路徑在 flutter 庫(kù)中

$ flutter/.pub-cache/hosted/pub.flutter-io.cn

插件文件/ios 中一般會(huì)看到 Classesxxx.podspec 兩個(gè)文件, 我們只需要把它們拿出來(lái)單獨(dú)制作成 pod 即可, 需要注意的是在插件 podspec 中一般會(huì)依賴 Flutter

s.dependency 'Flutter'

這里需要把它改成我們自己生成的 pod 名稱(chēng), 比如上面生成的 MyFlutterSDK

由于包含插件就涉及到插件注冊(cè)我們還需要把插件注冊(cè)文件制作成 pod , 路徑在

/my_flutteer/.ios/Flutter/FlutterPluginRegistrant

記得更改里面引用的 Flutter 名稱(chēng)

完成制作

至此我們需要的相關(guān)文件都制作完成了,包含的 pod 有:

MyFlutterSDK
FlutterPluginRegistrant
插件
插件
...

在原生項(xiàng)目中集成 pod 即可, 需要注意的是 flutter build ios —release 生成的 framework 需要使用真機(jī)測(cè)試, 因?yàn)?debug 和 release flutter 的編譯方式是不同的, 我們可以制作兩個(gè) pod 針對(duì)不同的環(huán)境, 比如:

MyFlutterSDK_Debug
MyFlutterSDK_Release

最后放上 Demo, 里面包含了一個(gè)插件, 用來(lái)演示插件的集成

地址: https://github.com/ZeroJian/FlutterHybrid

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容