更新记录

1.1.0(2023-05-04)

本次主要更新: 1.增加与弹出内容交互 2.增加隐藏系统按钮

1.0.0(2023-04-28)

首次提交


平台兼容性

Android iOS
× 适用版本区间:11 - 16

原生插件通用使用流程:

  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原生插件配置”->”云端插件“列表中删除该插件重新选择


KJ-Pip

应用外、全局、后台悬浮窗、画中画、在其他应用上层显示(ios)

注意事项

1.需要配置manifest.json->App常用其它设置->后台运行能力 audio

使用

<template>
    <view class="content">
        <button type="primary" @click="initPip1">初始化(正方形弹窗)</button>
        <button type="primary" @click="initPip2">初始化(横向弹窗)</button>
        <button type="primary" @click="initPip3">初始化(竖向弹窗)</button>
        <button type="primary" @click="openPip1">打开弹窗(本地html)</button>
        <button type="primary" @click="openPip2">打开弹窗(网站)</button>
        <button type="primary" @click="closePip">关闭弹窗</button>
        <view class="title">-------与弹窗内容交互-------</view>
        <button type="primary" @click="webView_evaluateJavaScript">webView执行js</button>
        <button type="primary" @click="webView_load">webView加载url</button>
        <button type="primary" @click="onH5SendDataCallBack">监听网页发送的数据</button>
    </view>
</template>

<script>
    const KJPip = uni.requireNativePlugin('KJ-Pip');
    export default {
        data() {
            return {

            }
        },
        onLoad() {
            var globalEvent = uni.requireNativePlugin('globalEvent');
            globalEvent.addEventListener('onPip', function(res) {
                console.log("onPip:" + JSON.stringify(res));
                if (res.method == "willStartPip") {
                    console.log("即将开启画中画");
                } else if (res.method == "didStartPip") {
                    console.log("已经开启画中画");
                } else if (res.method == "failedStartPip") {
                    console.log("开启画中画失败");
                } else if (res.method == "willStopPip") {
                    console.log("即将关闭画中画");
                } else if (res.method == "didStopPip") {
                    console.log("已经关闭画中画");
                } else if (res.method == "restorePip") {
                    console.log("恢复");
                }
            });
            globalEvent.addEventListener('onWebview', function(res) {
                console.log("onWebview:" + JSON.stringify(res));
                if (res.method == "finish") {
                    console.log("页面加载完成");
                } else if (res.method == "fail") {
                    console.log("加载失败");
                }
            });
            setTimeout((res) => {
                this.initPip1();
            }, 500)
            this.onH5SendDataCallBack();
        },
        methods: {
            initPip(shape) {
                var dic = {
                    "shape": shape, //弹窗形状 square(正方形) landscape(横向) portrait(竖向)
                    // "isShowSystemBtn": true, //是否显示 快进 后退 按钮
                    // "isShowSystemBtnV2": true //是否显示 快进 播放/暂停 后退 按钮、进度条、灰色背景
                }
                KJPip.initPip(dic)
            },
            initPip1() {
                this.initPip("square");
            },
            initPip2() {
                this.initPip("landscape");
            },
            initPip3() {
                this.initPip("portrait");
            },
            openPip(url) {
                KJPip.isPictureInPictureActive((res) => {
                    console.log("isPictureInPictureActive:" + JSON.stringify(res));
                })
                KJPip.isPictureInPictureSuspended((res) => {
                    console.log("isPictureInPictureSuspended:" + JSON.stringify(res));
                })
                KJPip.isPictureInPicturePossible((res) => {
                    console.log("isPictureInPicturePossible:" + JSON.stringify(res));
                })
                KJPip.isPictureInPictureSupported((res) => {
                    console.log("isPictureInPictureSupported:" + JSON.stringify(res));
                })
                var dic = {
                    "url": url
                }
                KJPip.openPip(dic, (res) => {
                    console.log("openPip:" + JSON.stringify(res));
                })
            },
            openPip1() {
                this.openPip(plus.io.convertLocalFileSystemURL("hybrid/html/index.html"));
            },
            openPip2() {
                this.openPip("https://ext.dcloud.net.cn/publisher?id=22130");
            },
            closePip() {
                KJPip.closePip()
            },
            webView_evaluateJavaScript() {
                var dic = {
                    "js": "changeImg()"
                }
                KJPip.webView_evaluateJavaScript(dic, (res) => {
                    console.log("webView_evaluateJavaScript:" + JSON.stringify(res));
                })
            },
            webView_load() {
                var dic = {
                    "url": "https://www.baidu.com/"
                }
                KJPip.webView_load(dic, (res) => {
                    console.log("webView_load:" + JSON.stringify(res));
                })
            },
            onH5SendDataCallBack() { //注意ios16之后,弹出里的内容不能点击
                KJPip.onH5SendDataCallBack((res) => {
                    console.log("onH5SendDataCallBack:" + JSON.stringify(res));
                    uni.showModal({
                        title: "监听网页发送的数据",
                        content: JSON.stringify(res)
                    })
                })
            },
        }
    }
</script>
<style>
    .title {
        text-align: center;
        margin-top: 8px;
        margin-bottom: 8px;
    }
</style>

隐私、权限声明

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

后台运行能力 audio

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

插件不采集任何数据

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

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