如何实现App内的视频/直播悬浮小窗播放

方案概述

• 功能：使用webview的方案，在App中实现视频/直播的悬浮小窗播放效果，支持应用内小窗、系统小窗，在订单页小窗播放，回到直播间小窗消失

• 场景：适用于要在App中快速实现直播带货场景，或在App中需要点播视频小窗播放的场景

• 支持环境：安卓、iOS、鸿蒙

• 前置条件：使用保利威的webview SDK Demo，如需详细沟通，可+V：wjc24680525

一、安卓对接说明

1.1 集成简介

1.1.1 项目架构图

1.1.2 使用源码项目集成

当前将提供的源码包中的PolyvAndroidWebViewDemo、PLVWebViewSDK、PLVJsBridge、PLVFloatWindow四个项目放入到同一目录下，然后使用编译器打开PolyvAndroidWebViewDemo项目即可。

1.1.3 源码集成注意事项

功能对接说明

参考 1.2 功能对接文档

更换通信协议

如果需要更换web-native通信协议的情况时，可以参考提供的  1.3 更换web-native通信规则注意事项

1.2 功能对接文档

1.2.1 功能设置

设置Url和UA

在启动PLVWebViewDemoActivity之前，我们需要设置加载的Url和添加上需要用到的Ua，这里可以通过PLVWebViewConfig来进行设置，示例代码如下：

PLVWebViewConfig config = new PLVWebViewConfig(); 
config.setUrl("需要加载的url") .setUa("需要添加的UA"); 
PLVWebViewDemoActivity.startWebViewDemoActivity(PLVURLInputActivity.this, config);

设置小窗边框颜色

当前SDK支持设置小窗边框颜色，通过PLVFloatWindowManager进行设置，示例代码如下：

PLVFloatWindowManager.getInstance().setSolidColor(Color.RED);

1）设置小窗边框厚度

当前SDK支持设置小窗边框颜色，通过PLVFloatWindowManager进行设置，示例代码如下：

PLVFloatWindowManager.getInstance().setSolidWidth(20);

2）设置自动开启小窗功能

当进程退到后台时会自动唤出小窗(默认关闭)，通过PLVFloatWindowManager进行设置，示例代码如下：

PLVWebViewConfig config = new PLVWebViewConfig(); 
config.setSupportAutoFloating(true); // 开启自动开启小窗功能 
PLVWebViewDemoActivity.startWebViewDemoActivity(PLVURLInputActivity.this, config);

3）使用系统/应用小窗

当前小窗支持系统小窗和应用窗(默认使用系统小窗)，如果开启系统小窗需要请求小窗悬浮权限，而应用小窗不需要请求权限，注意应用小窗依赖于Activity，当Activity被销毁时，应用小窗也会被关闭。

PLVWebViewConfig config = new PLVWebViewConfig(); 
config.isSystemFloatingWindow(true);// 为true时使用系统窗，false为使用应用小窗 
PLVWebViewDemoActivity.startWebViewDemoActivity(PLVURLInputActivity.this, config);

4）使用原生/web弹出请求权限窗

当前sdk支持通过原生或web端来弹出请求悬浮权限弹窗（默认使用原生弹窗方式）。

注意如果是选择使用web端来弹窗请求悬浮权限弹窗，需要web端支持对应的事件。

PLVWebViewConfig config = new PLVWebViewConfig(); 
config.setUseWebRequestPermission(true);// 为true时web弹窗，false为使用原生弹窗 
PLVWebViewDemoActivity.startWebViewDemoActivity(PLVURLInputActivity.this, config);

1.2.2 监听方法js事件

SDK内部已经定义了一部分与web端通信的js事件，这些通信事件可以在demo层中重写某些方法进行监听和拦截处理，这里以监听onShare事件进行为例：

public class PLVWebViewDemoActivity extends PLVWebViewBaseActivity { 
    @Override 
    public void onShare() { 
        // 监听到onShare事件的处理 
        ... 
        super.onShare(); 
    } 
}

可以选择需要监听的js事件进行重写实现对事件的监听。

注意:这些js通信事件都是与webview关联，开启系统小窗后,即使Activity被销毁依然能收到来自web端发送的消息，触发这些方法，所以重写这些方法时，尽量避免做与Activity生命周期关联的操作

允许的监听js事件

当前支持通过重写方法来监听事件；

有以下这些方法：

    /**
     * 点击商品，将切换到小窗时会触发该回调
     *
     * @param width   小窗的宽
     * @param height  小窗的高
     * @param newPage 是否打开新的一页
     * @param link    打开新的一页加载的url
     * @param data    其他更多数据，开发者可根据需要自定义实现逻辑，数据为json格式
     */
    void changeToWindowForProduct(int width, int height, boolean newPage, String link, String data);

    /**
     * 用户主动调用切换到小窗的方法，在切换前会触发该回调
     *
     * @param width  小窗的宽
     * @param height 小窗的高
     */
    void changeToWindowForUser(int width, int height);

    /**
     * 点击小窗区域，从小窗中恢复到页面触发该回调
     **/
    void changeToNormal();

    /**
     * 点击小窗关闭按钮，关闭小窗触发该回调
     **/
    void closeWindow();

    /**
     * 点击返回事件
     */
    void onGobackPressed();

    /**
     * 横置屏幕事件
     */
    void onLandScreen();

    /**
     * 竖直屏幕事件
     */
    void onPortraitScreen();

    /**
     * 分享事件
     */
    void onShare();

    /**
     * 收藏事件
     */
    void onCollect();

    /**
     * 隐藏状态栏，进入沉浸模式
     */
    void hideNavigationBar();

    /**
     * 显示状态栏，退出沉浸模式
     */
    void showNavigationBar();

    /**
     * 打开悬浮窗权限页面
     */
    void requestFloatWindowPermissionByWeb();

    /**
     * 发送当前小窗的打开状态给前端
     */
    void getFloatWindowStatus();

    /**
     * 获取当前的网路状态
     */
    void getCurrentNetworkStatus();

    /**
     * 设置是否开启自动悬浮窗权限
     * @param enable true为打开，false为甘比
     */
    void setEnableBackground(boolean enable);

    /**
     * 获取是否开启了自动悬浮窗的权限
     */
    void getEnableBackground();

    /**
     * 处理其他event
     */
    void handleOtherEvent(String event);

1.2.3 注册新的js通信事件

SDK支持注册自定义js事件，可以通过下面的方式来注