有奖捉虫:办公协同&微信生态&物联网文档专题 HOT

效果展示

您可以 下载 安装我们的 App 体验语音沙龙的能力,包括语音聊天、上下麦、低延时语音互动等 TRTC 在语音聊天场景下的相关能力。
房主麦位操作
听众麦位操作






如需快速接入语音沙龙功能,您可以直接基于我们提供的 App 进行修改适配,也可以使用我们提供的 TRTCChatSalon 组件并实现自定义 UI 界面。

复用 App 的 UI 界面

步骤1:创建新的应用

1. 登录实时音视频控制台,选择 开发辅助 > 快速跑通Demo
2. 输入应用名称,例如 TestChatSalon,单击 创建
3. 单击 已下载,下一步,跳过此步骤。



注意
本功能同时使用了腾讯云 实时音视频 TRTC即时通信 IM 两个基础 PaaS 服务,开通实时音视频后会同步开通即时通信 IM 服务。 即时通信 IM 属于增值服务,详细计费规则请参见 即时通信 IM 价格说明

步骤2:下载 App 源码

单击进入 TUIChatSalon,Clone 或者下载源码。

步骤3:配置 App 工程文件

1. 进入修改配置页,根据您下载的源码包,选择相应的开发环境。
2. 找到并打开 Android/Debug/src/main/java/com/tencent/liteav/debug/GenerateTestUserSig.java 文件。
3. 设置 GenerateTestUserSig.java 文件中的相关参数:
SDKAPPID:默认为占位符(PLACEHOLDER),请设置为实际的 SDKAppID。
SECRETKEY:默认为占位符(PLACEHOLDER),请设置为实际的密钥信息。



4. 粘贴完成后,单击 已复制粘贴,下一步 即创建成功。
5. 编译完成后,单击 回到控制台概览 即可。
注意
本文提到的生成 UserSig 的方案是在客户端代码中配置 SECRETKEY,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通 App 和功能调试
正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端,并提供面向 App 的接口,在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig

步骤4:运行 App

使用 Android Studio(3.5以上的版本)打开源码工程 TUIChatSalon,单击 运行 即可开始调试本 App。

步骤5:修改 App 源代码

源码中的 Source 文件夹包含两个子文件夹 ui 和 model,ui 文件夹中均为界面代码,如下表格列出了各个文件或文件夹及其所对应的 UI 界面,以便于您进行二次调整:
文件或文件夹
功能描述
base
UI 使用的基础类。
list
创建房间页。
room
主房间页面,包括房主和听众两种界面。
widget
通用控件。

体验应用

注意
体验应用至少需要两台设备。

用户 A

1. 输入用户名(请确保用户名唯一性,不能与其他用户重复)并登录,如图示:



2. 进入后,单击 创建房间,如下图示:



3. 输入房间主题,单击 开始交谈

用户 B

1. 输入用户名(请确保用户名唯一性,不能与其他用户重复)并登录,如图示:



2. 输入用户 A 创建的房间号,单击 进入房间



注意
房间号在用户 A 的房间顶部查看,如下图示:



实现自定义 UI 界面

源码 中的 Source 文件夹包含两个子文件夹 ui 和 model,model 文件夹中包含可重用的开源组件 TRTCChatSalon,您可以在 TRTCChatSalon.java 文件中看到该组件提供的接口函数,并使用对应接口实现自定义 UI 界面。



步骤1:集成 SDK

语音沙龙组件 Source 依赖 TRTC SDK 和 IM SDK,您可以按照如下步骤将两个 SDK 集成到项目中。

方法一:通过 Maven 仓库依赖

1. 在 dependencies 中添加 TRTCSDK 和 IMSDK 的依赖。
dependencies {
complie "com.tencent.liteav:LiteAVSDK_TRTC:latest.release"
complie 'com.tencent.imsdk:imsdk:latest.release'
compile 'com.google.code.gson:gson:2.3.1'
}
2. 在 defaultConfig 中,指定 App 使用的 CPU 架构。
defaultConfig {
ndk {
abiFilters "armeabi-v7a"
}
}
3. 单击 Sync Now,自动下载 SDK 并集成到工程里。

方法二:通过本地 AAR 依赖

若您的开发环境访问 Maven 仓库较慢,您可以直接下载 ZIP 包,并按照集成文档手动集成到您的工程中。
SDK
下载页面
集成指引
TRTC SDK
IM SDK

步骤2:配置权限及混淆规则

在 AndroidManifest.xml 中配置 App 的权限,SDK 需要以下权限(6.0以上的 Android 系统需要动态读取存储权限):
<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.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.BLUETOOTH" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />

在 proguard-rules.pro 文件,将 SDK 相关类加入不混淆名单:
-keep class com.tencent.** { *; }

步骤3:导入 TRTCChatSalon 组件

拷贝以下目录中的所有文件到您的项目中:
Source/src/main/java/com/tencent/liteav/trtcchatsalon/model

步骤4:创建并登录组件

1. 调用 sharedInstance 接口可以创建一个 TRTCChatSalon 组件的实例对象。
2. 调用 setDelegate 函数注册组件的事件通知。
3. 调用 login 函数完成组件的登录,请参考下表填写关键参数:
参数名
作用
sdkAppId
您可以在 实时音视频控制台 中查看 SDKAppID。
userId
当前用户的 ID,字符串类型,只允许包含英文字母(a-z、A-Z)、数字(0-9)、连词符(-)和下划线(_)。建议结合业务实际账号体系自行设置。
userSig
腾讯云设计的一种安全保护签名,获取方式请参考 如何计算及使用 UserSig
callback
登录回调,成功时 code 为0。
TRTCChatSalon mTRTCChatSalon = TRTCChatSalon.sharedInstance(this);
mTRTCChatSalon.setDelegate(this);
mTRTCChatSalon.login(SDKAPPID, userId, userSig, new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
if (code == 0) {
//登录成功
}
}
});

步骤5:房主端开播

1. 房主执行 步骤4 登录后,可以调用 setSelfProfile 设置自己的昵称和头像。
2. 房主调用 createRoom 创建新的语音沙龙,此时传入房间 ID、上麦是否需要房主确认、房间类型等房间属性信息。
3. 房主会收到有成员进入的 onAnchorEnterSeat 的事件通知,此时会自动打开麦克风采集。



// 1.房主设置昵称和头像
mTRTCChatSalon.setSelfProfile("my_name", "my_face_url", null);

// 2.房主调用 createRoom 创建房间
final TRTCChatSalonDef.RoomParam roomParam = new TRTCChatSalonDef.RoomParam();
roomParam.roomName = "房间名称";
roomParam.needRequest = true; // 上麦是否需要房主确认
roomParam.coverUrl = "房间封面图的 URL 地址";
mTRTCChatSalon.createRoom(mRoomId, roomParam, new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
if (code == 0) {
// 3.占座位
mTRTCChatSalon.enterSeat(new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
if (code == 0) {
}
}
});
}
}
});

// 4.占座成功后, 收到 onAnchorEnterSeat 事件通知
@Override
public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo userInfo) {
}

步骤6:听众端观看

1. 听众端执行 步骤4 登录后,可以调用 setSelfProfile 设置自己的昵称和头像。
2. 听众端向业务后台获取最新的语音沙龙房间列表。
说明
App 中的语音沙龙列表仅做演示使用,语音沙龙列表的业务逻辑千差万别,腾讯云暂不提供语音沙龙列表的管理服务,请自行管理您的语音沙龙列表。
3. 听众端调用 getRoomInfoList 获取房间的详细信息,该信息是在房主端调用 createRoom 创建语音沙龙时设置的简单描述信息。
注意
如果您的语音沙龙列表包含了足够全面的信息,可跳过调用 getRoomInfoList 相关步骤。
4. 听众选择一个语音沙龙,调用 enterRoom 并传入房间号即可进入该房间。
5. 进房后会收到组件的 onRoomInfoChange 房间属性变化事件通知,此时可以记录房间属性并做相应改变,例如 UI 展示房间名、记录上麦是否需要请求房主同意等。
6. 进房后还会收到麦位表有主播进入的 onAnchorEnterSeat 的事件通知。



// 1.听众设置昵称和头像
mTRTCChatSalon.setSelfProfile("my_name", "my_face_url", null);

// 2.假定您从业务后台获取房间列表为 roomList
List<Integer> roomList = GetRoomList();

// 3.通过调用 getRoomInfoList 获取房间的详细信息
mTRTCChatSalon.getRoomInfoList(roomList, new TRTCChatSalonCallback.RoomInfoCallback() {

@Override
public void onCallback(int code, String msg, List<TRTCChatSalonDef.RoomInfo> list) {
if (code == 0) {
// 此时可以刷新您自己的 UI 房间列表
}
}

});

// 4.传入 roomId 进入房间
mTRTCChatSalon.enterRoom(roomId, new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
if (code == 0) {
//进房成功
}
}
});

// 5.进房成功后,收到 onRoomInfoChange 事件通知
@Override
public void onRoomInfoChange(TRTCChatSalonDef.RoomInfo roomInfo) {
mNeedRequest = roomInfo.needRequest;
mRoomName = roomInfo.roomName;
// UI 可以展示标题等
}

// 6.收到 onAnchorEnterSeat 事件通知
@Override
public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo userInfo) {
}

步骤7:上下麦

房主端
听众端
1. pickSeat 传入听众 userId, 可以抱人上麦,房间内所有成员会收到 onAnchorEnterSeat 的事件通知。
2. kickSeat 传入对应用户的 userId 后,可以踢人下麦,房间内所有成员会收到 onAnchorLeaveSeat 的事件通知。


麦位操作后的事件通知顺序如下:callback > onAnchorEnterSeat 等独立事件。
// 1.房主抱人上麦位
mTRTCChatSalon.pickSeat("123", new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
// 2.收到 callback 回调
if (code == 0) {
}
}
});

// 3.听众成为主播,进入麦位通知,可以在这里判断听众是不是真的上麦成功
public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo user) {
}

1. enterSeat 可以进行上麦,房间内所有成员会收到 onAnchorEnterSeat 的事件通知。
2. leaveSeat 主动下麦,房间内所有成员会收到 onAnchorLeaveSeat 的事件通知。


麦位操作后的事件通知顺序如下:callback > onAnchorEnterSeat 等独立事件。
// 1.听众主动上麦
mTRTCChatSalon.enterSeat(new TRTCChatSalonCallback.ActionCallback() {
@Override
public void onCallback(int code, String msg) {
// 2.收到 callback 回调
if (code == 0) {
}
}
});

// 3.听众成为主播,进入麦位通知,可以在这里判断是不是自己并进行相应处理
public void onAnchorEnterSeat(int index, TRTCChatSalonDef.UserInfo user) {
}


步骤8:邀请信令的使用

如果您的 App 需要对方同意才能进行下一步操作的业务流程,那么邀请信令可以提供相应支持。
听众主动申请上麦
房主邀请听众上麦
1. 听众端调用 sendInvitation 传入房主的 userId 和业务的自定义命令字等,此时函数会返回一个 inviteId,记录该 inviteId。
2. 房主端收到 onReceiveNewInvitation 的事件通知,此时 UI 可以弹窗并询问房主是否同意。
3. 房主选择同意后,调用 acceptInvitation 并传入 inviteId。
4. 听众端收到 onInviteeAccepted 的事件通知,调用 enterSeat 进行上麦。



// 听众端视角
// 1.调用 sendInvitation,请求上麦
String inviteId = mTRTCChatSalon.sendInvitation("ENTER_SEAT", ownerUserId, "123", null);

// 2.收到邀请的同意请求, 正式上麦
@Override
public void onInviteeAccepted(String id, String invitee) {
if(id.equals(inviteId)) {
mTRTCChatSalon.enterSeat(null);
}
}

// 房主端视角
// 1.房主收到请求
@Override
public void onReceiveNewInvitation(final String id, String inviter, String cmd, final String content) {
if (cmd.equals("ENTER_SEAT")) {
// 2.房主同意听众请求
mTRTCChatSalon.acceptInvitation(id, null);
}
}

1. 房主端调用 sendInvitation 传入听众的 userId 和业务的自定义命令字等,此时函数会返回一个 inviteId,记录该 inviteId。
2. 听众端收到 onReceiveNewInvitation 的事件通知,此时 UI 可以弹窗并询问听众是否同意上麦。
3. 听众选择同意后,调用 acceptInvitation 并传入 inviteId。
4. 房主端收到 onInviteeAccepted 的事件通知,调用pickSeat抱听众上麦。



// 房主端视角
// 1.房主调用 sendInvitation,请求抱听众“123”上麦
String inviteId = mTRTCChatSalon.sendInvitation("PICK_SEAT", ownerUserId, "123", null);

// 2.收到邀请的同意请求, 正式上麦
@Override
public void onInviteeAccepted(String id, String invitee) {
if(id.equals(inviteId)) {
mTRTCChatSalon.pickSeat(null);
}
}

// 听众端视角
// 1.听众收到请求
@Override
public void onReceiveNewInvitation(final String id, String inviter, String cmd, final String content) {
if (cmd.equals("PICK_SEAT")) {
// 2.听众同意房主请求
mTRTCChatSalon.acceptInvitation(id, null);
}
}


步骤9:实现文字聊天和弹幕消息

通过 sendRoomTextMsg 可以发送普通的文本消息,所有在该房间内的主播和听众均可以收到 onRecvRoomTextMsg 回调。 即时通信 IM 后台有默认的敏感词过滤规则,被判定为敏感词的文本消息不会被云端转发。
// 发送端:发送文本消息
mTRTCChatSalon.sendRoomTextMsg("Hello Word!", null);
// 接收端:监听文本消息
mTRTCChatSalon.setDelegate(new TRTCChatSalonDelegate() {
@Override
public void onRecvRoomTextMsg(String message, TRTCChatSalonDef.UserInfo userInfo) {
Log.d(TAG, "收到来自" + userInfo.userName + "的消息:" + message);
}
});
通过 sendRoomCustomMsg 可以发送自定义(信令)的消息,所有在该房间内的主播和听众均可以收到 onRecvRoomCustomMsg 回调。 自定义消息常用于传输自定义信令,例如用于点赞消息的发送和广播。
// 发送端:您可以通过自定义 Cmd 来区分弹幕和点赞消息
// eg:"CMD_DANMU"表示弹幕消息,"CMD_LIKE"表示点赞消息
mTRTCChatSalon.sendRoomCustomMsg("CMD_DANMU", "Hello world", null);
mTRTCChatSalon.sendRoomCustomMsg("CMD_LIKE", "", null);
// 接收端:监听自定义消息
mTRTCChatSalon.setDelegate(new TRTCChatSalonDelegate() {
@Override
public void onRecvRoomCustomMsg(String cmd, String message, TRTCChatSalonDef.UserInfo userInfo) {
if ("CMD_DANMU".equals(cmd)) {
// 收到弹幕消息
Log.d(TAG, "收到来自" + userInfo.userName + "的弹幕消息:" + message);
} else if ("CMD_LIKE".equals(cmd)) {
// 收到点赞消息
Log.d(TAG, userInfo.userName + "给您点了个赞!");
}
}
});