android flutter 混合开发,Flutter(Android 混合开发)

最新推荐文章于 2024-04-06 19:36:56 发布

鱼板饭

最新推荐文章于 2024-04-06 19:36:56 发布

阅读量144

点赞数

文章标签： android flutter 混合开发

Flutter(Android 混合开发)

发布时间：2018-12-29 17:11,

浏览次数：543

, 标签：

Flutter

Android

<>前言

Flutter 支持作为 android Moudle 出现在项目中.这样就可以在已有的项目中使用.

虽然现在Flutter 比较受关注,但是和weex 一样 ,大部分都只是在观望不是真正的进行使用.所以如果用还是混合开发原生+Flutter

方式比较合适(自我感觉).

写一个demo 进行Android及Flutter 交互.(IOS 方法基本一致).

Flutter 调用 android 硬件的插件还比较匮乏比如各种传感器, 自定义相机所以就会用到 Flutter 调用android

及android 原生调用 Flutter的方法.

<>本例子中会实现.

<>(1) 原有的android 应用程序嵌入 FlutterView

<>(2) Flutter 代码调用Android 原生方法进行页面跳转及传值

<>(3) Android原生调用 Flutter 方法进行传值

步骤

新建一个 android 项目

然后在同级目录创建一个Flutter Moudle

然后导入 Flutter Moudle

Moudle 导入成功后项目结构

app 目录下的

build.gradle 中新增了

implementation project(':flutter')

项目目录下的

settings.gradle 增加

setBinding(new Binding([gradle: this])) evaluate(new File(

settingsDir.parentFile, 'flutter_test_module\\.android\\include_flutter.groovy'

)) 基础框架就搭建成功了

Demo 实现

最上层放置了一个 Android原生 TextView 下方使用的FlutterView

flutterView = Flutter.createView(this, getLifecycle(), "route2");

FrameLayout.LayoutParams layoutParams = new

FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT,

FrameLayout.LayoutParams.MATCH_PARENT); frameLayout.addView(flutterView,

layoutParams);

其中 flutterView = Flutter.createView(this, getLifecycle(), “route2”); route2

与flutter_test_module lib 文件夹下 main.dart 中所对应希望加载哪个页面就填写相应的 route 名称.

Widget _widgetForRoute(String route) { switch (route) { case 'route1': return

MyHomePage(title: 'Flutter Demo Home Page1'); case 'route2': return

MyHomePage(title: 'Flutter Demo Home Page2'); default: return MyHomePage(title:

'Flutter Demo Home Page2'); } }

Flutter 调用Android

java

new MethodChannel(flutterView,

FlutterToAndroidCHANNEL).setMethodCallHandler(new

MethodChannel.MethodCallHandler() { @Override public void

onMethodCall(MethodCall methodCall, MethodChannel.Result result) {

//接收来自flutter的指令withoutParams if (methodCall.method.equals("withoutParams")) {

//跳转到指定Activity Intent intent = new Intent(NativeActivity.this,

NativeActivity.class); startActivity(intent); //返回给flutter的参数

result.success("success"); } //接收来自flutter的指令withParams else if

(methodCall.method.equals("withParams")) { //解析参数 String text =

methodCall.argument("flutter"); //带参数跳转到指定Activity Intent intent = new

Intent(NativeActivity.this, NativeActivity.class); intent.putExtra("test",

text); startActivity(intent); //返回给flutter的参数 result.success("success"); } else

{ result.notImplemented(); } } });

dart

Future _jumpToNative() async { String result = await

toAndroidPlugin.invokeMethod('withoutParams'); print(result); } Future

_jumpToNativeWithParams() async { Map map = { "flutter":

"这是一条来自flutter的参数" }; String result = await

toAndroidPlugin.invokeMethod('withParams', map); print(result); }

Android 向 Flutter 传参

java

new EventChannel(flutterView, AndroidToFlutterCHANNEL) .setStreamHandler(new

EventChannel.StreamHandler() { @Override public void onListen(Object o,

EventChannel.EventSink eventSink) { String androidParmas = "来自android原生的参数";

eventSink.success(androidParmas); } @Override public void onCancel(Object o) {

} });

dart

void _startfromAndroiPlugin(){ if(_fromAndroiSub == null){ _fromAndroiSub =

fromAndroiPlugin.receiveBroadcastStream() .listen(_onfromAndroiEvent,onError:

_onfromAndroiError); } } void _onfromAndroiEvent(Object event) { setState(() {

_nativeParams = event; }); } void _onfromAndroiError(Object error) {

setState(() { _nativeParams = "error"; print(error); }); }

有几处要注意一一对应

new EventChannel(flutterView, AndroidToFlutterCHANNEL)