uni-app ios上slider进度条组件内嵌到video组件里全屏后无法拖动和点击问题

uni-app ios上slider进度条组件内嵌到video组件里全屏后无法拖动和点击问题

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

示例代码：

文件已上传：https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/02273914-69bf-4660-b0fc-9bcbf9cfc8aa.mp4

操作步骤：

ios上slider进度条组件当内嵌到video组件里，video全屏后，slider进度条组件就拖动不了了，点击也没反应，希望修复下

预期结果：

ios上slider进度条组件当内嵌到video组件里，video全屏后，slider进度条组件就拖动不了了，点击也没反应，希望修复下

实际结果：

ios上slider进度条组件当内嵌到video组件里，video全屏后，slider进度条组件就拖动不了了，点击也没反应，希望修复下

bug描述：

ios上slider进度条组件当内嵌到video组件里，video全屏后，slider进度条组件就拖动不了了，点击也没反应，希望官方修复下

（ios上slider进度条在video全屏后拖动和点击没反应）

文件已上传，麻烦看一下，希望修复下  

视频地址：https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/02273914-69bf-4660-b0fc-9bcbf9cfc8aa.mp4

更多关于uni-app ios上slider进度条组件内嵌到video组件里全屏后无法拖动和点击问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html

22 回复

你写一个简洁 能复现的示例工程 传到附件里 我这边帮你看

更多关于uni-app ios上slider进度条组件内嵌到video组件里全屏后无法拖动和点击问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html


好的，附件已经上传了，下载地址>>>> https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/7f0e92ff-1526-4c64-b269-9ad6f8bb779a.zip

顶

顶顶顶顶顶顶

附件已上传，下载地址>>>【https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/7f0e92ff-1526-4c64-b269-9ad6f8bb779a.zip】 附件已打包

收到我看一下

回复 天生DR: 好的，谢谢，你看一下

回复 天生DR: 你好官方，请问解决了吗

回复 一抱一个胖猪猪: 我试了一下 如果你想自己弄 slider 需要把 video的 enable-progress-gesture 设为false 不然手势会互相干扰 最好也把control 也隐藏了

回复 天生DR: 提交的一个简易demo没有设置那些属性隐藏，但我自己项目里设置了，在ios上，video全屏后，进度条不能拖动。ios14机型

回复 一抱一个胖猪猪: 你直接提交一个 建议的和你出现问题的一样的demo 附件上传吧 周一我给你看

回复 天生DR: 好的谢谢，demo附件已按要求加了video的属性打包并且又测试了，还是同样问题。下载地址：https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/5861e044-e668-4f42-9021-93d33dbf436a.zip

顶顶顶顶顶顶顶顶顶顶

【10月15日最新打包上传】好的谢谢，demo附件已按要求加了video的属性打包并且又测试了，还是同样问题。下载地址：https://vkceyugu.cdn.bspapp.com/VKCEYUGU-09d51a3c-5377-4b89-be05-e4c0470c363b/5861e044-e668-4f42-9021-93d33dbf436a.zip

请问一下，最新版hx有修复此问题吗？

请问一下，最新版hx有修复此问题吗？

新版hx还没修复此问题，能不能把此问题反馈到你们修改bug的部门啊！不然IOS上没有反应，拖不动了slider进度条

自己用view模拟一个进度条吧,这不痛不痒的BUG,等官方等到猴年马月

这个bug，难道不准备修复了吗？

已经反馈给前端同事 那边会根据优先级排期

回复 天生DR: 好的

这是一个已知的iOS平台限制问题。当video组件进入全屏模式时，iOS系统会接管视频播放器，此时所有覆盖在video上的原生控件（包括slider）都会失效。

目前可行的解决方案：

  1. 使用video组件的原生控制条：video组件自带进度条控制功能，可以通过controls属性启用。这是最稳定的方案。

  2. 自定义非全屏播放器：避免使用iOS全屏模式，通过CSS实现全屏效果：

    <video :controls="false" [@play](/user/play)="handlePlay">
  <!-- 自定义控制条 -->
  <slider @change="handleProgressChange"></slider>
</video>

<style>
.fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
}
</style>
回到顶部