3_3-云课堂场景-PPT
1 功能概述
PPT 功能是將講師端目前正在操作的 PPT 或文件顯示為一個小型浮動視窗的功能。
由於 PPT 是嵌入在浮動視窗中顯示的,因此該模組將浮動視窗和 PPT 分開為兩個介面,一個介面代表的是嵌入了 PPT 的浮動視窗,一個介面是 PPT。
2 使用演示
//初始化
IPLVLCFloatingPPTLayout floatingPPTLayout=findViewById(R.id.plvlc_ppt_floating_ppt_layout);
//设置悬浮窗点击监听器
floatingPPTLayout.setOnFloatingViewClickListener();
//设置关闭悬浮窗的点击监听器
floatingPPTLayout.setOnClickCloseListener();
//设置直播PPT事件监听器
floatingPPTLayout.getPPTView().initLivePPT();
//设置回放PPT事件监听
floatingPPTLayout.getPPTView().initPlaybackPPT();
//销毁
floatingPPTLayout.destroy();
詳細的呼叫程式碼以及與其他模組的通訊,請參考 PLVLCCloudClassActivity 類別中的程式碼呼叫。
3 介面介紹
3.1 IPLVLCFloatingPPTLayout
IPLVLCFloatingPPTLayout是雲課堂場景下定義的 PPT 浮動視窗佈局,定義了:
- 外部直接呼叫的方法
- 需要外部回應的事件監聽器
public interface IPLVLCFloatingPPTLayout {
// <editor-fold defaultstate="collapsed" desc="1. 外部直接调用的方法">
/**
* 设置服务端的PPT开关
*
* @param enable true表示打开PPT,false表示关闭PPT
*/
void setServerEnablePPT(boolean enable);
/**
* 显示
*/
void show();
/**
* 隐藏
*/
void hide();
/**
* PPT是否在悬浮窗中
*/
boolean isPPTInFloatingLayout();
/**
* 获取PPTView
*/
IPLVLCPPTView getPPTView();
/**
* 设置悬浮窗点击监听器
*
* @param li listener
*/
void setOnFloatingViewClickListener(View.OnClickListener li);
/**
* 设置显示关闭悬浮窗的监听器
*
* @param onClickCloseListener listener
*/
void setOnClickCloseListener(IPLVOnClickCloseFloatingView onClickCloseListener);
/**
* 获取切换View
*/
PLVSwitchViewAnchorLayout getPPTSwitchView();
/**
* 销毁
*/
void destroy();
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="2. 需要外部响应的事件监听器">
interface IPLVOnClickCloseFloatingView {
/**
* 点击关闭
*/
void onClickCloseFloatingView();
}
// </editor-fold>
}
3.2 IPLVLCPPTView
雲課堂場景下,針對 PPT 佈局進行封裝的 interface,定義了:
- 外部直接呼叫的方法
- 需要外部回應的事件監聽器
public interface IPLVLCPPTView {
// <editor-fold defaultstate="collapsed" desc="1. 外部直接调用的方法 - live部分,定义 直播PPT独有的方法">
/**
* 初始化直播PPT
*
* @param onPLVLCPPTViewListener listener
*/
void initLivePPT(OnPLVLCLivePPTViewListener onPLVLCPPTViewListener);
/**
* 移除延迟时间
*/
void removeDelayTime();
/**
* 恢复延迟时间
*/
void recoverDelayTime();
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="1. 外部直接调用的方法 - playback部分,定义回放PPT独有的方法">
/**
* 初始化回放PPT
*
* @param onPlaybackPPTViewListener listener
*/
void initPlaybackPPT(OnPLVLCPlaybackPPTViewListener onPlaybackPPTViewListener);
/**
* 设置当前回放视频播放的位置
*
* @param position 播放位置
*/
void setPlaybackCurrentPosition(int position);
/**
* 获取回放专用的PPTView,用于绑定到播放器内部
*
* @return 回放专用的PPTView的接口
*/
IPolyvPPTView getPlaybackPPTViewToBindInPlayer();
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="1. 外部直接调用的方法 - common部分,定义直播PPT和回放PPT通用的方法">
/**
* 发送消息到webView
*
* @param event 消息的事件
* @param message 消息内容
*/
void sendWebMessage(String event, String message);
/**
* 重新加载
*/
void reLoad();
/**
* 销毁
*/
void destroy();
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="2. 需要外部响应的事件监听器 - PPT直播事件监听器">
/**
* PPT直播事件监听器
*/
interface OnPLVLCLivePPTViewListener {
/**
* 直播回调,切换横竖屏
*
* @param toLandscape true表示切换到横屏,false表示切换到竖屏
*/
void onLiveChangeToLandscape(boolean toLandscape);
/**
* 直播回调,开始或暂停视频
*
* @param toStart true表示开始播放视频,false表示暂停播放视频
*/
void onLiveStartOrPauseVideoView(boolean toStart);
/**
* 直播回调,重播视频
*/
void onLiveRestartVideoView();
/**
* 直播回调,回到上一个Activity
*/
void onLiveBackTopActivity();
}
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="2. 需要外部响应的事件监听器 - PPT回放事件监听器">
/**
* PPT回放事件监听器
*/
interface OnPLVLCPlaybackPPTViewListener {
/**
* 回放回调,切换PPTView的位置
*
* @param toMainScreen true表示切换到主屏幕,false表示切回到小窗
*/
void onPlaybackSwitchPPTViewLocation(boolean toMainScreen);
}
// </editor-fold>
}
4 實作介紹
IPLVLCFloatingPPTLayout 的實作類別是:PLVLCFloatingPPTLayout。
IPLVLCPPTView 的實作類別是:PLVLCPPTView。
4.1 PLVLCFloatingPPTLayout
PLVLCFloatingPPTLayout 是一個全螢幕大小的佈局,由他的子 View,PLVTouchFloatingView 作為真正的浮動視窗控制項回應浮動視窗的拖曳事件。
4.1.2 初始化 View
可以在初始化中設定浮動視窗的橫向和直向各自的初始化位置,也可以設定在橫向和直向下,浮動視窗的大小。
//初始化View
private void initView() {
//...
//设置初始化位置
int screenWidth = Math.min(ScreenUtils.getScreenWidth(), ScreenUtils.getScreenHeight());
int screenHeight = Math.max(ScreenUtils.getScreenWidth(), ScreenUtils.getScreenHeight());
floatingView.setInitLocation(
screenWidth - PLVScreenUtils.dip2px(DP_FLOATING_PPT_WIDTH_PORT),
PLVScreenUtils.dip2px(DP_ORIGIN_MARGIN_TOP_PORTRAIT),
screenHeight - PLVScreenUtils.dip2px(DP_FLOATING_PPT_WIDTH_LAND) - PLVScreenUtils.dip2px(DP_ORIGIN_MARGIN_RIGHT_LANDSCAPE),
PLVScreenUtils.dip2px(DP_ORIGIN_MARGIN_TOP_LANDSCAPE)
);
}
4.1.2 初始化資料
浮動視窗內部使用了 MVP 模式,需要初始化 Presenter。
//初始化数据
private void initData() {
presenter = new PLVLiveFloatingPresenter();
presenter.init(this);
}
而浮動視窗實作的 View 層介面是:
/**
* 悬浮窗View
*/
interface IPLVLiveFloatingView {
/**
* 设置讲师信息
*
* @param nick 讲师昵称
* @param picUrl 讲师图片Url
*/
void updateTeacherInfo(String nick, String picUrl);
}
用於更新浮動視窗上講師的資訊。
4.2 PLVLCPPTView
PLVLCPPTView 是 PPT 的實作。有以下幾點需要注意:
它是對 SDK 中的類別:PolyvPPTWebView,的一層業務封裝。
它使用 MVP 模式來處理伺服器端資料的收發等邏輯。
由於 PPT 既可以直播,也可以在回放中使用,因此它的介面分為 live、playback、common 三組,具體可以直接看介面註解。
4.2.1 初始化 View
//初始View
private void initialView(Context context) {
//...
//设置占位图
pptPlaceHolderView.setPlaceHolderImg(R.drawable.plvlc_ppt_placeholder);
//设置占位图文本
pptPlaceHolderView.setPlaceHolderText(getResources().getString(R.string.plv_ppt_no_document));
//...
//加载ppt的webView
pptWebView.loadWeb();
}
4.2.2 初始化資料
PPT 內部使用了 MVP 模式,需要初始化 Presenter。
//初始化数据
private void initData() {
presenter = new PLVPPTPresenter();
presenter.init(this);
}
而 PPT 實作的 View 層介面是:
/**
* PPTView
*/
interface IPLVPPTView {
/**
* 发送消息到webView
*
* @param msg 消息
*/
void sendMsgToWebView(String msg);
/**
* 发送消息到webView
*
* @param msg 消息
* @param event 事件
*/
void sendMsgToWebView(String msg, String event);
/**
* 隐藏加载中图片
* 直播时,则聊天室登录后,收到PPT控制消息时,隐藏加载中图片。
* 回放时,在收到PPT的prepare回调后,异常加载中图片。
*/
void hideLoading();
}
