Flutter双屏交互插件开发与通信指南

Question

支持收银应用等双屏交互场景，例如主屏作为操作屏、副屏作为客显屏。该插件专为双屏安卓设备设计，主副屏均采用Flutter开发，提供了一套方法来实现双屏间的通信交互，从而统一技术栈，降低开发和维护成本，并通过创新的双引擎通信机制确保高效交互。

在pubspec.yaml文件中添加依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_subscreen_plugin: ^1.0.8

使用Flutter进行主副屏的UI绘制，并通过封装的能力实现交互通信。以下是具体步骤：

1. 在main入口区分主副屏

在应用的入口处，根据路由名称判断当前是主屏还是副屏，并分别运行对应的应用。

void main() {
  var defaultRouteName = window.defaultRouteName;
  if ("subMain" == defaultRouteName) {
    viceScreenMain();
  } else {
    defaultMain();
  }
}

// 主屏UI
void defaultMain() {
  runApp(MainApp());
}

// 副屏UI
void viceScreenMain() {
  runApp(SubApp());
}

2. 主屏发送数据给副屏

使用SubScreenPlugin.sendMsgToViceScreen方法从主屏向副屏发送数据。

SubScreenPlugin.sendMsgToViceScreen("data", params: {"params": "123"});

3. 副屏接收主屏数据

副屏通过监听SubScreenPlugin.viceStream来接收主屏发送的数据。

SubScreenPlugin.viceStream.listen((event) {
  print(event.arguments.toString());
});

4. 检查设备是否支持双屏

调用SubScreenPlugin.isMultipleScreen方法获取当前设备是否支持双屏。

SubScreenPlugin.isMultipleScreen((result) {
  print("是否支持双屏：$result");
});

5. 检查overlay窗口权限

使用SubScreenPlugin.checkOverlayPermission方法判断应用是否具备overlay窗口权限，这对于将副屏设置为持久窗口很重要。

SubScreenPlugin.checkOverlayPermission((result) {
  print("是否支持overlay：$result");
});

6. 申请overlay窗口权限

如果需要，可以通过SubScreenPlugin.requestOverlayPermission方法申请overlay权限。

SubScreenPlugin.requestOverlayPermission();

7. 开启和关闭副屏

使用SubScreenPlugin.doubleScreenShow和SubScreenPlugin.doubleScreenCancel方法来控制副屏的显示和关闭。

SubScreenPlugin.doubleScreenShow();   // 开启副屏
SubScreenPlugin.doubleScreenCancel(); // 关闭副屏

8. 支付设置初始化后自动显示副屏

在Android配置中，可以通过修改attrs.xml文件来设置在初始化时自动显示副屏。

true

9. 副屏引擎的三方插件扩展

如果在副屏中引入了第三方插件（如camera），需要在Android的MainActivity的onCreate方法中进行注册，以确保插件在副屏引擎中正常工作。

FlutterSubscreenPlugin.registerThirdPlugins(
    arrayListOf(
        io.flutter.plugins.camera.CameraPlugin(),
    ),
    this.flutterEngine!!.plugins
)

完成上述配置后，即可实现基本的双屏交互功能。完整的使用样例可以参考插件中的example目录，更多实现原理可查阅相关文档。