小程序video隐藏控件

wxml页面里 我直接写controls=’true‘效果没显示对 所以写在了js里

<video
    id="myVideo"
    src="{{videoUrl}}"
    loop='true'
    controls='{{controls}}'
    show-fullscreen-btn='{{controls}}'
    autoplay="true"
    object-fit='cover'
   bindtap='videoTap'
  >
  </video>

js

Page({
  data:{
    controls:false
  }
})

controls 是否显示默认播放控件（播放/暂停按钮、播放进度、时间）

autoplay自动播放

loop 是否循环播放

src 播放地址

show-fullscreen-btn 是否显示全屏

object-fit 当视频大小与 video 容器大小不一致时，视频的表现形式

video全屏的样式

#myVideo{
  position: absolute;
  width: 100%;
  height: 100%;
  background: #cdcdcd;
  overflow: hidden;
  flex-direction:column;
  align-items:center;/*垂直居中*/
  justify-content: center;/*水平居中*/
  z-index: 1;
}

微信小程序文档 ​​​https://developers.weixin.qq.com/miniprogram/dev/component/video.html​​​

上面很多功能都有说明。