更新记录

1.0.0（2024-06-24）

双屏异显异触与主副屏相互通讯

平台兼容性

原生插件通用使用流程：

1. 购买插件，选择该插件绑定的项目。
2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

插件使用说明

1. 引入插件

   const DSdisplay = uni.requireNativePlugi('zhiqing-DSdisplay');
   <!-- 全局监听器 -->
   var globalEvent = uni.requireNativePlugin('globalEvent');

2. 显示副屏

   DSdisplay.showDisplay()

3. 关闭副屏

   DSdisplay.closeDisplay()

4. 副屏显示其他本地静态文件

   var path = plus.io.convertLocalFileSystemURL('/static/second/index.html');
   DSdisplay.changUrl("file://" + path)

5. 副屏显示其他网络地址

   DSdisplay.changUrl("http://baidu.com")

6. 主屏发消息给副屏

   DSdisplay.sendJS({
       data: "这是主屏消息"
   })

7. 监听副屏发来的消息

   globalEvent.addEventListener('H5Event', function(e) {
       console.log('H5Event' + JSON.stringify(e));
   });

副屏示例

<template>
    <view class="uni-container">
        <view class="uni-hello-text">
            <text class="hello-text">H5插件示例</text>
        </view>
        <!-- #ifdef H5 -->
        <view class="box">
            <text>副屏页面</text>
            <text>副屏副屏这是副屏</text>
            <button @click="setting">打开设置</button>
            <button @click="sendText">发送文字</button>
        </view>
        <!-- #endif -->
    </view>
</template>
<script>
    export default {
        data() {
            return {}
        },
        onLoad() {
            // #ifdef H5
            this.listenAndroid()
            // #endif

        },
        methods: {
            // #ifdef H5
            setting() {
                // 跳转设置,仅支持发送"setting"跳转设置功能
                window.DSdisplay.sendToFirstScreen(JSON.stringify({
                    data: "setting"
                }))
            },
            sendText() {
                // 发送数据给主屏
                window.DSdisplay.sendToFirstScreen(JSON.stringify({
                    data: "你好，我来自副屏"
                }))
            },
            listenAndroid() {
                // 监听主屏发来的消息
                window.receiveData = function(result) {
                    console.log(result.data)
                }
            }
            // #endif

        }
    }
</script>

<style>
    .box{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
</style>