Flutter體驗
嘗試過flutter方知編程真愛，dart用起來就是爽~
看到我這篇博客的同學(xué)肯定是對flutter有過一些了解，所以不再贅述，直接開干。
為何要混合開發(fā)
公司的祖?zhèn)鞔a，各種庫，sdk一般還是java寫的，所以向flutter遷移還需要時間，當(dāng)然flutter也需要時間完善自身，這是一個漸進式的過程。
開始導(dǎo)入
- 第一步：(默認同學(xué)們已經(jīng)配置好了flutter環(huán)境) 參考官網(wǎng)文檔
- 第二步：在我自己已有的Android項目AdvancedAndroid工程下Terminal內(nèi)輸入命令
flutter create -t module my_flutter
實際上Android Studio近期版本（比如我的AS 3.3.1）已經(jīng)集成了創(chuàng)建flutter module的功能,使用AS創(chuàng)建都是一樣的。
正常情況下會顯示
flutter module創(chuàng)建成功.png
- 第三步：在settings.gradle下添加
setBinding(new Binding([gradle: this]))
evaluate(new File(
settingsDir,
'tip_flutter/.android/include_flutter.groovy'
))
注意參數(shù)settingDir和官網(wǎng)介紹的不一樣，因為我的my_flutter工程在AdvancedAndroid工程目錄下。
- 第四步：在app/build.gradle中添加
api project(':flutter')
雖然module不是這個名字，現(xiàn)在也是這么寫
- 第五步： 添加FlutterView。在app下創(chuàng)建一個TestFlutterViewActivity和對應(yīng)的xml,xml中添加一個id = iv_fab的 ImageView,將FlutterVie添加進去
findViewById(R.id.iv_fab).setOnClickListener(v -> {
View flutterView = Flutter.createView(
TestFlutterViewActivity.this,
getLifecycle(),
"route1"
);
LinearLayout.LayoutParams layout = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
addContentView(flutterView, layout);
});
- 第六步：在main.dart中添加對應(yīng)的路由項。
現(xiàn)在進入到my_flutter Module下，找到main.dart,添加上與"route1"
Widget _widgetForRoute(String route) {
switch (route) {
case 'route1':
return MyApp();
default:
return MyApp();
}
}
后面的內(nèi)容您自己隨意啦，
native跳轉(zhuǎn)flutter.gif
遇到的問題
- 第2步中在settings.gradle添加內(nèi)容的時候要求導(dǎo)入Binding類（這個類實際上在package groovy下），不必導(dǎo)入，直接sync編譯可以通過 .
- 第2步中參數(shù)settingsDir，官方文檔是 settingsDir.parentFile。我的my_flutter和官方文檔位置不同，所以這個參數(shù)也不同。
可以hot reload
hot reload是提高flutter提高效率寫大大大優(yōu)點。混合開發(fā)也是可以hot reload的。
實際生產(chǎn)推薦flutter_boost
這篇博客實際上只是嘗試一下混合開發(fā)爽一把，實際生產(chǎn)環(huán)境下想要混合開發(fā)最好使用已經(jīng)造好的輪子。目前咸魚開源了他們的的輪子flutter_boost，值得嘗試?？梢?a target="_blank" rel="nofollow">戳這里
了解。
上文Demo地址在這里 從tag1.0.0中獲取
