在原生App中嵌入Flutter

Vicky 发布于2019-05-22 19:25 / 3326人阅读

摘要：结束之后在目录下会生成第三步设置版本在的文件中加入第四步依赖在中加入注意最后一个参数最好写全路径在中到此准备过程结束，写代码测试一下，我使用的是方式。

本文参考文档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 ↓

<");"1.0" encoding="utf-8"");"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">

    "@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

云服务器 GPU云服务器在html中嵌入html 苹果app一直在审核中 flutter中使用webrtc 原生App

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/6864.html

深入理解flutter的编译原理与优化

摘要：本文将以一个简单的为例，介绍下相关原理及定制与优化。模式对应了的模式，又称检查模式或者慢速模式。为快速启动，快速执行，包大小做了优化。并不支持模拟器的原因在于，模拟器上的诊断并不代表真实的性能。因此本文主要讨论因引入的构建，运行等原理。摘要：闲鱼技术-正物问题背景对于开发者而言，什么是Flutter？它是用什么语言编写的，包含哪几部分，是如何被编译，运行到设备上的呢？Flutt...

codecook 2019-06-28 10:58 评论0 收藏0
让前端开发者失业的技术，Flutter Web初体验

摘要：掌握可能是前端开发者翻盘的唯一机会。是开发必须的代码库。区别与应用，我们导入的是库而非，这是因为目前的接口并非和的完全通用，不过随着谷歌开发的继续，它们最终会被合并到一块。 Flutter是一种新型的客户端技术。它的最终目标是替代包含几乎所有平台的开发：iOS，Android，Web，桌面；做到了一次编写，多处运行。掌握Flutter web可能是Web前端开发者翻盘的唯一机会。 show...

shiguibiao 2019-05-27 17:42 评论0 收藏0
跨平台技术演进

摘要：接下来，我将从原理优缺点等方面为大家分享跨平台技术演进。小程序年是微信小程序飞速发展的一年，年，各大厂商快速跟进，已经有了很大的影响力。下面，我们以微信小程序为例，分析小程序的技术架构。前言大家好，我是simbawu ，@BooheeFE Team Leader，关于这篇文章，有问题欢迎来这里讨论。随着移动互联网的普及和快速发展，手机成了互联网行业最大的流量分发入口。以及随着5G...

魏宪会 2019-08-30 15:43 评论0 收藏0
跨平台技术演进

摘要：接下来，我将从原理优缺点等方面为大家分享跨平台技术演进。小程序年是微信小程序飞速发展的一年，年，各大厂商快速跟进，已经有了很大的影响力。下面，我们以微信小程序为例，分析小程序的技术架构。前言大家好，我是simbawu ，@BooheeFE Team Leader，关于这篇文章，有问题欢迎来这里讨论。随着移动互联网的普及和快速发展，手机成了互联网行业最大的流量分发入口。以及随着5G...

MasonEast 2019-08-26 13:39 评论0 收藏0