观众观看页

功能简介

观众观看页是指观众进入主播的直播间后观看直播,实现观众连麦 、直播间信息、在线观众、礼物显示、点赞,弹幕显示等功能。本文将介绍如何在 10 分钟之内完成观众观看页的接入工作。
观看直播
观众连麦








功能接入

说明:
在完成该功能接入之前,需要先完成概述中的接入步骤

创建观众观看页流视图(此步骤可以放在自己的ViewController中)

Swift
let audienceContainerView = AudienceContainerView(roomId: "yourRoomId")

将观众观看页流视图加载到ViewController中

Swift
view.addSubView(audienceContainerView)
audienceContainerView.snp.remakeConstraints { make in
make.edges.equalToSuperview()
}

监听观众观看页事件回调

Swift
audienceContainerView.delegate = self

// 在您自己的 ViewController 中实现 AudienceContainerViewDelegate
extension YourViewController: AudienceContainerViewDelegate {
//房主结束直播回调
func onLiveEnded(roomId: String, avatarUrl: String, userName: String) {
let audienceEndView = AudienceEndStatisticsView(roomId: roomId, avatarUrl: avatarUrl, userName: userName)
audienceEndView.delegate = self
view.addSubview(audienceEndView)
audienceEndView.snp.remakeConstraints { make in
make.edges.equalToSuperview()
}
}

// 点击悬浮窗按钮回调
func onClickFloatWindow() {
FloatWindow.shared.showFloatWindow(controller: self, provider: audienceContainerView)
}
}

功能定制

隐藏顶部操作区中的房间信息

Swift
audienceContainerView.disableHeaderLiveData(true)

隐藏顶部操作区中的观众列表功能

Swift
audienceContainerView.disableHeaderVisitorCnt(true)

隐藏底部操作区的连麦功能

Swift
audienceContainerView.disableFooterCoGuest(true)

隐藏悬浮窗功能

Swift
audienceContainerView.disableHeaderFloatWin(true)

禁止直播上下滑动

Swift
audienceContainerView.disableSliding(true)

实现观众观看页自定义数据源

观众观看页组件默认使用RoomEngine直播列表数据源,如果自己后台有单独的后台直播列表,可以按照下面的方式接入:
Swift
audienceContainerView.dataSource = self

// 在您自己的 ViewController 中实现 AudienceContainerViewDataSource

extension YourViewController: AudienceContainerViewDataSource {
func fetchLiveList(cursor: String, onSuccess: @escaping LiveListSuccessBlock, onError: @escaping LiveListErrorBlock) {
// 对接自己的业务后台,按照下面的格式返回数据给UI组件
var liveInfoList: [LiveInfo] = []
var liveInfo = LiveInfo()
liveInfo.roomId = "live_123456"
liveInfo.name = "live_123456"
liveInfoList.append(liveInfo)
let cursor = "aabbccdd"
onSuccess(cursor, liveInfoList)
}
}