【微信小程序】video视频组件问题

朱雀 2022-06-04 02:48 921阅读 0赞

1、 video 封面poster图片在真机IOS下会被撑大，不自适应。必须按照比例返回固定比例图片大小的图片，这个在不同机型上很难办到

2、seek(0)以后，再pause()，但是这样做会出现另外的bug：  
第一次播放时，播放当前视频，其他视频会一起加载  
除了第一次播放，虽然实现了伪停止效果，但是封面图会不见了  
cover-image 里的图片不支持放大吗？

3、 我在video 中放了个cover-view，cover-image中放了张图片，覆盖video未播放时的poster背景图，video的宽度是300px \* 225px 的， img的是 200\* 113px的，设置img属性也为width:300px，height:225px，模拟器上没问题，真机上img一直是200 \* 113，不能拉伸。而且原生的播放和时间都被覆盖了

4、mp4视频用video组件播放会卡顿、绿屏,尤其是在快进、拖动时间条时.在video组件上，加 试试加个custom-cache=”\{ \{false\}\}”属性，可以完美解决

5、 video封面: poster  
使用的poster属性，开发工具上图片闪一下就没了。在video里用  
cover-view和cover-image，开发工具里正常显示，但是图片不能自适应

6、video层级太高 顶部导航固定上滑会出现 覆盖现象怎么解决。

目前暂无法解决，下个版本会支持cover-view代替Fixed的元素来解决

video组件在填写poster属性后..转发可能引起小程序崩溃.  
在一个页面内,放置2个以上的填写了poster属性的video组件,  
之后在android端转发会引起小程序崩溃…不知道为什么…

7 、设置的是不自动播放一打开页面所有视频就开始发请求加载。我想做的是点哪个哪个播放，并且是在当前页面播放。

<view class="container"> <scroll-view scroll-y="true" class="container"> <view class="zan-card video-item" wx:for="{ { videos}}"> <view class="feed-intro zan-c-gray-darker zan-font-16"> <text class="feed-txt">{ { item.intro}}</text> </view> <view class="feed-content"> <view class="video"> <video id="video{ { index}}" data-id="{ { index}}" src="{ { item.videoUrl}}" objectFit="contain" poster="{ { item.coverUrl}}" controls></video> </view> </view> </view> </scroll-view> </view>

但是有几个问题，问题为：  
1、设置的是不自动播放一打开页面所有视频就开始发请求加载。我想做的是点哪个哪个播放，并且是在当前页面播放。  
2、我看规范说不能在score-view中用video 会有什么问题吗。我想做的就是在当前页面播放。  
3、如何点击当前视频其他视频暂停。我得代码如下。

startPlay: function (e) {
            var curVideoId = e.currentTarget.id;
    
            if (this.data.prevVideoId) {
                var prevV = wx.createVideoContext(this.data.prevVideoId);
                prevV.pause()
    
            }
    
            var videoContext = wx.createVideoContext(curVideoId);
    
            videoContext.play();
            this.setData({
                prevVideoId: curVideoId
            });
    
        }