小程序
小游戏
企业微信
微信支付
扫描小程序码分享
小程序开发过程中 视频VIDEO组件的内容是不是的变形 同样的视频内容
代码如下:
有遇到过这种问题的求告知! 多谢
8 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
hello，我最近也遇到了这个问题，我自己测试得出结果：
安卓端如果video用了display: none，然后在block，这时视频是会变形的，渲染的时候用wx:if的话就不会
所以你可以试试渲染的时候用wx:if，或者是初始化的时候用visibility: hidden，有src以后再visibility: visible试试，我这边亲测有效
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
你好，请问这个问题解决了吗？是怎么解决的
楼主解决了吗
我的小程序播放插件也是用的video，苹果手机可以正常播放，安卓手机播放同一个视频时画质变形了，请问这是什么原因？可以解决吗？
遇到同样的问题
object-fit="contain"设置了没用
遇到同样问题。只有安卓端有这个问题，iOS 上使用正常的 css 即可。
目前是在 loadedmetadata 事件中获取视频的宽高，根据实际需要算出 video 的样式。
在 loadedmetadata 执行之前安卓端先隐藏 video
handleLoadedMetaData(e) { const { width, height } = e.detail; if (platform === 'android') { this.setData({ videoStyle: `height: calc(100vw * ${height / width})`, }); } }
试试添加这个属性
https://developers.weixin.qq.com/miniprogram/dev/component/video.html
你好，麻烦具体描述问题流程，提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
hello，我最近也遇到了这个问题，我自己测试得出结果：
安卓端如果video用了display: none，然后在block，这时视频是会变形的，渲染的时候用wx:if的话就不会
所以你可以试试渲染的时候用wx:if，或者是初始化的时候用visibility: hidden，有src以后再visibility: visible试试，我这边亲测有效
你好，请问这个问题解决了吗？是怎么解决的
楼主解决了吗
我的小程序播放插件也是用的video，苹果手机可以正常播放，安卓手机播放同一个视频时画质变形了，请问这是什么原因？可以解决吗？
遇到同样的问题
object-fit="contain"设置了没用
遇到同样问题。只有安卓端有这个问题，iOS 上使用正常的 css 即可。
目前是在 loadedmetadata 事件中获取视频的宽高，根据实际需要算出 video 的样式。
在 loadedmetadata 执行之前安卓端先隐藏 video
handleLoadedMetaData(e) { const { width, height } = e.detail; if (platform === 'android') { this.setData({ videoStyle: `height: calc(100vw * ${height / width})`, }); } }试试添加这个属性
https://developers.weixin.qq.com/miniprogram/dev/component/video.html
你好，麻烦具体描述问题流程，提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
具体机型:魅族16,小米8上均有此现象
微信版本号:7.0.9
手机系统版本号:小米(11.0.4) 魅族手机是安卓8.1版本
代码片段分享:https://developers.weixin.qq.com/s/RETT7EmH7bd7
.task_show .huan_jing .video{background: #000;text-align: center;border-radius: 10rpx;overflow: hidden;}
.task_show .huan_jing .video video{display: block;margin: auto;height: 300rpx;}