隐藏

把视频网站用Hbuilderx打包成APP时,实现全屏横屏旋转的方法

发布:2021/2/20 10:57:11作者:管理员 来源:本站 浏览次数:1969

前段时间研究封装APP,打算把一个视频网站封装成APP,用Hbuilderx封装,本来就套一个壳子,但后来发现无法实现视频全屏横屏旋转功能。

要知道,视频网站没有横屏很不爽的,测试网站在浏览器里是没有问题的,后来经过各种搜,终于找到一段代码!

封装时我们在app.js末尾加入下面的代码既可完美实现全屏横屏旋转功能兼容IOS和安卓。

此方法适用WAP2APP和H5+APP

代码如下:

var fullScreenOfAndroid = function() {
 if (true) {
  var playym = plus.webview.currentWebview();
  playym.setStyle({
   videoFullscreen: 'landscape'
  })
 } else {
  document.addEventListener('webkitfullscreenchange', function() {
   var el = document.webkitFullscreenElement;
   if (el) {
    plus.screen.lockOrientation('landscape')
   } else {
    plus.screen.unlockOrientation()
   }
  })
 }
};
var fullScreenOfIos = function(videoElem) {
 videoElem.addEventListener('webkitbeginfullscreen', function() {
  plus.screen.lockOrientation('landscape')
 });
 videoElem.addEventListener('webkitendfullscreen', function() {
  plus.screen.unlockOrientation()
 })
};