6***@qq.com
6***@qq.com
  • 发布:2019-12-31 17:56
  • 更新:2019-12-31 19:14
  • 阅读:1269

plus.video 是否能够支持自定义控件?如图,并且全屏情况下也能实现

分类:HTML5+

需求如图,自定义控件,像腾讯视频那样,还有兼容安卓苹果

不是使用的uniapp项目(uniapp有视频控件自定义插件),是H5+app,CSS+JS+HTML。我的项目能无法使用 cover-view

plus.nativeObj.view 测试时,可以覆盖video,但在全屏情况下无法覆盖

目前准备采用纯 html video标签方式,发现全屏时无法旋转,参考官方文档发现只有获取,但无法设置旋转,苹果系统播放时,会强制使用苹果的播放插件

大佬们求救:目前还有什么方法?能够满足需求

2019-12-31 17:56 负责人:无 分享
已邀请:
AimerQAQ

AimerQAQ - QAQ

Uniapp可以用这个 https://ext.dcloud.net.cn/plugin?id=856

  • 6***@qq.com (作者)

    老哥,我用的是h5+app,已经上线了,不能转uniapp了,还有什么解决方案吗?

    2019-12-31 19:11

DCMarvel

DCMarvel

以下内容仅供参考

加载视频HTML页面

var wvVideo = plus.webview.create('', "custom-webview", {  
                                    replacewebapi: 'auto',  
                                    videoFullscreen: 'landscape'  
                                })  
                            }  
      wvVideo.loadURL('当前视频播放地址HTML')  
var currentWebview = this.$mp.page.$getAppWebview()   
     currentWebview.append(wvVideo);

视频HTML页面使用以下配置

/**  
 * 视频全屏播放旋转目前的逻辑  
 * 视频全屏,即锁定屏幕为横屏。  
 * 视频恢复,则解除屏幕方向的锁定。  
 * 具体的切换,根据自己的实际业务做相应的操作。  
 */  
//Android平台的视频全屏旋转  
var fullScreenOfAndroid = function() {  
    // 最新5+API的支持  
    var self = plus.webview.currentWebview();  
    self.setStyle({  
        videoFullscreen: 'landscape'  
    });  
};  
// iOS平台的视频全屏旋转  
var fullScreenOfIos = function(videoElem) {  
    // 监听的事件与Android平台有很大区别  
    videoElem.addEventListener('webkitbeginfullscreen', function() {  
        plus.screen.lockOrientation('landscape'); //锁死屏幕方向为横屏  
    });  
    videoElem.addEventListener('webkitendfullscreen', function() {  
        plus.screen.unlockOrientation(); //解除屏幕方向的锁定  
    });  
};  
// // 涉及到5+API的内容,均在plusready事件后调用;  
document.addEventListener('plusready', function() {  
    var osName = plus.os.name;  
    if (osName === 'Android') {  
        fullScreenOfAndroid();  
    } else if (osName === 'iOS') {  
        var videoElem = document.getElementById('video');  
        fullScreenOfIos(videoElem);  
    }  
});

几个错别字改了改

  • 6***@qq.com (作者)

    上班试一试,谢谢你

    2019-12-31 19:25

该问题目前已经被锁定, 无法添加新回复