更新记录

1.0.3(2024-11-01)

  • 修改已知问题
  • 更新文档

1.0.1(2024-03-23)

  • iOS端支持vue页面防截屏

1.0.0(2023-12-27)

新账号发布

查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间:5.0 - 14.0 armeabi-v7a:未测试,arm64-v8a:未测试,x86:未测试 适用版本区间:11 - 17

原生插件通用使用流程:

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


特别提醒

  • 购买本插件前,请先试用,并充分自测确认满足需求之后再行购买。虚拟物品一旦购买之后无法退款;
  • 如有使用上的疑问、bug,进交流群联系作者;
  • 作者可承接各种插件定制;
  • 请在合法范围内使用,若使用本插件做非法开发,本方概不负责;
  • vue3版本使用iOS防截屏功能需将vite.config.js文件放到项目根目录下(vite.config.js文件可在示例demo中获取)

功能

  • 支持截屏(iOS&Android)
  • 支持录屏(iOS&Android)
  • 支持防截屏/录屏(iOS&Android)
  • 支持图片与视频保存相册(iOS&Android)
  • 可控制录屏是否录制音频(iOS&Android)
  • 可监听截物理按键屏通知,并获取截屏图(仅iOS支持)
  • 支持删除指定路径文件(iOS&Android)

使用

  • 引入插件
const Screen = uni.requireNativePlugin('YT-screen'); 
  • 监听物理快键截屏动作(iOS监听是否可录屏/截屏也需要实现下面的方法)
onLoad() {
   // 监听物理按钮截屏Android无效
    // #ifdef APP-PLUS
    if (plus.os.name == "iOS") {
        Screen.screenshotNotification(res => {
            if (res.code == 200) {
                // 路径
                this.imagePath = res.path
                // base64
                // this.imagePath = res.base64
            }
            uni.showToast({
                title: res.msg,
                icon: 'none',
                duration: 1500
            })
        })
    }
    // #endif

},
  • 截屏
//截屏
    var imagePath = plus.io.convertLocalFileSystemURL("_doc/screen");
    var name = new Date().getTime() + ".jpg";
    Screen.screenCaptureWithPath({
        imagePath: imagePath,//保存文件路径
        imageName: name,//保存文件名称
        saveToAlbum: true//是否保存至相册
    }, res => {
        console.log(res);
        if (res.code == 200) {
            //截屏成功
            this.imagePath = res.path;
            console.log('截屏成功:' + res.path)
        } else {
            //失败
            uni.showToast({
                title: res.msg,
                icon: 'none',
                duration: 1500
            })
        }
    });
  • 录屏

注意:iOS只能录制应用内视频。

var videoPath = plus.io.convertLocalFileSystemURL('_doc');
var name = new Date().getTime() + ".mp4";
Screen.starScreenRecord({
    path: videoPath,//保存视频路径
    videoName: name,//保存视频名称
    isMicrophone: true,//是否录制音频
    saveToAlbum: true//视频是否保存相册
}, res => {
    if (res.code == 200) {
        //录制结束回调
        console.log("录屏本地路径:" + res.path)
        this.path = res.path;
    }
    uni.showToast({
        title: res.msg,
        icon: 'none',
        duration: 1500
                    })
});
  • 取消录屏
Screen.cancelScreenRecord();
  • 停止录屏-(会在Screen.starScreenRecord中回调录制的视频路径)
Screen.stopScreenRecord();
  • 停止录制带回调
Screen.finshScreenRecord(res=>{
    console.log(res.path)
    uni.showToast({
        title: res.msg,
        icon: 'none',
        duration: 1500
    })
})
  • 开启与关闭防截屏/防录屏

开启与关闭防截屏、录屏 由于iOS无法通过api进行防截屏,所以iOS端要实现防截屏需要在最外层套一个component组件(component组件只在nvue有效。如果无iOS端防止截屏需求可不使用该component组件,直接使用module组件即可。使用component组件也不影响Android,在android相当于一个view),详情见下方完整实例代码。

//开启防录屏截屏
if (plus.os.name == "Android") {
    Screen.openPreventScreenRecording();
} else if (plus.os.name = "iOS") {
    this.$refs.screen.openPreventScreenRecording();
}

//关闭防录屏截屏
if (plus.os.name == "Android") {
    Screen.offPreventScreenRecording();
} else if (plus.os.name = "iOS") {
    this.$refs.screen.offPreventScreenRecording();
}
  • 删除指定路径文件(图片或视频)
Screen.removePath(path, res => {
    if (res.result == true) {
        uni.showToast({
            title: "删除成功",
            icon: 'none',
            duration: 1500
        })
    } else {
        uni.showToast({
            title: "删除失败",
            icon: 'none',
            duration: 1500
        })
    }
});

完整示例代码

<template>
    <view class="content1">
        <!-- yt-screen:component组件需在nvue中使用,不影响Android端。用于iOS开启/关闭防截屏录屏。 -->
        <yt-screen ref="screen" style="width: 750rpx;flex: 1;flex-direction: column;align-items: center;">
            <navigator url="screen2"
                style="width: 600rpx;height: 80rpx;background-color: cornflowerblue;display: flex;align-items: center;justify-content: center;">
                跳转</navigator>
            <view class="btn" @click="starLP()">
                <text>开始录屏</text>
            </view>
            <view class="btn" @click="stopLP()">
                <text>停止录屏</text>
            </view>
            <view class="btn" @click="stopLP2()">
                <text>停止录屏(带回调)</text>
            </view>
            <view class="btn" @click="cancelLP()">
                <text>取消录屏</text>
            </view>
            <view class="btn" @click="jp()">
                <text>截屏</text>
            </view>
            <view class="btn" @click="starUnLP()">
                <text>开启防录屏/截屏</text>
            </view>
            <view class="btn" @click="endUnLP()">
                <text>停止防录屏/截屏</text>
            </view>
            <view class="btn" @click="removePath(0)">
                <text>删除视频</text>
            </view>
            <view class="btn" @click="removePath(1)">
                <text>删除截屏</text>
            </view>
            <!-- <web-view src="https://www.baidu.com" style="width: 750rpx;height: 400rpx;"></web-view> -->
            <video :src="path" :autoplay="true" :loop="true" style="width: 750rpx;height: 400rpx;"></video>
        </yt-screen>
    </view>
</template>

<script>
    const Screen = uni.requireNativePlugin('YT-screen'); //插件
    export default {
        data() {
            return {
                imagePath: "",
                // path1: "_doc/screen/1697679077184.mp4",
                path: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4"
            }
        },
        onLoad() {
            // 监听物理按钮截屏Android无效
            // #ifdef APP-PLUS
            if (plus.os.name == "iOS") {
                Screen.screenshotNotification(res => {
                    if ("200" == res.code) {
                        // 路径
                        this.imagePath = res.path
                        // base64
                        // this.imagePath = res.base64
                    }
                    uni.showToast({
                        title: res.msg,
                        icon: 'none'
                    })
                })
            }
            // #endif

        },
        onUnload() {
            console.log('销毁')
            // 取消录制
            Screen.cancelScreenRecord();
        },
        onHide() {

        },
        onShow() {

        },
        methods: {
            starLP() {
                var videoPath = plus.io.convertLocalFileSystemURL('_doc/screen');
                var name = new Date().getTime() + ".mp4";
                Screen.starScreenRecord({
                    path: videoPath,
                    videoName: name,
                    isMicrophone: true,
                    saveToAlbum: true
                }, res => {
                    console.log("res: " + JSON.stringify(res));
                    if (res.code == 200) {
                        //录制结束回调
                        console.log("录屏本地路径:" + res.path)
                        this.path = res.path;
                    }
                    uni.showToast({
                        title: res.msg,
                        icon: 'none',
                        duration: 1500
                    })
                });
            },
            stopLP() {
                //停止录屏
                Screen.stopScreenRecord();
            },
            stopLP2() {
                // 停止录屏带回调
                Screen.finshScreenRecord(res => {
                    console.log(res.path)
                    uni.showToast({
                        title: res.msg,
                        icon: 'none',
                        duration: 1500
                    })
                })
            },
            cancelLP() {
                Screen.cancelScreenRecord();
            },
            jp() {
                //截屏
                var imagePath = plus.io.convertLocalFileSystemURL("_doc/screen");
                var name = new Date().getTime() + ".jpg";
                Screen.screenCaptureWithPath({
                    imagePath: imagePath,
                    imageName: name,
                    saveToAlbum: false
                }, res => {
                    console.log(res);
                    if (res.code == 200) {
                        //截屏成功,保存图片到相册
                        this.imagePath = res.path;
                        uni.saveImageToPhotosAlbum({
                            filePath: res.path,
                            success: function() {
                                console.log('save success');
                            }
                        });
                        console.log('截屏成功:' + res.path)
                    } else {
                        //失败
                        uni.showToast({
                            title: res.msg,
                            icon: 'none',
                            duration: 1500
                        })
                    }
                });
            },
            starUnLP() {
                //开启防录屏截屏
                if (plus.os.name == "Android") {
                    Screen.openPreventScreenRecording();
                } else if (plus.os.name = "iOS") {
                    this.$refs.screen.openPreventScreenRecording();
                }

            },
            endUnLP() {
                //关闭防录屏截屏
                if (plus.os.name == "Android") {
                    Screen.offPreventScreenRecording();
                } else if (plus.os.name = "iOS") {
                    this.$refs.screen.offPreventScreenRecording();
                }

            },
            removePath(index) {
                let path = "";
                if (index == 0) {
                    path = this.path
                } else if (index == 1) {
                    path = this.imagePath
                }
                if (path == "") {
                    return;
                }
                Screen.removePath(path, res => {
                    if (res.result == true) {
                        uni.showToast({
                            title: "删除成功",
                            icon: 'none',
                            duration: 1500
                        })
                    } else {
                        uni.showToast({
                            title: "删除失败",
                            icon: 'none',
                            duration: 1500
                        })
                    }
                });
            }

        }
    }
</script>

<style>
    .content1 {
        display: flex;
        flex-direction: column;
        width: 750rpx;
        align-items: center;
        flex: 1;
        background-color: aqua;
    }

    .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 400rpx;
        height: 80rpx;
        margin-top: 30rpx;
        border-radius: 8rpx;
        background-color: bisque;
    }
</style>

注意事项

iOS防截屏/录屏在iOS13及以上版本有效。

隐私、权限声明

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

Android: <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.RECORD_AUDIO"/> iOS: NSMicrophoneUsageDescription NSPhotoLibraryAddUsageDescription NSPhotoLibraryUsageDescription

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

插件不采集任何数据

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

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