Android&Flutter混合开发初体验

Stella981
• 阅读 1052

最近flutter不是一般的火呀,但对于一些成熟的产品来说,完全摒弃原有App的历史沉淀,全面转向Flutter是不现实的。因此使用Flutter去统一Android、iOS技术栈,把它作为已有原生App的扩展能力,通过有序推进来提升移动端的开发效率
(1)创建flutter模块,创建module后会AS会自动进行flutter的相关配置
Android&Flutter混合开发初体验
(2)将FlutterActivity添加到AndroidManifest.xml

        <activity
            android:name="io.flutter.embedding.android.FlutterActivity"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:theme="@style/FlutterTheme"
            android:windowSoftInputMode="adjustResize" />

(3)跳转到flutter页面

startActivity(FlutterActivity.withNewEngine().initialRoute("route").build(this))

(4)你也可以使用缓存的FlutterEngine,可以减少加载延迟
在MyApplication中实例化一个FlutterEngine

class MyApplication : Application() {
   
   
    lateinit var flutterEngine: FlutterEngine
    override fun onCreate() {
   
   
        super.onCreate()
        flutterEngine = FlutterEngine(this)
        flutterEngine.dartExecutor.executeDartEntrypoint(DartExecutor.DartEntrypoint.createDefault())
        FlutterEngineCache.getInstance().put("my_engine_id", flutterEngine)
    }
}

然后在Activity中跳转

        btn.setOnClickListener {
   
   
            startActivity(FlutterActivity.withCachedEngine("my_engine_id").build(this))
        }

注意:使用withCachedEngine()工厂方法时,请传递与缓存所需的ID相同的ID FlutterEngine

设置缓存引擎时也可以初始路由,修改MyApplication

        flutterEngine = FlutterEngine(this)
        flutterEngine.navigationChannel.setInitialRoute("route") //可以借此携带一些字符串数据,可传递到flutter页面
        flutterEngine.dartExecutor.executeDartEntrypoint(DartExecutor.DartEntrypoint.createDefault())
        FlutterEngineCache.getInstance().put("my_engine_id", flutterEngine)

对应的dart

import 'dart:ui';
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
   
   
  @override
  Widget build(BuildContext context) {
   
   
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: _widgetForRoute(window.defaultRouteName),
    );
  }
}

//路由的选择
Widget _widgetForRoute(String route) {
   
   
  switch (route) {
   
   
    case 'route':
      return MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: Text('Flutter页面'),
          ),
          body: Center(
            child: Text('行走的猪蹄',
                style: TextStyle(color: Colors.red),
                textDirection: TextDirection.ltr),
          ),
        ),
      );
    default:
      return Center(
        child: Text('Unknown route: $route',
            style: TextStyle(color: Colors.red),
            textDirection: TextDirection.ltr),
      );
  }
}
点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
待兔 待兔
5个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
浩浩 浩浩
3年前
【Flutter实战】初识Flutter
1.2初识Flutter1.2.1Flutter简介Flutter是Google推出并开源的移动应用开发框架,主打跨平台、高保真、高性能。开发者可以通过Dart语言开发App,一套代码同时运行在iOS和Android平台。Flutter提供了丰富的组件、接口,开发者可以很快地为Flutter添加native扩展。同时Flu
Stella981 Stella981
3年前
Flutter与Android混合开发及Platform Channel的使用
1.相对于单独开发Flutter应用,混合开发对于线上项目更具有实际意义,可以把风险控制到最低,也可以进行实战上线。所以介绍集成已有项目2.混合开发涉及原生Native和Flutter进行通信传输,还有插件编写,所以介绍两端通信FlutterPlatformChannel的使用WanAndroid客
Stella981 Stella981
3年前
Flutter 笔记
最近开发需要,要接触移动端一些东西,所以看一下flutter。因为移动端经常是要做一样事情就是即要有android平台,又要有ios平台,所以,选择了Flutter。为什么不是ReactNative?因为,Flutter字比较少,而且不用打空格,我喜欢。一、安装1.下载2.解压3.设置path4.开始二、
Stella981 Stella981
3年前
Flutter 1.0 正式版: Google 的便携 UI 工具包
Flutter1.0正式版:Google的便携UI工具包文/TimSneath,GoogleDart&Flutter产品组产品经理Flutter是Google打造的UI工具包,通过一套代码同时在iOS和Android上构建媲美原生体验的精美应用!如今,移动开发者们在同时兼容iOS和Android
Stella981 Stella981
3年前
DStack
混合开发这项技术由来已久,目前市面上主流的有Hybird,ReactNative,Weex,Flutter等。其中,Flutter以他独有的实现方式,优秀的性能,成为近两年最火的混合开发方案,我们学而思网校1v1客户端团队也是比较早的开始了Flutter技术的研究,在学而思网校1v1家长端和学而思网校1v1教师端两个App进行了大规模的实践尝试,由此也沉淀出
Flutter热更新技术探索 | 京东云技术团队
APP发布到市场后,难免会遇到严重的BUG阻碍用户使用,因此有在不发布新版本APP的情况下使用热更新技术立即修复BUG需求。原生APP(例如:Android&IOS)的热更新需求已经比较成熟,但Flutter技术栈目前还缺少类似的技术方案,因此Flutter研发团队,也需要类似的热更新技术。
田楷 田楷
3星期前
鸿蒙Flutter实战:07-混合开发
鸿蒙Flutter实战:混合开发鸿蒙Flutter混合开发主要有两种形式。1.基于har将fluttermodule打包成har包,在原生鸿蒙项目中,以har包的方式引入。其优点是主项目开发者可以不关注Flutter实现,不需要安装配置Flutter开发环