Android笔记:在原生App中嵌入Flutter
程序员文章站
2022-05-29 19:57:47
...
本文参考文档Add Flutter to existing apps。
首先有一个可以运行的原生项目
第一步:新建Flutter module
Terminal进入到项目根目录,执行flutter create -t module ‘module名字’
例如:flutter create -t module flutter-native
执行完毕,就会发现项目目录下生成了一个module
第二步:同步Flutter module依赖
进入到新生成的Flutter module目录下的.android目录下,命令是cd .android/
,然后执行gradlew flutter:assembleDebug
,mac下./gradlew flutter:assembleDebug
这过程根据网络情况,可能有点长。
结束之后在.android/Flutter/build/outputs/aar/
目录下会生成flutter-debug.aar
第三步:设置JDK版本
在app的build.gradle文件中加入:
compileOptions { sourceCompatibility 1.8 targetCompatibility 1.8 }
第四步:依赖Flutter module
在settings.gradle
中加入
include ':app'
setBinding(new Binding([gradle: this]))
evaluate(new File(
settingsDir.parentFile,
'FlutterNativeApplication/flutter_native/.android/include_flutter.groovy'
))
注意:最后一个参数最好写全路径!
在app/build.gradle中
dependencies {
……
implementation project(':flutter')
}
到此准备过程结束,写代码测试一下,我使用的是Fragment方式。当然也有View的方式。
MainActivity.kt ↓
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
supportRequestWindowFeature(Window.FEATURE_NO_TITLE)
setContentView(R.layout.activity_main)
val tx = supportFragmentManager.beginTransaction()
tx.replace(R.id.content, Flutter.createFragment("route"))
tx.commit()
}
}
activity_main.xml ↓
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"></FrameLayout>
</android.support.constraint.ConstraintLayout>
部分安卓学习思维大纲:
再推荐一篇文章,具体的架构视频,面试专题,学习笔记都在这篇文章中:“寒冬未过”,阿里P9架构分享Android必备技术点,让你offer拿到手软!
推荐阅读
-
Flutter(六)Flutter界面中嵌入Android原生视图
-
Flutter中嵌入Android 原生TextView实例教程
-
android App 在WebView中嵌入H5网页,无法正常显示
-
在Android原生应用中嵌入ReactNative页面
-
Android笔记:在原生App中嵌入Flutter
-
Flutter布局中嵌入Android原生组件 - 全景图组件封装
-
Flutter(六)Flutter界面中嵌入Android原生视图
-
Android如何在原生App中嵌入Flutter
-
Flutter中嵌入Android 原生TextView实例教程
-
在原生App中嵌入Flutter