更新记录

0.0.9(2021-02-05)

增加音频对话的事件

0.0.8(2021-01-27)

修复android部分手机进入房间失败

查看更多

平台兼容性

Android iOS
适用版本区间:4.4 - 11.0 适用版本区间:9 - 14

原生插件通用使用流程:

  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、组件 epii-TXCloudVideoView ,这个是聊天视频流布局组件。页面中可以有多个(多人聊天),从而实现自定义布局。实现你想要的布局方式。

2、扩展 epii-TRTCCloud ,这个是腾讯音视频的控制对象,可以控制整个聊天过程,和与布局的绑定。

一个最常见的例子(两个聊天)

进入房间->绑定自己的视频流布局组件->监听别人进入(可多个)->给别人绑定视频流布局组件->开始聊天-->结束聊天

<template>
    <div>
        <epii-TXCloudVideoView   id="me" style="width:100;height:100"></epii-TXCloudVideoView >
        <epii-TXCloudVideoView    id="other_1" style="width:100;height:100"></epii-TXCloudVideoView >
        <button @click="enterRoom()">进入房间</button>
        <button @click="onUserVideoAvailable()">监听别人视频进入并自动聊天</button>
        <button @click="exitRoom()">退出房间</button>
    </div>
</template>
<script>
    const mTRTCCloud = uni.requireNativePlugin('epii-TRTCCloud');
    export default {
        data() {
            return {}
        },
        onLoad() {},
        methods: {
            enterRoom() {
                mTRTCCloud.enterRoom({
                    "userSig": "",
                    "appId": 1111,
                    "userId": "myid",
                    "roomId": "roomid"
                },(ret)=>{
                    if(ret.success){
                        mTRTCCloud.startLocalPreview({
                            frontCamera:true,
                            viewId:"me"//绑定视频流组件
                        },()=>{

                        })
                    }else{
                    }
                })
            },
            onUserVideoAvailable() {
                mTRTCCloud.onUserVideoAvailable((user)=>{//当有用户进来或离开时
                      if (user.available) {
                mTRTCCloud.startRemoteView({
                  userId:user.userId,
                  viewId:"other_1"//对方的视频流布局
                });
                        } else {
                            mTRTCCloud.stopRemoteView({userId:userId});//解除绑定
                        }
                })
            },
            exitRoom(){
                mTRTCCloud.exitRoom((ret)=>{
                })
            }
        }
    }
</script>

epii-TXCloudVideoView 介绍

这个组件是聊天中视频流呈现的组件,必须在nvue页面中使用,并且必须有 id 属性(整个app中id必须唯一),可以按照自己的需要设计样式。需要通过代码把每一个人的视频流通过id绑定到相应的epii-TXCloudVideoView组件

epii-TRTCCloud 介绍

引入方式

const mTRTCCloud = uni.requireNativePlugin('epii-TRTCCloud');

支持的方法如下:

名称 说明
本地方法
enterRoom 进入房间
startLocalPreview 开启本地流并且绑定epii-TXCloudVideoView组件
stopLocalAudio 关闭本地声音流
startLocalAudio 开启本地声音流(开启本地流时候,默认会开启)
muteLocalVideo 暂停/恢复推送本地的视频数据
exitRoom 退出房间
远端进出监听
onUserAudioAvailable 设置远端用户音频状态监听,比如进入和离开
onUserVideoAvailable 设置远端用户视频状态监听,比如进入和离开
远端方法
startRemoteView 开启某一个远端流并且绑定epii-TXCloudVideoView组件
stopRemoteView 关闭某一个远端视频流
stopAllRemoteView 关闭所有远端视频流
muteRemoteAudio 关闭/开启某一个远端声音
muteAllRemoteAudio 关闭/开启所有远端视频
setRemoteViewFillMode 设置远端视频流填充方式。(在startRemoteView时候也可以通过参数设置)
setAudioRoute 音频路由,即声音由哪里输出(扬声器、听筒 )
其它
setBeauty 设定美颜参数
setListener 设置更多状态的监听。一般不需要,但如果想对所有状态进行监听可以设置

enterRoom

进入房间

传入参数

appId 必填(int) 腾讯云的sdkAppid
userId 必填 用户id
roomId 必填(int) 房间id
userSig 必填 签名(后台计算后在这里填入)
privateMapKey 选填 权值票根(如果后台设置了在这里输入)
scene 选填 默认为 0 应用场景,目前支持视频通话(0 VideoCall)、连麦直播(1 Live)、语音通话( 2 AudioCall)、语聊房(3 VoiceChatRoom)四种场景。

回调数据

success ture or false 是否进入成功
result int 成功则表示进入房间使用的时间,失败则表示失败code

startLocalPreview

开启本地流并且绑定epii-TXCloudVideoView组件

传入参数

frontCamera true or false 是否为前摄像机,默认为是
viewId 视频流组件ID epii-TXCloudVideoView的id
fillMode 视频填充方式 默认为 0 0 填充,1 适应

stopLocalAudio

关闭本地声音流,无需参数,无回调

startLocalAudio

开启本地声音流(开启本地流时候,默认会开启),无需参数,无回调

muteLocalVideo

暂停/恢复推送本地的视频数据

传入参数

mute bool 是否开启

无回调

exitRoom

这个退出,需要一定的时间,有异步回调

无参数

回调如下

reason reason离开房间原因,0:主动调用 exitRoom 退房;1:被服务器踢出当前房间;2:当前房间整个被解散。

onUserAudioAvailable

设置远端用户音频状态监听,比如进入和离开(这个其实是一个事件,但为了程序更加方便,通过这个方法单独设置)

一个案例即可说明一切

mTRTCCloud.onUserAudioAvailable((user)=>{//当有用户进来或离开时
                      if (user.available) {

                        } else {
                            mTRTCCloud.stopRemoteView({userId:userId});//解除绑定
                        }
                })

onUserVideoAvailable

设置远端用户视频状态监听,比如进入和离开(这个其实是一个事件,但为了程序更加方便,通过这个方法单独设置)

mTRTCCloud.onUserVideoAvailable((user)=>{//当有用户进来或离开时
                      if (user.available) {
                mTRTCCloud.startRemoteView({
                  userId:user.userId,
                  viewId:"other_1"//对方的视频流布局
                });
                        } else {
                            mTRTCCloud.stopRemoteView({userId:userId});//解除绑定
                        }
                })

startRemoteView

开启某一个远端流并且绑定epii-TXCloudVideoView组件

传入参数

userId 远程用户id
viewId 视频流组件ID epii-TXCloudVideoView的id
fillMode 视频填充方式 默认为 0 0 填充,1 适应

stopRemoteView

关闭某一个远端视频流

userId 远程用户id

stopAllRemoteView

关闭所有远端视频流,无参数无回调

muteRemoteAudio

关闭/开启某一个远端声音

传入参数

mute bool 是否开启
userId

无回调

muteAllRemoteAudio

关闭/开启所有远端视频,无参数无回调

setRemoteViewFillMode

设置远端视频流填充方式。(在startRemoteView时候也可以通过参数fillMode设置)

传入参数

userId 远程用户id
fillMode 视频填充方式 默认为 0 0 填充,1 适应

setAudioRoute

设置音频路由

微信和手机 QQ 视频通话功能的免提模式就是基于音频路由实现的。 一般手机都有两个扬声器,一个是位于顶部的听筒扬声器,声音偏小;一个是位于底部的立体声扬声器,声音偏大。 设置音频路由的作用就是决定声音使用哪个扬声器播放。

传入参数

| -------- | --------------------- | --------------- | | route | 默认为 0 | 0 扬声器,1 听筒|

setBeauty

设定美颜参数

style 默认为0 0 :光滑 1:自然 2:朦胧
beautyLevel 默认为5 美颜级别,取值范围0 - 9; 0表示关闭,1 - 9值越大,效果越明显。
whitenessLevel 默认为 2 美白级别,取值范围0 - 9; 0表示关闭,1 - 9值越大,效果越明显。

setListener

通过设置监听,可以更加灵活的对流程进行控制

mTRTCCloud.setListener(ret=>{
      if(ret.event=="")
        {
            console.log(ret.data)
        }else if(ret.event=="onWarning")
        {
            console.log(ret.data)
        }
})

隐私、权限声明

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

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.RECORD_AUDIO" /> <uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.READ_PHONE_STATE" /> <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" /> <uses-permission android:name="android.permission.BLUETOOTH" /> <uses-feature android:name="android.hardware.camera" /> <uses-feature android:name="android.hardware.camera.autofocus" />

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

腾讯云音视频会会对数据相应处理,属于业务本身。无其他行为。

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

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