收藏
回答

小游戏视频播放组件createVideo视频缩放和位置定位怎么设置?

播放视频参数,x,y,width,height,objectFit问题。怎么传都显示不了全屏的视频。目前下面这段代码能显示一半视频。但是高度一增加宽度也加大了。

objectFit 换了fill,cover都没用。不知道是什么原因,弄了几个小时了。视频是750/1344的。请求有谁知道,这几个参数具体要怎么设置。很无语。目前开发工具是cocos creator。

 let windowSize = cc.view.getVisibleSize();

     console.log("width=" + windowSize.width + ",height=" + windowSize.heightthat.node.widththat.node.heightthat.node.xthat.node.y);

        const video = wx.createVideo({

             //x:(windowSize.width-that.node.width)/2,

             //y:(windowSize.height-that.node.height)/2,

            // x:-that.node.x/2,

            // y: 0, //

            // width:540/960*that.node.height,

            // height: that.node.height,

           // x:-that.node.x/2,

           // y: that.node.y,

          x:0,

           y:0,

            width:windowSize.width/2,

            height:windowSize.height/2,

             initialTime:0,

             // 显示默认的视频控件

             showCenterPlayBtn:false,

             controls: false,

             objectFit:'cover',//,fill,contain,cover

             // 传入

             src

         });

    video.requestFullScreen();

video.play();

以下是上面的参数配置编译出来的界面,显示只有一半:




最后一次编辑于  09-16
回答关注问题邀请回答
收藏

1 个回答

  • 白开水
    白开水
    09-16

    你是想说视频不能填满整个屏幕还是视频不能完整展示?如果你说的是视频不能填满屏幕,那看这段代码

    const {width,height} = wx.getSystemInfoSync()
    wx.createVideo({
      x: 0,
      y: 0,
      width,
      height,
      src: 'http://xxxxxx.mp4',
      objectFit: 'fill'
    })

    如果你说视频不能完整展示,应该选择 contain 模式,cover 是表示视频会等比缩放以填满整个 width 和 height 设定的大小,但是有一边会超出去。如果不理解 contain 和 cover 可以参看这个 https://developer.mozilla.org/zh-CN/docs/Web/CSS/object-fit

    09-16
    赞同 1
    回复 3
    • 盛茂网络科技-13067605630
      盛茂网络科技-13067605630
      09-16
      fill模式我都试过了。fill模式填满的话,大小会很大,实际上也只能看到一部分。这个我觉得主要还是x,y,width,height的设置问题。
      09-16
      回复
    • 盛茂网络科技-13067605630
      盛茂网络科技-13067605630
      09-16
      我也设置了全屏模式,我的视频大小刚好是iphon6 的 750/1334
      09-16
      回复
    • 白开水
      白开水
      09-16回复盛茂网络科技-13067605630
      那自行排查一下吧,这里的问题应该和接口无关。
      09-16
      回复