注册登录

滚滚红尘

发布：2024-01-04 14:45
更新：2024-07-30 09:11
阅读：619

video视频上下有黑边，怎么解决这个问题？

分类：uni-app

uniapp

object-fit：contain，fill，cover

尝试这三个参数都无解。

<view style="margin-top: 15rpx;height:420rpx">  
<video   
style="width:100%;height:100%"   
src="https://mp-5f703dce-adce-473b-b43d-7d933598f264.cdn.bspapp.com/mp4/Lila.mp4"  
object-fit="fill"  
:autoplay="play"   
:loop="true"   
:controls="true"  
id="videoPlayer"  
:auto-pause-if-open-native="true" >   
</video>  
</view>

2024-01-04 14:45 负责人:无分享

4 个回复

最佳回复

喜欢技术的前端 - QQ---445849201

这个视频源本身带的黑边

滚滚红尘 (作者)

哈哈，我也发现了，我现在正在把黑边剪掉看看。。

2024-01-04 15:06
DCloud_UNI_OttoJi

这个 video 能通过调整尺寸，正好挡住黑边吗？我还没试过

2024-01-04 20:13

height:420rpx,调小一点试试

滚滚红尘 (作者)

没用的，调小视频也跟着小了，黑边还是在，是视频本身存在黑边，已经去掉了，没问题了。但是想要即使视频有黑边也能不显示黑边，类似于播放器“铺满屏幕”的功能。不知道咋实现。

2024-01-04 15:30

滚滚红尘 (作者)

是视频本身带的黑边，去掉就可以了。。但是我发现其他视频平台的他们的视频也是自带黑边的，但是播放器里却没有黑边，不知道怎么实现的。

9***@qq.com

通过bindloadedmetadata事件获取视频尺寸计算视频比例，再获取当前屏幕宽度就可以计算出合适的播放器尺寸

要回复问题请先登录或注册