这个长假因为新型冠状病毒疫情显得格外不一样,好多小伙伴应该已经闲的长毛了,再坚持一下,相信国家很快就会控制住的。
这两天实在不知道做啥了,开始跟着keep计划健身,为即将来临的工作热身,今天学习了一下Flutter的混合开发知识。
Flutter与Android的原生混合开发学习中遇到一些问题,现在记录如下。
首先看一下如何创建一个Flutter module.
在Android原生项目的同级目录使用如下命令创建一个flutter_module
flutter create -t module flutter_module
之后会有如下的输出:
➜ ~ flutter create -t module flutter_module ╔════════════════════════════════════════════════════════════════════════════╗ ║ A new version of Flutter is available! ║ ║ ║ ║ To update to the latest version, run "flutter upgrade". ║ ╚════════════════════════════════════════════════════════════════════════════╝ Creating project flutter_module... androidx: true flutter_module/test/widget_test.dart (created) flutter_module/flutter_module.iml (created) flutter_module/.gitignore (created) flutter_module/.metadata (created) flutter_module/pubspec.yaml (created) flutter_module/README.md (created) flutter_module/lib/main.dart (created) flutter_module/flutter_module_android.iml (created) flutter_module/.idea/libraries/Flutter_for_Android.xml (created) flutter_module/.idea/libraries/Dart_SDK.xml (created) flutter_module/.idea/modules.xml (created) flutter_module/.idea/workspace.xml (created) Running "flutter pub get" in flutter_module... 4.9s Wrote 12 files. All done! Your module code is in flutter_module/lib/main.dart.
如上就表示创建成功了。
如果用最新版的Flutter SDK,通过上述命令创建的Flutter_module默认支持的是AndroidX,这一点一定要注意。
接下来在Android原生项目中进行导入,
- 在settings.gradle中添加如下代码:
setBinding(new Binding([gradle: this])) evaluate(new File( settingsDir.parentFile, //flutter_module即为创建的模块名称 'flutter_module/.android/include_flutter.groovy' ))
2.在app/build.gradle文件中dependencies节点下添加
implementation project(':flutter')
最后,通过Android Studio中的sync now 进行同步就行了,同步完成之后重新运行android原生项目即可。
问题一 原生导入flutter_module后报错AndroidX
解决方法,使原生项目支持Androidx
- 在项目的gradle.properties文件添加如下代码,开始androidX支持
android.useAndroidX=true android.enableJetifier=true
2.修改MainActivity的导入文件
将import android.support.v7.app.AppCompatActivity; 修改为 import androidx.appcompat.app.AppCompatActivity;
3.修改app/build.gradle文件中dependencies
implementation 'com.android.support:appcompat-v7:28.0.0' implementation 'com.android.support.constraint:constraint-layout:1.1.3' 修改为 implementation 'androidx.appcompat:appcompat:1.0.0' implementation 'androidx.constraintlayout:constraintlayout:1.1.2'
问题二 报错:Error:com.android.builder.dexing.DexArchiveBuilderException
通过查看flutter_module项目的app/build.gradle文件代码可以看到在Android根节点下有如下代码
compileOptions { sourceCompatibility 1.8 targetCompatibility 1.8 }
所以在原生项目的app/build.gradle文件的android节点下添加如下代码,即可解决这个问题。
compileOptions { sourceCompatibility JavaVersion.VERSION_1_8 targetCompatibility JavaVersion.VERSION_1_8 }
相信Flutter和ReactNative在跨平台开发中齐头并进,双雄逐鹿。