保利威文档中心

幫助中心

7_8-核心common-互动

更新時間：2023-04-17 15:27:57

1 功能概述

互動應用是多個場景都可以共用的一個功能模組，包含了以下互動應用：答題、問卷、公告、抽獎、簽到。

由IPLVInteractLayout介面作為核心類別來整合。

2 使用演示

//构造
ViewStub interactLayoutViewStub = findViewById(R.id.plvlc_ppt_interact_layout);
IPLVInteractLayout interactLayout = (IPLVInteractLayout) interactLayoutViewStub.inflate();
//初始化
interactLayout.init();
//显示公告
interactLayout.showBulletin();
//销毁
interactLayout.destroy();

具體的使用方法請參考PLVLCCloudClassActivity中對IPLVInteractLayout介面的呼叫。

3 介面介紹

IPLVInteractLayout作為互動應用的介面，定義了以下幾個需要在Activity中使用的方法：

/**
 * date: 2020/10/9
 * author: HWilliamgo
 * 针对互动应用封装的Interface，可以在各个场景使用，定义了：
 * 1. 外部直接调用的方法
 */
public interface IPLVInteractLayout {
    // <editor-fold defaultstate="collapsed" desc="1. 外部直接调用的方法">
    /**
     * 初始化
     */
    void init();

    /**
     * 显示公告
     */
    void showBulletin();

    /**
     * 销毁
     */
    void destroy();

    /**
     * 点击返回
     *
     * @return 返回true表示拦截事件
     */
    boolean onBackPress();
    // </editor-fold>
}

4 實作介紹

PLVInteractLayout是IPLVInteractLayout介面的實作類別，它內部實作了互動應用的邏輯：

4.1 初始化

@Override
public void init() {
    if (interactWebView == null) {
        return;
    }
    //加载互动应用资源
    if (LOAD_WEB_URL) {
        interactWebView.loadWeb();
    } else {
        interactWebView.loadUrl("file:///android_asset/index.html");
    }
    //设置要显示的互动应用
    setupInteractApp();
}

  1. 載入資源

    初始化時，根據目前需求選擇載入線上互動應用資源或載入本地互動應用資源，即根據變數LOAD_WEB_URL。預設為true表示載入線上資源，如果需要載入本地資源，則將這裡的LOAD_WEB_URL改為false即可。

  2. 設定互動應用

    呼叫setupInteractApp()方法設定具體的互動應用，將所需的互動應用加入進來。

4.2 設定互動應用

設定互動應用即將想要的互動應用加入進來。請見方法：setupInteractApp()

//通用控制
PLVInteractCommonControl commonControl = new PLVInteractCommonControl();
//互动答题
PLVInteractAnswer interactAnswer = new PLVInteractAnswer();
//互动问卷调查
LVInteractQuestionnaire interactQuestionnaire = new PLVInteractQuestionnaire();
//互动抽奖
interactLottery = new PLVInteractLottery(commonControl);
//互动签到
PLVInteractSignIn interactSignIn = new PLVInteractSignIn();
//互动公告
interactBulletin = new PLVInteractBulletin();


interactWebView.addInteractApp(commonControl);
interactWebView.addInteractApp(interactAnswer);
interactWebView.addInteractApp(interactQuestionnaire);
interactWebView.addInteractApp(interactLottery);
interactWebView.addInteractApp(interactSignIn);
interactWebView.addInteractApp(interactBulletin);

setupInteractApp()方法的邏輯分為兩步：

  1. 實例化具體的互動應用，並設定對應的回呼。注意，通用控制不屬於業務上的互動應用，它是用於控制所有互動應用的一個通用類別，是必須要加入的。

  2. 將所有互動應用加入互動應用webView中。

4.3 互動應用的實作

4.3.1 互動應用類別簡介

互動應用的具體實作在interact/app目錄下，共有5個互動應用，每個類別分別表示：

  1. PLVInteractAnswer：答題
  2. PLVInteractBulletin：公告
  3. PLVInteractLottery：抽獎
  4. PLVInteractQuestionnaire：問卷
  5. PLVInteractSignIn：簽到

該目錄的其他類別：

  1. PLVInteractCommonControl：通用控制類別，用於每個互動應用共用的邏輯封裝在此類別中
  2. IPLVInteractSendServerResultToJs：互動應用發送到server的結果再發送到JS的監聽器
4.3.2 具體互動應用實作邏輯與如何自訂UI

  1. 實作邏輯

    我們找一個較為簡單的互動應用來看實作邏輯，例如：互動簽到。

    PLVInteractSignIn類別的實作中關鍵分為兩個方法。

    1. processSocketMsg(String msg, String event)用於處理socket訊息

      根據event判斷時間類型，過濾出簽到訊息，並處理msg變數的資料，再呼叫sendMsgToJs方法，將對應事件和資料發送到webView，由webView做出對應的UI回應。

    2. registerMsgReceiverFromJs(IPLVInteractJSBridge interactJSBridge)用於處理JS訊息

      使用IPLVInteractJSBridge介面的方法註冊JS事件監聽器，在收到JS發送來的簽到事件時（也就是使用者點擊了webView上的簽到），對資料進行處理，並將結果發送到server。

    3. sendResultToServer(PolyvSignIn2SocketVO socketVO)用於發送結果到server。

      呼叫對應的方法將結果發送到伺服器端。

  2. 自訂UI

    自訂UI的方式分為兩種，我們還是以簽到為例：

    1. 重寫PLVInteractSignIn方法：
      1. 重寫processSocketMsg方法中的邏輯，提取出伺服器端發送來的資料後，不再呼叫sendMsgToJs()將事件發送到webView，將資料渲染到你自訂的介面UI上即可。
      2. 將registerMsgReceiverFromJs的方法體清空。因為不再需要用webView渲染介面了，因此也不再監聽webView發送來的事件了。
      3. 發送資料到server：當你的介面UI回應了對應的事件後，直接呼叫sendResultToServer，並發送資料到server。
    2. 繼承PLVInteractAppAbs類別，實作自己的邏輯，並自己在PLVInteractLayout中加入webView。

4.4 SDK核心類別介紹

4.1.1 PLVInteractWebView

互動應用WebView，負責渲染互動應用的UI，以及處理維護多個互動應用。

介面如下：

/**
*  加载webView页面
*/
public void loadWeb() ;

/**
 * 添加互动应用
 *
 * @param interactAppAbs 互动应用
 */
public void addInteractApp(PLVInteractAppAbs interactAppAbs);


/**
 * 移除互动应用
 *
 * @param interactAppAbs 互动应用
 */
public void removeInteractApp(PLVInteractAppAbs interactAppAbs);

/**
 * 销毁
 */
public void destroy();
4.1.2 PLVInteractAppAbs

PLVInteractAppAbs是互動應用基礎類別，所有的互動應用以此類別作為父類別擴展，來實作各自的業務邏輯。

抽象方法：

需要具體的子類別互動應用重寫的方法。

/**
 * 处理socket消息
 *
 * @param msg   消息
 * @param event 事件
 */
protected abstract void processSocketMsg(String msg, String event);
/**
 * 注册JS发到原生的消息接收器
 */
protected abstract void registerMsgReceiverFromJs(IPLVInteractJSBridge interactJSBridge);
封裝子類別共用API:
/**
 * 设置显示隐藏监听器
 *
 * @param onInteractAppShowListener listener
 */
public void setOnShowListener(OnInteractAppShowListener onInteractAppShowListener);
子類別使用的方法：
/**
 * 通知UI显示
 */
protected void notifyShow();

/**
 * 发送消息到JS
 *
 * @param handlerName 事件名字
 * @param data        数据
 * @param callBack    回调
 */
protected void sendMsgToJs(String handlerName, String data, CallBackFunction callBack);
联系客服，在线咨询