3_1-云课堂场景(页面)
更新時間:2023-04-17 15:27:57
1 功能概述
雲端課堂場景模組位於 PolyvLiveCloudClassScene 資料夾之下,頁面實作為 PLVLCCloudClassViewController
雲端課堂有直播、回放兩種場景模式,兩種模式的UI介面高度共用,功能模組封裝成多個UI區域(AreaView),在頁面中透過簡單的佈局組合即可完成整合。
直播場景模式支援的功能有:媒體(播放器、PPT、浮窗、豎屏皮膚)、頁面選單、連線麥克風、互動應用、橫屏聊天室、橫屏皮膚。 回放場景模式支援的功能有:媒體(播放器、PPT、浮窗、豎屏皮膚)、頁面選單、橫屏聊天室、橫屏皮膚。
各個UI功能模組的區域類別如下:
- 媒體區域:PLVLCMediaAreaView
- 連線麥克風區域:PLVLCLinkMicAreaView
- 選單區域:PLVLCLivePageMenuAreaView
- 橫屏聊天區域:PLVLCChatLandscapeView
- 橫屏皮膚區域:PLVLCLiveRoomPlayerSkinView
- 互動應用區域:PLVInteractView
2 初始化物件、資料
主要初始化取得登入頻道資訊與設定、監聽聊天室socket。
- (instancetype)init {
self = [super init];
if (self) {
[[PLVRoomDataManager sharedManager] addDelegate:self delegateQueue:dispatch_get_main_queue()];
PLVRoomData *roomData = [PLVRoomDataManager sharedManager].roomData;
PLVRoomUser *roomUser = roomData.roomUser;
/// Socket 登录管理
PLVSocketUserType userType = roomUser.viewerType == PLVRoomUserTypeStudent ? PLVSocketUserTypeStudent : PLVSocketUserTypeSlice;
[[PLVSocketManager sharedManager] loginWithChannelId:roomData.channelId
viewerId:roomUser.viewerId
viewerName:roomUser.viewerName
avatarUrl:roomUser.viewerAvatar actor:nil userType:userType];
socketDelegateQueue = dispatch_get_global_queue(0, DISPATCH_QUEUE_PRIORITY_DEFAULT);
[[PLVSocketManager sharedManager] addDelegate:self delegateQueue:socketDelegateQueue];
// 启动聊天室管理器
[[PLVLCChatroomViewModel sharedViewModel] setup];
[[PLVLCChatroomViewModel sharedViewModel] addDelegate:self delegateQueue:dispatch_get_main_queue()];
}
return self;
}
PLVRoomDataManager和PLVRoomData具體實作可參考7_2 核心common-資料PLVSocketManager具體實作可參考7_4 核心common-聊天室
3 初始化設定(加入頁面旋轉、互動通知)
- (void)setupModule{
// 通用的 配置
[[NSNotificationCenter defaultCenter] addObserver:self
selector:@selector(interfaceOrientationDidChange:)
name:UIApplicationDidChangeStatusBarOrientationNotification object:nil];
PLVRoomData *roomData = [PLVRoomDataManager sharedManager].roomData;
if (roomData.videoType == PLVChannelVideoType_Live) { // 视频类型为 直播
/// 监听事件
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(notificationForOpenBulletin:) name:PLVLCChatroomOpenBulletinNotification object:nil];
} else if (roomData.videoType == PLVChannelVideoType_Playback){ // 视频类型为 直播回放
}
}
4 初始化頁面UI
- (void)setupUI {
/// 注意:1. 此处不建议将共同拥有的图层,提炼在 if 判断外,来做“代码简化”
/// 因为此处涉及到添加顺序,而影响图层顺序。放置在 if 内,能更加准确地配置图层顺序,也更清晰地预览图层顺序。
/// 2. 懒加载过程中(即Getter),已增加判断,若场景不匹配,将创建失败并返回nil
PLVRoomData *roomData = [PLVRoomDataManager sharedManager].roomData;
if (roomData.videoType == PLVChannelVideoType_Live) { // 视频类型为 直播
/// 初始化直播的UI
}else if (roomData.videoType == PLVChannelVideoType_Playback){ // 视频类型为 直播回放
/// 初始化回放的UI
}
}
根據目前是直播或回放,將選擇不同的AreaView控制項組合進行初始化。
5 設定AreaView代理回呼
由於各個功能之間需要進行通訊,例如播放器的直播開始和直播結束狀態會影響到媒體的顯示與隱藏,因此每個佈局都提供了外部可以使用的回呼,方便各個功能模組進行通訊。
詳細介面介紹請參考各個功能模組的具體介紹文章。
回呼設定與處理請參考頁面中的設定AreaView回呼方法區塊。
6 處理螢幕旋轉
雲端課堂場景的直播和回放均支援橫豎屏觀看,需要在頁面中做對應的程式碼處理。
參考程式碼區塊:螢幕旋轉處理
- (void)viewWillLayoutSubviews {
[super viewWillLayoutSubviews];
[self updateUI];
}
- (void)interfaceOrientationDidChange:(NSNotification *)notification {
BOOL fullScreen = [UIScreen mainScreen].bounds.size.width > [UIScreen mainScreen].bounds.size.height;
self.fullScreenDifferent = (self.currentLandscape != fullScreen);
self.currentLandscape = fullScreen;
// 全屏播放器皮肤 liveRoomSkinView 的弹幕按钮 danmuButton 为显示状态,且为非选中状态,且当前为横屏时,才显示弹幕
BOOL danmuEnable = !self.liveRoomSkinView.danmuButton.selected && !self.liveRoomSkinView.danmuButton.hidden;
[self.mediaAreaView showDanmu:fullScreen && danmuEnable];
// 调用setStatusBarHidden后状态栏旋转横屏不自动隐藏
[[UIApplication sharedApplication] setStatusBarHidden:fullScreen];
}
