进入播放页面,点击播放器,调出播放器底部的控制栏。再点击播放器底部的最右侧的控制图标,切换到全屏(横屏)。等待控制栏消失后,点击播放区域,重新调起控制栏,点击左上角的返回图标,返回竖屏状态,静止几秒,等待控制栏消失。再点击播放区域,调起控制栏。
- 发布:2024-03-09 21:26
- 更新:2024-10-22 16:24
- 阅读:558
【报Bug】uni-app编译模式下,app端的nvue页面,使用plus.screen.lockOrientation('landscape-primary')设置横屏,退出后页面元素变大
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: Windows 11 专业版/23H2/22635.3276
HBuilderX类型: 正式
HBuilderX版本号: 3.96
手机系统: Android
手机系统版本号: Android 10
手机厂商: OPPO
手机机型: R15
页面类型: vue
vue版本: vue2
打包方式: 云端
项目创建方式: HBuilderX
App下载地址或H5⽹址: http://39.108.133.46:8888/down/Ul0HJwnb9011
操作步骤:
预期结果:
无论是横屏状态还是恢复到竖屏状态,控制图标都正常显示,大小一样。
无论是横屏状态还是恢复到竖屏状态,控制图标都正常显示,大小一样。
实际结果:
横屏后,图标变小;恢复到竖屏时,图标变大
横屏后,图标变小;恢复到竖屏时,图标变大
bug描述:
在vue项目中,使用nvue组件。nvue中使用的是原生视频播放器组件。在vue页面中使用如下代码实现横屏,并将nvue页面的原生组件全屏(动态设置播放器的宽高)
plus.navigator.setFullscreen(true); //隐藏状态栏
plus.screen.lockOrientation('landscape-primary');
点击返回按钮,通过如下逻辑返回竖屏
plus.navigator.setFullscreen(false); //隐藏状态栏
plus.screen.unlockOrientation()
plus.screen.lockOrientation('portrait-primary');
截屏见附件。(编辑器按说明点图片右侧的“插入”无任何反应)
按图片名称说明:
1.正常竖屏
2.点击底部全屏图标后,横屏效果
3.步骤2,等待几秒,顶部的返回按钮和底部的操作栏自动隐藏,再次点击视频时的效果,此时图标变小了
4.点击左上角的返回按钮,返回竖屏时的ui(此时可以看到,播放器被缩小了)
- 等待几秒钟不做任何操作,播放器自动恢复到正常大小,但是底部操作栏的图标都变大了。
说明: nvue页面和引用该nvue组件的页面都使用的是px作为样式宽高单位。并且在page.json中的globalStyle下已经设置了dynamicRpx=true
w***@163.com (作者)
ios不知道呢,我这个app只在安卓上用。不好意思
2024-03-14 20:27