更新记录

1.0.1(2023-11-15)

  1. 支持主副屏双向通信
  2. 支持腾讯X5内核浏览器
  3. 支持本地Html显示
  4. 支持远程Url显示

平台兼容性

Android Android CPU类型 iOS
适用版本区间:5.0 - 12.0 armeabi-v7a:支持,arm64-v8a:支持,x86:支持 ×

原生插件通用使用流程:

  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. 支持主副屏双向通信
  2. 支持腾讯X5内核浏览器
  3. 支持本地Html显示
  4. 支持远程Url显示

插件使用说明:

  1. 引入方式
    const presentation = uni.requireNativePlugin('shimiso-presentation');
  2. 打开manifest.json文件,找到App模块配置,勾选上Android X5 Webview(腾讯TBS)即可
  3. 调用show方法打开副屏
    presentation.show('http://www.163.com');
  4. 调用loadUrl方法加载网络地址
    presentation.loadUrl('http://www.163.com')//加载网络地址  
  5. 调用loadUrl方法加载本地地址
    //格式:file:///android_asset/apps/__UNI__D1A49E0/www/static/test.html
    presentation.loadUrl('file:///android_asset/apps/__UNI__D1A49E0/www/static/test.html')//加载本地地址

示例代码(主屏)

<template>
    <view style="display: flex;margin:10px;flex-direction: column;">
        <view style="margin-top: 10px;">
            <button @click="showSubScreen()">显示副屏</button>
        </view>
        <view style="margin-top: 10px;">
            <button @click="sendDataToSubScreen()">向副屏发送消息</button>
        </view>
        <view style="margin-top: 10px;">
            <button @click="loadSubScreenUrl()">设置副屏URL</button>
        </view>
        <view style="margin-top: 10px;">
            <button @click="closeSubScreen()">关闭副屏</button>
        </view>
        <view style="margin-top: 10px;">副屏发来的消息:</view>
        <view>{{msg}}</view>
    </view>
</template>
<script>
//引入方式
const presentation = uni.requireNativePlugin('shimiso-presentation');
export default {
    data() {
        return {
            msg:''
        }
    },  
    created() {
        //功能1:接受副屏幕发来的消息
        plus.globalEvent.addEventListener('SubScreenEvent', function(e){
            modal.toast({
                message: "副屏发来的信息:" + JSON.stringify(e),
                duration: 1.5
            });
        });
    },
    methods: {
        //功能2:打开分屏页面   
        showSubScreen(){
            presentation.show('http://www.163.com');
        },
        //功能3:加载地址
        loadSubScreenUrl(){         
            presentation.loadUrl('http://www.163.com')//加载网络地址  
            presentation.loadUrl('file:///android_asset/apps/__UNI__D1A49E0/www/static/test.html')//加载本地地址
        }
        //功能4:关闭分屏页面 
        closeSubScreen(){
            presentation.close();
        },  
        //功能5:向副屏发送消息 
        sendDataToSubScreen(){
            let json={state:"主屏消息",data:'你好!'}
            presentation.sendDataToSubScreen(json);
        }
    }   
</script>

示例代码(副屏)

<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, maximum-scale=1, minimum-scale=1, user-scale=1">
    <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
    <title>副屏示例</title>
</head>
<body>
<video style="width:50%; height: 300px;" controls>
    <source src="https://www.w3schools.com/html/mov_bbb.mp4" />
</video>
</br>
<button onclick="sendMsg()">向主屏发送数据</button> <p/>
<div id="content"></div>
</body>

<script type="text/javascript">
    // VConsole 默认会挂载到 `window.VConsole` 上
    var vConsole = new window.VConsole();
    //功能6:向主屏发送消息
    function sendMsg(){
        Android.sendDataToMainScreen("{'msg':'我来自副屏,哈哈!!'}")
    }

    //功能7:接受主屏发来的消息
    function mainScreenCallBack(data) {
        document.getElementById('content') = '这是主屏发送过来消息:' + JSON.stringify(data)
        console.log('mainScreenCallBack-->' + JSON.stringify(data));
    }
</script>

</html>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/> <uses-permission android:name="android.permission.TYPE_APPLICATION_OVERLAY"/> <uses-permission android:name="android.permission.SYSTEM_OVERLAY_WINDOW"/>

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问