CN116795356B - Flutter与原生平台的混合开发方法、系统及装置 - Google Patents

Abstract

本发明提出的一种Flutter与原生平台的混合开发方法、系统及装置，属于计算机技术领域，所述方法包括：发布Flutter的arr文件；建立发布的arr文件与原始平台项目的依赖关系；创建Flutter与原生平台的双向消息通道；创建Flutter与原生平台的双向页面启动通道；在原生平台中封装定义Flutter消息；在Flutter中定义原生平台的消息。本发明通过进行Flutter接入封装和消息的抽象，使得原生平台和后台的交互更加流畅清晰，从而降低了代码编写的工作量，提高了研发效率。

Description

Flutter与原生平台的混合开发方法、系统及装置

技术领域

本发明涉及计算机技术领域，更具体的说是涉及一种Flutter与原生平台的混合开发方法、系统及装置。

背景技术

Flutter是Google一个新的用于构建跨平台的手机App的软件开发工具包SDK。 写一份代码，在Android 和iOS平台上都可以运行。Flutter使用Dart语言开发，结合C, C++,和Skia（2D渲染引擎）构建支持hotreload，包含着完整的控件和工具链。 Dart可以被编译(AOT)成不同平台的本地代码，让Flutter可以直接和平台通讯而不需要一个中间的桥接过程，从而提高了性能。

Flutter具有一致的统一对象模型：控件。 一个控件可以定义结构元素（比如按钮或菜单）、风格元素（比如字体或 颜色方案）、布局的方面（比如填充）、一些业务逻辑等。控件本身通常由许多小型、单用途的控件组成，结合起来产生强大的效果，类的层次结构是扁平的，以最大化可能的组合数量。Flutter具有强化版的WebView，框架仅提供一个View层，大部分功能要依赖原生。

当前， Flutter的开发工作和移动原生平台的开发工作通常不是一个人负责，由此在多方配合开发的过程中，怎么能解耦、友好、便捷的对接，就有了很大的需求。目前移动端应用还没有相关的方案方法，或者说没有类似的解决工作流的方法。可见，如何实现Flutter与原生平台的混合开发，使不同岗位的开发人员在后续的开发和工作中有迹可循，提高研发效率，是我们亟待解决的问题。

发明内容

针对以上问题，本发明的目的在于提供一种Flutter与原生平台的混合开发方法、系统及装置，通过进行Flutter接入封装和消息的抽象，使得原生平台和后台的交互更加流畅清晰，从而降低了代码编写的工作量，提高了研发效率。

本发明为实现上述目的，通过以下技术方案实现：一种Flutter与原生平台的混合开发方法，包括：

发布Flutter的arr文件；

建立发布的arr文件与原始平台项目的依赖关系；

创建Flutter与原生平台的双向消息通道；

创建Flutter与原生平台的双向页面启动通道；

在原生平台中封装定义Flutter消息；

在Flutter中定义原生平台的消息。

进一步，所述发布Flutter的arr文件，包括：

将Flutter的业务代码打包成arr文件，并发布到私有仓库中。通过对Flutter和原生平台开发隔离的工程化方式，使得各个技术栈之间分离，分工明确，互不干扰。

进一步，所述建立发布的arr文件与原始平台项目的依赖关系，包括：

将发布出来的Flutter的arr 文件，通过远程仓库依赖的方式，依赖到原生平台的项目中，做到了方便快捷、侵入性极低的效果。

进一步，所述创建Flutter与原生平台的双向消息通道，包括：

通过Flutter内置的MethodChannel类，创建两个消息通道，分别负责Flutter到原生平台和原生平台到Flutter的消息处理，从而实现了消息的有效区分。

进一步，所述创建Flutter与原生平台的双向消息通道具体为：

通过Flutter内置的MethodChannel类，创建消息通道methodChannel和messageChannel；

其中，methodChannel 是Flutter向Android原生平台发送消息的通道，

messageChannel 是Android原生平台向Flutter 发送消息的通道；

为消息通道methodChannel设置一个methodCallHandler接口，用于消息的封装处理；

当Android原生平台向Flutter 发送消息时，通过调用messageChannel的send方法发送消息。

进一步，所述创建Flutter与原生平台的双向页面启动通道，包括：

通过编写Flutter的BoostDelegate类，建立页面启动类型的交互，并进行页面启动和普通消息的隔离，以实现Flutter与原生平台的双向页面启动的交互。创建双向页面启动的通道，做到页面启动和普通消息的隔离；Flutter启动原生平台和原生平台启动Flutter的隔离，使得代码更有层次，使得职责单一、维护性强。

进一步，所述在原生平台中封装定义Flutter消息，包括：

在原生平台封装抽象Flutter消息，并使用工厂模式派生消息子类。

进一步，所述在Flutter中定义原生平台的消息，包括：

在Flutter中封装抽象Android原生平台的消息，并使用工厂模式派生消息子类。具有可维护性、扩展性强的特点。

相应的，本发明还公开了一种Flutter与原生平台的混合开发系统，包括：

发布单元，用于发布Flutter的arr文件；

关联单元，用于建立发布的arr文件与原始平台项目的依赖关系；

消息通道创建单元，用于创建Flutter与原生平台的双向消息通道；

启动通道创建单元，用于创建Flutter与原生平台的双向页面启动通道；

第一消息定义单元，用于在原生平台中封装定义Flutter消息；

第二消息定义单元，用于在Flutter中定义原生平台的消息。

相应的，本发明公开了一种Flutter与原生平台的混合开发装置，包括：

存储器，用于存储Flutter与原生平台的混合开发程序；

处理器，用于执行所述Flutter与原生平台的混合开发程序时实现如上文任一项所述Flutter与原生平台的混合开发方法的步骤。

对比现有技术，本发明有益效果在于：本发明公开了一种Flutter与原生平台的混合开发方法、系统及装置，通过aar依赖的方式，将Flutter 和原生平台开发拆分开来；同时通过定义消息协议以及对消息通道的整合使得原生平台和后台的交互变得流畅清晰，在通过设计模式，增加了开发过程中的扩展性和维护性。本发明通过工程化的方法、Flutter接入封装和消息的抽象，极大降低了相同功能编写重复代码的工作，代码数据量少，用法简单，可维护性、可阅读性得到了显著提升。

由此可见，本发明与现有技术相比，具有突出的实质性特点和显著的进步，其实施的有益效果也是显而易见的。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。

图1是本发明的方法流程图；

图2是本发明的系统结构图。

图中，1、发布单元；2、关联单元；3、消息通道创建单元；4、启动通道创建单元；5、第一消息定义单元；6、第二消息定义单元。

具体实施方式

为了使本技术领域的人员更好地理解本发明方案，下面结合附图和具体实施方式对本发明作进一步的详细说明。显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

实施例一：

如图1所示，本实施例提供了一种Flutter与原生平台的混合开发方法，包括如下步骤：

S1：发布Flutter的arr文件。

将Flutter的业务代码打包成arr文件，并发布到私有仓库中。其中，需要Flutter单独开发，单独打包成Arr文件，提供给原生平台，做到双平台隔离解耦。

作为示例的，首先将Flutter的业务代码打包成arr文件，具体代码如下：

rm -rf build

flutter build aar --no-tree-shake-icons

--build-number xxx-SNAPSHOT

其中，build-number xxx-SNAPSHOT 的xxx指的是版本号。

然后，通过执行如下程序将文件发送到私有仓库中：

function upload(){

echo "开始上传："

echo "pom文件：$1"

echo "aar文件：$2"

# mvn上传命令，这里由于将上传用户名密码配置于全局maven settings.xml，则无需再指定用户名密码

mvn deploy:deploy-file \

-DpomFile="$1" \

-DgeneratePom=false \

-Dfile="$2" \

-Durl="http://xxx/repository/wnong-maven-snapshots/" \

-DrepositoryId="wnong-maven-snapshots" \

-Dpackaging=aar \

-s="$configPath"

}

其中，Durl指的是我们的私有仓库地址。

由此，实现了将打好的aar包，发布到我们的私有仓库中。

S2：建立发布的arr文件与原始平台项目的依赖关系。

具体的，发布出来的Flutter的arr 包，通过远程仓库依赖的方式，依赖到Android平台的原生项目中。代码如下：

flutter_version = '4.4.2-SNAPSHOT'

depsLibs = [

flutter_sdk_release : "com.weinong.user.flutter.flutter_module:flutter_release:$flutter_version"

]

releaseApi

rootProject.depsLibs.flutter_sdk_release

S3：创建Flutter与原生平台的双向消息通道。

通过Flutter内置的MethodChannel类，创建两个消息通道，分别负责Flutter到原生平台和原生平台到Flutter的消息处理，从而实现了消息的有效区分。

本步骤通过主要是编写通道创建的逻辑来实现上述功能，具体代码如下：

fun initFlutter(app: Application) {

val methodChannel = MethodChannel(

FlutterBoost.instance().engine.dartExecutor,

"wnong.flutter.io/charging"

)

methodChannel.setMethodCallHandler(FlutterMethodCallHandler())

messageChannel = BasicMessageChannel<Any>(

FlutterBoost.instance().engine.dartExecutor,

"wnong.flutter.io/battery",

StandardMessageCodec.INSTANCE

)

messageChannel?.setMessageHandler { message, reply ->

val resultMap: MutableMap<String, Any>= HashMap()

resultMap["message"] = "返回给原生的数据"

resultMap["code"] = 200

reply.reply(resultMap)

}

}

其中，methodChannel 是Flutter向Android原生平台发送的消息通道，

messageChannel 是Android向Flutter 发送消息的通道；给methodChannel设置了一个methodCallHandler，用于封装处理各种消息。

当Android原生平台想要给Flutter发送消息的时候，需要调用messageChannel的send方法发送消息。

S4：创建Flutter与原生平台的双向页面启动通道。

通过编写Flutter的BoostDelegate类，建立页面启动类型的交互，并进行页面启动和普通消息的隔离，以实现Flutter与原生平台的双向页面启动的交互。

作为示例的，利用重写FlutterBoostDelegate的方法，做到了双方页面启动的交互，具体代码如下：

public class FlutterBoostDelegate implements com.idlefish.flutterboost.FlutterBoostDelegate {

@Override

public void pushNativeRoute(String pageName, Map<String, Object>params) {

FlutterBoost.instance().currentActivity().startActivity(intent);

if (pageName.equals("native://common/web_view")) {

Intent intent = new Intent(FlutterBoost.instance().currentActivity(), NativePayWebActivity.class);

intent.putExtra("url", params.get("url").toString());

intent.putExtra("title", params.get("title").toString());

FlutterBoost.instance().currentActivity().startActivity(intent);

} else if (pageName.equals("native://common/video")) {

Intent intent = new Intent(FlutterBoost.instance().currentActivity(), BinRecordActivity.class);

intent.putExtra(BinRecordActivity.ARG_CLIENT, "FLUTTER");

intent.putExtra(BinRecordActivity.ARG_MAX_TIME, params.get("maxTime").toString());

FlutterBoost.instance().currentActivity().startActivity(intent);

}

}

@Override

public void pushFlutterRoute(String pageName, String uniqueId, Map<String, Object>arguments) {

Intent intent = new FlutterActivityExt.CachedEngineIntentBuilder(FlutterActivityExt.class, FlutterBoost.ENGINE_ID)

.backgroundMode(FlutterActivityLaunchConfigs.BackgroundMode.transparent)

.destroyEngineWithActivity(false)

.uniqueId(uniqueId)

.url(pageName)

.urlParams(arguments)

.build(FlutterBoost.instance().currentActivity());

FlutterBoost.instance().currentActivity().startActivity(intent);

if (pageName.equals(RouterPath.Finance.PAGE_MAIN_LIST)&&arguments !=null) {

String auth = (String) arguments.get("AUTH");

if (auth != null) {

FlutterBoost.instance().currentActivity().finish();

}

}

}

}

S5：在原生平台中封装定义Flutter消息。

具体来说，在原生平台封装抽象Flutter消息，并使用工厂模式派生消息子类。

作为示例的，首先定义基础消息类型，具体代码如下：

open abstract class BaseFlutterMsg {

abstract fun dealMsg(call: MethodCall, result: MethodChannel.Result)

}

然后，通过实现 MethodChannel.MethodCallHandler 类的onMethodCall方法，来接收消息，具体代码如下：

public class FlutterMethodCallHandler implementsMethodChannel.MethodCallHandler {

@Override

public void onMethodCall(@NonNull MethodCall call, @NonNullMethodChannel.Result result) {

FlutterMsgFactory.INSTANCE.createMsg(call, result);

}

}

最后，定义工厂类，创建消息，具体代码如下：

object FlutterMsgFactory {

fun createMsg(call: MethodCall, result:MethodChannel.Result){}

}

S6：在Flutter中定义原生平台的消息。

具体的，在Flutter中封装抽象Android原生平台的消息，并使用工厂模式派生消息子类。具有可维护性、扩展性强的特点。相关代码如下：

BasicMessageChannel basicMessageChannel =

BasicMessageChannel('wnong.flutter.io/battery', StandardMessageCodec());

basicMessageChannel.setMessageHandler(_addNativeMethod);

static Future<String>_addNativeMethod(message) async {

Map map = jsonDecode(message);

String code = map["code"];

BaseNativeMsg msg;

switch (code) {

}

msg.dealMessage(message)

}

Abstract class BaseNativeMsg {

dealMessage(msg);

}

通过以上方法实现了通过消息通道，接收到消息后，将消息解析并分发出去，并按照各个消息类型执行相应的操作，这样无论实在原生平台还是在Flutter开发中，都可以很简单的做到功能扩展。

实施例二：

基于实施例一，如图2所示，本发明还公开了一种Flutter与原生平台的混合开发系统，包括：发布单元1、关联单元2、消息通道创建单元3、启动通道创建单元4、第一消息定义单元5和第二消息定义单元6。

发布单元1，用于发布Flutter的arr文件。

作为示例的，发布单元1具体用于：将Flutter的业务代码打包成arr文件，并发布到私有仓库中。

关联单元2，用于建立发布的arr文件与原始平台项目的依赖关系。

作为示例的，关联单元2具体用于：将发布出来的Flutter的arr 文件，通过远程仓库依赖的方式，依赖到原生平台的项目中。

消息通道创建单元3，用于创建Flutter与原生平台的双向消息通道。

作为示例的，消息通道创建单元3具体用于：通过Flutter内置的MethodChannel类，创建两个消息通道，分别负责Flutter到原生平台和原生平台到Flutter的消息处理。

启动通道创建单元4，用于创建Flutter与原生平台的双向页面启动通道。

作为示例的，启动通道创建单元4具体用于：通过编写Flutter的BoostDelegate类，建立页面启动类型的交互，并进行页面启动和普通消息的隔离，以实现Flutter与原生平台的双向页面启动的交互。

第一消息定义单元5，用于在原生平台中封装定义Flutter消息。

作为示例的，第一消息定义单元5具体用于：在原生平台封装抽象Flutter消息，并使用工厂模式派生消息子类

第二消息定义单元6，用于在Flutter中定义原生平台的消息。

作为示例的，第二消息定义单元6具体用于：在Flutter中封装抽象Android原生平台的消息，并使用工厂模式派生消息子类。

本实施例公开了一种Flutter与原生平台的混合开发系统，通过aar依赖的方式，将Flutter 和原生平台开发拆分开来；同时通过定义消息协议以及对消息通道的整合使得原生平台和后台的交互变得流畅清晰，在通过设计模式，增加了开发过程中的扩展性和维护性。

实施例三：

本实施例公开了一种Flutter与原生平台的混合开发装置，包括处理器和存储器；其中，所述处理器执行所述存储器中保存的Flutter与原生平台的混合开发程序时实现以下步骤：

1、发布Flutter的arr文件。

2、建立发布的arr文件与原始平台项目的依赖关系。

3、创建Flutter与原生平台的双向消息通道。

4、创建Flutter与原生平台的双向页面启动通道。

5、在原生平台中封装定义Flutter消息。

6、在Flutter中定义原生平台的消息。

进一步的，本实施例中的Flutter与原生平台的混合开发装置，还可以包括：

输入接口，用于获取外界导入的Flutter与原生平台的混合开发程序，并将获取到的Flutter与原生平台的混合开发程序保存至所述存储器中，还可以用于获取外界终端设备传输的各种指令和参数，并传输至处理器中，以便处理器利用上述各种指令和参数展开相应的处理。本实施例中，所述输入接口具体可以包括但不限于USB接口、串行接口、语音输入接口、指纹输入接口、硬盘读取接口等。

输出接口，用于将处理器产生的各种数据输出至与其相连的终端设备，以便于与输出接口相连的其他终端设备能够获取到处理器产生的各种数据。本实施例中，所述输出接口具体可以包括但不限于USB接口、串行接口等。

通讯单元，用于在Flutter与原生平台的混合开发装置和外部服务器之间建立远程通讯连接，以便于Flutter与原生平台的混合开发装置能够将镜像文件挂载到外部服务器中。本实施例中，通讯单元具体可以包括但不限于基于无线通讯技术或有线通讯技术的远程通讯单元。

键盘，用于获取用户通过实时敲击键帽而输入的各种参数数据或指令。

显示器，用于运行Flutter与原生平台的混合开发过程的相关信息进行实时显示。

鼠标，可以用于协助用户输入数据并简化用户的操作。

综上所述，本发明通过进行Flutter接入封装和消息的抽象，使得原生平台和后台的交互更加流畅清晰，从而降低了代码编写的工作量，提高了研发效率。

本说明书中各个实施例采用递进的方式描述，每个实施例重点说明的都是与其它实施例的不同之处，各个实施例之间相同或相似部分互相参见即可。对于实施例公开的方法而言，由于其与实施例公开的系统相对应，所以描述的比较简单，相关之处参见方法部分说明即可。

专业人员还可以进一步意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

在本发明所提供的几个实施例中，应该理解到，所揭露的系统、系统和方法，可以通过其它的方式实现。例如，以上所描述的系统实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，系统或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能模块可以集成在一个处理单元中，也可以是各个模块单独物理存在，也可以两个或两个以上模块集成在一个单元中。

同理，在本发明各个实施例中的各处理单元可以集成在一个功能模块中，也可以是各个处理单元物理存在，也可以两个或两个以上处理单元集成在一个功能模块中。

结合本文中所公开的实施例描述的方法或算法的步骤可以直接用硬件、处理器执行的软件模块，或者二者的结合来实施。软件模块可以置于随机存储器(RAM)、内存、只读存储器(ROM)、电可编程ROM、电可擦除可编程ROM、寄存器、硬盘、可移动磁盘、CD-ROM、或技术领域内所公知的任意其它形式的存储介质中。

最后，还需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

以上对本发明所提供的Flutter与原生平台的混合开发方法、系统及装置进行了详细介绍。本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想。应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以对本发明进行若干改进和修饰，这些改进和修饰也落入本发明权利要求的保护范围内。

Claims (7)

1.一种Flutter与原生平台的混合开发方法，其特征在于，包括：

发布Flutter的arr文件；

建立发布的arr文件与原生平台项目的依赖关系；

创建Flutter与原生平台的双向消息通道；

创建Flutter与原生平台的双向页面启动通道；

在原生平台中封装定义Flutter消息；

在Flutter中定义原生平台的消息；

所述创建Flutter与原生平台的双向消息通道具体为：

通过Flutter内置的MethodChannel类，创建消息通道methodChannel和messageChannel；

其中，methodChannel 是Flutter向Android原生平台发送消息的通道，

messageChannel 是Android原生平台向Flutter 发送消息的通道；

为消息通道methodChannel设置一个methodCallHandler接口，用于消息的封装处理；

当Android原生平台向Flutter 发送消息时，通过调用messageChannel的send方法发送消息；

所述创建Flutter与原生平台的双向页面启动通道，包括：

通过编写Flutter的BoostDelegate类，建立页面启动类型的交互，并进行页面启动和普通消息的隔离，以实现Flutter与原生平台的双向页面启动的交互。

2.根据权利要求1所述的Flutter与原生平台的混合开发方法，其特征在于，所述发布Flutter的arr文件，包括：

将Flutter的业务代码打包成arr文件，并发布到私有仓库中。

3.根据权利要求2所述的Flutter与原生平台的混合开发方法，其特征在于，所述建立发布的arr文件与原生平台项目的依赖关系，包括：

将发布出来的Flutter的arr 文件，通过远程仓库依赖的方式，依赖到原生平台的项目中。

4.根据权利要求1所述的Flutter与原生平台的混合开发方法，其特征在于，所述在原生平台中封装定义Flutter消息，包括：

在原生平台封装抽象Flutter消息，并使用工厂模式派生消息子类。

5.根据权利要求1所述的Flutter与原生平台的混合开发方法，其特征在于，所述在Flutter中定义原生平台的消息，包括：

在Flutter中封装抽象Android原生平台的消息，并使用工厂模式派生消息子类。

6.一种Flutter与原生平台的混合开发系统，其特征在于，包括：

发布单元，用于发布Flutter的arr文件；

关联单元，用于建立发布的arr文件与原生平台项目的依赖关系；

消息通道创建单元，用于创建Flutter与原生平台的双向消息通道；

启动通道创建单元，用于创建Flutter与原生平台的双向页面启动通道；

第一消息定义单元，用于在原生平台中封装定义Flutter消息；

第二消息定义单元，用于在Flutter中定义原生平台的消息；

所述消息通道创建单元，具体用于：

通过Flutter内置的MethodChannel类，创建消息通道methodChannel和messageChannel；

其中，methodChannel 是Flutter向Android原生平台发送消息的通道，

messageChannel 是Android原生平台向Flutter 发送消息的通道；

为消息通道methodChannel设置一个methodCallHandler接口，用于消息的封装处理；

当Android原生平台向Flutter 发送消息时，通过调用messageChannel的send方法发送消息；

所述启动通道创建单元，具体用于：

通过编写Flutter的BoostDelegate类，建立页面启动类型的交互，并进行页面启动和普通消息的隔离，以实现Flutter与原生平台的双向页面启动的交互。

7.一种Flutter与原生平台的混合开发装置，其特征在于，包括：

存储器，用于存储Flutter与原生平台的混合开发程序；

处理器，用于执行所述Flutter与原生平台的混合开发程序时实现如权利要求1至5任一项权利要求所述的Flutter与原生平台的混合开发方法的步骤。