1. 創建 Flutter module?
在做混合開發之前我們首先需要?創建 一個 Flutter module.
假設你的Native 項目是這樣的: xxx/flutter_hybrid/Native項目:?
執行以下命令:
cd?xxx/flutter_hybrid/Native
flutter create -t module flutter_module
上面代碼會切換到你的Android/iOS項目的上一級目錄, 并創建一個futter 模塊:
上面是flutter_module中的文件結構, 你會發現它里面包含.android 和 .ios, 這兩個文件夾是隱藏文件, 也是這個flutter_module的宿主工程:
* .android? -? flutter_module的Android宿主工程;
*.ios? -??flutter_module的iOS宿主工程;
* lib? ?-? ?flutter_module的Dart部分的代碼;
*pubspec.yaml? -? flutter_module的項目依賴文件;
因為宿主工程的存在, 我們這個flutter_module在不加額外配置的情況下是可以獨立運行的, 通過安裝了Flutter和Dart插件的Android Studio (或者VS Code) 打開flutter_module項目, 運行.
2.1 Flutter Android 混合開發
1. 用Android Studio 打開?flutter_module的安卓 宿主工程, 在settings.gradle文件下 添加 Flutter module的 依賴配置, 代碼如下:
setBinding 和 evaluate 允許Flutter模塊包括它自己在內的任何插件, 在settings.gradle中以類似:? flutter , 祝英臺age_info ,? :video_palyer的方式存在.
2. 在安卓主工程的 build.gradle(Module: app)的dependencies節點 下, 添加flutter module的依賴, 代碼如下:?
2.2. 在Java中調用Flutter module
經過上面2個步驟, 已經為Android項目添加了Flutter必須的依賴, 接下來要在Java中調用Flutter 模塊:?
在Java中調用Flutter 模塊有兩種方式:
* 使用Flutter.createView API的方式:?
* 使用FlutterFragment的方式
上面使用的字符串 "route1" 是用來告訴Dart代碼在Flutter視圖中顯示那個小部件. Flutter木塊項目的lib/main.dart文件需要通過window.defaultRouteName來獲取Native指定要像是的路由名, 已確定要創建哪個窗口小部件并傳遞給runApp:
2.3調用Flutter module時傳遞參數
在上文中, 無論通過是使用Flutter.createView 還是?FlutterFragment的方式, 都允許加載flutter module時傳遞一個String類型的initialRoute參數, 如何傳遞其他參數呢?
FragmentTransaction tx = getASupportFragmentManager().beginTransaction();
tx.replace(R.id.someContainer, flutter.createFragment( "{name:'devio',? dataList:['aa', 'bb', 'cc']}"));
tx.commit();
然后在Flutter module 通過如下方式獲取:?
import? 'dart.ui ' // 要使用window對象必須引入
String initParams =? window.defaultRouteName;
2.4 編寫運行Dart代碼?
2.5 熱加載和熱重啟
2.5.1 混合開發項目怎么啟用熱加載和熱重啟?
* 打開一個模擬器 , 或者連著設備到電腦?
* 關閉App, 然后運行Flutter attach;
(ps: 如果電腦連接多個設備?Flutter attach -d '設備ID'?)?
資料來自慕課網.?
