观众观看页
功能简介
观众观看页主要是指观众进入主播的直播间后观看直播，实现观众连麦 、直播间信息、在线观众、礼物显示、点赞，弹幕显示等功能。本文将介绍如何在 10 分钟之内完成观众观看页的接入工作。
观看直播 | 观众连麦 |
 |
 |
功能接入
说明：
创建观众观看页流视图并初始化，此步骤可以放在自己的 Activity 中
val mAudienceContainerView = AudienceContainerView(context)val roomId = "1236666"mAudienceContainerView.init(this, roomId, dataSource)
AudienceContainerView mAudienceContainerView = new AudienceContainerView(this);String roomId = "1236666";mAudienceContainerView.init(this, roomId, dataSource);
将观众观看页流视图加载到 Activity 中
setContentView(mAudienceContainerView)
setContentView(mAudienceContainerView);
监听观众观看页事件回调
mAudienceContainerView.addListener(object : AudienceContainerViewDefine.AudienceContainerViewListener {// 房主结束直播回调override fun onRoomDismissed(roomId: String, ownerName: String, ownerAvatarUrl: String) {}// 点击画中画按钮回调override fun onPictureInPictureClick() {}})
mAudienceContainerView.addListener(new AudienceContainerViewDefine.AudienceContainerViewListener() {//房主结束直播回调@Overridepublic void onRoomDismissed(String roomId, String ownerName, String ownerAvatarUrl) {}// 点击画中画按钮回调@Overridepublic void onPictureInPictureClick() {PictureInPictureParams params = new PictureInPictureParams.Builder().build();enterPictureInPictureMode(params);}});
功能定制
隐藏主播页顶部操作区
mAudienceContainerView.disableHeaderLiveData(true)
mAudienceContainerView.disableHeaderLiveData(true);
隐藏顶部操作区中的观众列表功能
mAudienceContainerView.disableHeaderVisitorCnt(true)
mAudienceContainerView.disableHeaderVisitorCnt(true);
隐藏底部操作区的连麦功能
mAudienceContainerView.disableFooterCoGuest(true)
mAudienceContainerView.disableFooterCoGuest(true);
隐藏悬浮窗功能
mAudienceContainerView.disableHeaderFloatWin(true)
mAudienceContainerView.disableHeaderFloatWin(true);
禁止直播上下滑动
mAudienceContainerView.disableSliding(true)
mAudienceContainerView.disableSliding(true);
实现观众观看页自定义数据源
观众观看页组件默认使用RoomEngine直播列表数据源，如果自己后台有单独的后台直播列表，可以按照下面的方式接入：
val dataSource = object : AudienceContainerViewDefine.LiveListDataSource() {override fun fetchLiveList(param: AudienceContainerViewDefine.FetchLiveListParam,callback: AudienceContainerViewDefine.LiveListCallback) {// 对接自己的业务后台，按照下面的格式返回数据给UI组件val liveInfoList = mutableListOf<TUILiveListManager.LiveInfo>().apply {add(TUILiveListManager.LiveInfo().apply {roomInfo = TUIRoomDefine.RoomInfo().apply {roomId = "live_123456"name = "live_123456"}})}val cursor = "aabbccdd"callback.onSuccess(cursor, liveInfoList)}}val roomId = "1236666"mAudienceContainerView.init(this, roomId, dataSource)
AudienceContainerViewDefine.LiveListDataSource dataSource = new AudienceContainerViewDefine.LiveListDataSource(){@Overridepublic void fetchLiveList(AudienceContainerViewDefine.FetchLiveListParam param, AudienceContainerViewDefine.LiveListCallback callback) {//对接自己的业务后台，按照下面的格式返回数据给UI组件List<TUILiveListManager.LiveInfo> liveInfoList = new ArrayList<>();TUILiveListManager.LiveInfo liveInfo = new TUILiveListManager.LiveInfo();liveInfo.roomInfo = new TUIRoomDefine.RoomInfo();liveInfo.roomInfo.roomId = "live_123456";liveInfo.roomInfo.name = "live_123456";liveInfoList.add(liveInfo);String cursor = "aabbccdd";callback.onSuccess(cursor, liveInfoList);}};String roomId = "1236666";mAudienceContainerView.init(this, roomId, dataSource);
