5_3-手机开播场景-PPT白板

• 1 功能概述
• 2 使用演示
• 3 實作介紹
  • 3.1 PLVStreamerPPTView

1 功能概述

PPT 與白板模組包含白板、PPT 展示、畫筆標註等功能。PPT 與白板展示介面被封裝在類別 PLVLSDocumentAreaView 中。

2 使用演示

使用 PPT 與白板模組需在 PLVLSStreamerViewController 中加入 PLVLSStatusAreaView 控制項：

self.documentAreaView = [[PLVLSDocumentAreaView alloc] init];
self.documentAreaView.delegate = self;
[self.view addSubview:self.documentAreaView];

同時 PLVLSStreamerViewController 需遵循協定 PLVLSDocumentAreaViewDelegate，並實作以下回呼：

#pragma mark - PLVSDocumentAreaView Delegate

- (void)documentAreaView:(PLVLSDocumentAreaView *)documentAreaView openBrush:(BOOL)isOpen {
    // isOpen - YES：打开画笔隐藏聊天区域
    // isOpen - NO：打开画笔显示聊天区域
}

- (void)documentAreaView:(PLVLSDocumentAreaView *)documentAreaView changeFullScreen:(BOOL)isFullScreen {
    self.fullscreen = isFullScreen; // 布尔值 fullscreen 表示当前页面是否处于 ppt 全屏状态
    if (fullscreen) {
        [self.view insertSubview:self.documentAreaView aboveSubview:self.statusAreaView];
    } else { // 全屏时将 documentAreaView 控件插入到子视图的最顶部
        [self.view insertSubview:self.documentAreaView atIndex:0];
    }
}

並在 -viewWillLayoutSubviews 方法中，對 PLVLSStatusAreaView 進行佈局：

if (self.isFullscreen) {
    self.documentAreaView.frame = self.view.bounds;
} else {
    self.documentAreaView.frame = CGRectMake(PLVLSUtils.safeSidePad, 44, documentAreaViewWidth, ducomentViewHeight);
}

3 實作介紹

PPT 與白板檢視 PLVLSStatusAreaView 主要由以下控制項組成，其中最重要的，就是負責白板與 PPT 展示的 PLVStreamerPPTView 類別：

@property (nonatomic, strong) PLVStreamerPPTView *pptView;          // PPT 功能模块视图
@property (nonatomic, strong) PLVLSDocumentNumView *pageNum;        // 页码
@property (nonatomic, strong) PLVLSDocumentToolView *toolView;      // 控制条视图
@property (nonatomic, strong) PLVLSDocumentBrushView *brushView;    // 画笔条视图

3.1 PLVStreamerPPTView

PLVStreamerPPTView 位於 PolyvLiveCommonModule 資料夾下，UI 方面由一個 WKWebView 的實例物件組成，依賴 SDK 的 PLVWebViewBridge 類別進行原生與 H5 的通訊，實現各種互動功能。

PLVStreamerPPTView 對外提供以下唯讀屬性，取得 PPT 與白板檢視的狀態屬性：

@property (nonatomic, assign, readonly) NSInteger autoId;       // ppt id, 0是白板
@property (nonatomic, assign, readonly) NSInteger currPageNum;  // 当前页码
@property (nonatomic, assign, readonly) NSInteger totalPageNum; // 总页码
@property (nonatomic, assign, readonly) NSUInteger pptStep;     // 当前文档所处于动画步数

提供以下方法，用於實現原生與 H5 的通訊：

/// 设置画板是否处于可绘制状态
/// @param open  打开或关闭画板
- (void)setPaintStatus:(BOOL)open;

/// 设置画笔类型
/// @param type  line - 自由笔；text - 文字；arrowLine - 箭头
- (void)setDrawType:(PLVWebViewBrushPenType)type;

/// 完成文本输入
- (void)changeTextContent:(NSString *)content;

/// 修改画笔颜色
/// @param hexString  RGB色值，如红色为“#FF0000”
- (void)changeColor:(NSString *)hexString;

/// 进入画笔删除状态
- (void)toDelete;

/// 删除所有画笔
- (void)deleteAllPaint;

/// 告诉 h5 现在开始上课，h5 会清空画板
/// @param jsonDict 开始推流时发送的 socket 消息
- (void)setSliceStart:(NSDictionary *)jsonDict;

提供以下方法，用於完成白板、文件的切換與翻頁等功能：

/// 白板、文档间的切换方法
/// 如果切换的是文档，切换成功后触发回调 '-jsbridge_documentChangeWithAutoId:imageUrls:'
/// @param autoId  切换的文档的 autoId，如果是白板 autoId 为 0
/// @param pageNumber  切换到文档的第几页
- (void)changePPTWithAutoId:(NSUInteger)autoId pageNumber:(NSInteger)pageNumber;

/// 当前白板/文档下的翻页方法
- (void)turnPage:(BOOL)isNextPage;

/// 新增白板方法
- (void)addWhiteboard;

定義了協定 PLVStreamerPPTViewDelegate，提供以下回呼，用於頁面 UI 的更新：

@protocol PLVStreamerPPTViewDelegate <NSObject>

///  PPT加载完成准备就绪回调
///
/// @param streamerPPTView   PPT视图对象
- (void)streamerPPTViewDidReady:(PLVStreamerPPTView *)streamerPPTView;

///  PPT加载失败回调
///
/// @param streamerPPTView   PPT视图对象
- (void)streamerPPTView:(PLVStreamerPPTView *)streamerPPTView loadFailWithError:(NSError *)error;

/// webView 上准备输入文字时回调
/// @param streamerPPTView PPT视图对象
/// @param inputText 输入文本
/// @param textColor 文本颜色字符串 格式：#FFFFFF
- (void)streamerPPTView:(PLVStreamerPPTView *)streamerPPTView inputWithText:(NSString *)inputText textColor:(NSString *)textColor;

/// 切换到新文档时的回调
/// 用于切换文档时更新文档缩略图
/// @param streamerPPTView PPT视图对象
/// @param autoId 文档autoId
/// @param imageUrls 文档页面缩略图
- (void)streamerPPTView:(PLVStreamerPPTView *)streamerPPTView changeWithAutoId:(NSUInteger)autoId imageUrls:(NSArray *)imageUrls;

/// 文档、白板页码变化的回调、
///
/// @param streamerPPTView  PPT视图对象
/// @param autoId 文档autoId
/// @param pageNumber 文档当前页码
- (void)streamerPPTView:(PLVStreamerPPTView *)streamerPPTView pageStatusChangeWithAutoId:(NSUInteger)autoId
             pageNumber:(NSUInteger)pageNumber totalPage:(NSUInteger)totalPage pptStep:(NSUInteger)step;

@end