更新记录

6.1.1（2024-03-02）

1. 新增屏幕管理功能 (内测);

6.1.0（2024-02-07）

1. 新增V2版本播放器(内测);

6.0.1（2023-06-15）

1. 修复旧版播放器无法使用bug;

平台兼容性

原生插件通用使用流程：

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

腾讯云直播播放器

该模块可以实现腾讯云直播拉流播放，支持画面调整、播放控制、消息接收、屏幕截图、截流录制等。

接口模式(纯API)

扫描下方二维码，安装示例代码，快速体验插件功能:

Android	iOS	联系我们

扫码添加技术支持(微信号: ruanyunkeji006)，开通测试账号。

技术支持

建议扫码添加我们技术支持，协助接入和测试。

联系我们	微信号	更多功能
	ruanyunkeji006	截留录制 清晰切换 直播时移

API 接口文档

使用教程

快速开始

步骤 1: 集成插件

插件名称: RY-TencentLivePlayer

• 加载插件

1. 使用 自定义基座 ，引入插件；

2. 新建nvue文件，该插件必须在nvue中使用。在使用前，需要先加载插件。

<RY-TencentLivePlayer ref="livePlayer" v-bind:style = "{ width: playerWidth, height: playerHeight }"></RY-TencentLivePlayer>

说明:

可以通过修改width和height参数值的大小，来修改视频容器的大小。

• 腾讯云配置

注册或登录腾讯云账号，并开通云直播服务

步骤 2: 开始使用插件

使用 init 函数可以初始化插件，需要经过初始化之后，才可以使用各个函数接口功能。

this.$refs.livePlayer.init({
    docPath: plus.io.convertLocalFileSystemURL('_doc')
}, ret => {
    console.log(ret);
});

步骤 3: 设置监听

初始化后，可以通过使用 setLivePlayerListener 来设置监听，监听直播播放器的回调事件。

this.$refs.livePlayer.setLivePlayerListener({}, ret => {
    console.log(ret);
});

步骤 4: 启动播放

通过 startPlay 函数可以开启直播播放。

this.$refs.livePlayer.startPlay({
    flvUrl: 'http://2157.liveplay.myqcloud.com/live/2157_xxxx.flv',
    rect: {
        x: 0, 
        y: 0, 
        w: self.playerWidth,
        h: self.playerHeight
    }
}, ret => {
    console.log(ret);
});

关于 HLS（m3u8）

在 App 上我们不推荐使用 HLS 这种播放协议播放直播视频源（虽然它很适合用来做点播），因为延迟太高，在 App 上推荐使用 FLV 或者 RTMP 播放协议。

步骤 5: 画面调整

• 大小和位置

修改指定 startPlay 函数的rect参数，可以指定视图的位置和大小。可以通过调整标签的width和height来指定播放容器的大小。

• 调用 setRenderMode 铺满 or 适应

• 使用 setRenderRotation: 画面旋转

步骤 6: 暂停播放

对于直播播放而言，并没有真正意义上的暂停，通过调用 pause，所谓的直播暂停，只是画面冻结和关闭声音，而云端的视频源还在不断地更新着，所以当您调用 resume 的时候，会从最新的时间点开始播放，这跟点播是有很大不同的（点播播放器的暂停和继续与播放本地视频文件时的表现相同)。

this.$refs.livePlayer.pause({}, ret => {
    console.log(ret);
});

this.$refs.livePlayer.resume({}, ret => {
    console.log(ret);
});

步骤 7: 结束播放

stopPlay 结束播放时，会自动销毁播放器视频窗口。

this.$refs.livePlayer.stopPlay({}, ret => {
    console.log(ret);
});

步骤 8: 消息接收

此功能可以在推流端将一些自定义 message 随着音视频线路直接下发到观众端，适用场景例如： （1）冲顶大会：推流端将题目下发到观众端，可以做到“音-画-题”完美同步。 （2）秀场直播：推流端将歌词下发到观众端，可以在播放端实时绘制出歌词特效，因而不受视频编码的降质影响。 （3）在线教育：推流端将激光笔和涂鸦操作下发到观众端，可以在播放端实时地划圈划线。

通过下方方案可以使用这个功能:

• init 初始化传入 enableMessage 参数，并设置为true
• 通过 onGetMessageEvt 事件回调监听消息

this.$refs.livePlayer.setLivePlayerListener({}, ret => {
    if (ret.hasOwnProperty('eventType')) {
        if ('onGetMessageEvt' == ret.eventType) {
            // 消息处理
            console.log(ret.msg);
        }
    }
})

步骤 9: 屏幕截图

通过调用 snapshot 您可以截取当前直播画面为一帧屏幕，此功能只会截取当前直播流的视频画面，如果您需要截取当前的整个 UI 界面，请调用uniApp的API 来实现。

更多功能

• 截留录制
• 清晰切换
• 直播时移

扫码添加, 获取技术支持:

微信号: ruanyunkeji006