iOS 嵌入Flutter

1、要將Flutter嵌入到現(xiàn)有應(yīng)用程序中,請首先創(chuàng)建一個(gè)Flutter模塊。
從命令行中,運(yùn)行:

cd some/path/
flutter create --template module flutter_module
some/path/
├── flutter_module/
│   └── .ios/
│       └── Flutter/
│         └── podhelper.rb
└── MyApp/
    └── Podfile

2、安裝cocoapods

3、項(xiàng)目命令行下執(zhí)行pod init

4、項(xiàng)目命令行下執(zhí)行pod install

5、用wordspace重新打開項(xiàng)目

6、podfile文件里添加一下代碼

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

然后再準(zhǔn)備運(yùn)行的target里添加

install_all_flutter_pods(flutter_application_path)

7、再次執(zhí)行pod install

8、禁用bitcode

build settings里搜索bitcode,然后關(guān)閉

9、添加script

在build phases新建run script,添加以下代碼

"$FLUTTER_ROOT"/packages/flutter_tools/bin/xcode_backend.sh buiObject-cld

"$FLUTTER_ROOT"/packages/flutter_tools/bin/xcode_backend.sh embed

把show environment和run script only when installing都勾上(如果原生項(xiàng)目出現(xiàn)編譯錯(cuò)誤,則把only when installing點(diǎn)沒/點(diǎn)開,再次運(yùn)行調(diào)試)

把Run Script移動(dòng)到Dependencies后面

10、build settings 里的user-defined增加一項(xiàng),配置flutter目錄

FLUTTER_ROOT /Users/你的名字/Desktop/Flutter/flutter

11、注意

每次在flutter里修改pubspec.yaml時(shí),執(zhí)行完flutter packages get之后,都需要執(zhí)行pod install

在flutter終端中執(zhí)行,選擇.ios文件里的Runner.xcworkspace里面的證書和原生項(xiàng)目的一致(commond+shift+.打開隱藏文件夾)

flutter clean
flutter build ios

之后執(zhí)行原生程序

12、在ios上熱重載
進(jìn)入flutter項(xiàng)目命令行執(zhí)行flutter attach
等命令行出現(xiàn)Waiting for a connection from Flutter on Android SDK built for x86...
打開flutter編寫的頁面,命令行會出現(xiàn)
Syncing files to device Android SDK built for x86...
2,707ms (!)

?? To hot reload changes while running, press "r". To hot restart (and rebuild state), press "R".
An Observatory debugger and profiler on Android SDK built for x86 is available at: http://127.0.0.1:61581/06WC6YnSW2w=/
For a more detailed help message, press "h". To detach, press "d"; to quit, press "q".

此時(shí)修改flutter代碼
然后命令行輸入r,就可以看到代碼熱重載了
命令行輸入R,表示熱重啟

復(fù)制http://127.0.0.1:61581/06WC6YnSW2w=/在瀏覽器中打開,用DevTools里斷點(diǎn)調(diào)試flutter部分

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

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

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