# 视频
小游戏可以使用 wx.createVideo() 在界面上插入视频。
const src = 'http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400'
const video = wx.createVideo({
x: 10,
y: 76,
width: 300,
height: 200,
// 显示默认的视频控件
controls: true,
// 传入
src
})
视频的层级比画布高，因此在画布上绘制的内容会被视频遮盖。小游戏不支持 cover-view/cover-image，所以无法在视频上覆盖其他自定义 UI 元素。
小游戏中可以插入多个视频。后插入的视频层级比先插入的层级高。
# 控制视频
wx.createVideo() 返回的 Video 对象有控制视频进行播放、暂停、进度跳转、全屏、退出全屏的方法。
播放视频
video.play()
暂停视频
video.pause()
进度跳转
video.seek(10)
# 监听事件
Video 也提供了对视频缓冲、暂停、播放进度等事件的监听接口
video.onTimeUpdate(res => {
console.log('当前进度', res.currentTime)
console.log('视频总时长', res.duration)
})
video.onEnded(res => {
console.log('视频播放完了')
})
# 取消监听事件
每个 on* 事件监听接口都有对应的 off* 接口，用来取消对事件的监听。
on* 接口将回调函数压入事件的回调函数队列，当事件发生时，回调函数队列会被遍历，其中的函数会被逐个执行。
off* 接口将回调函数从事件的回调函数队列中移除，当事件发生时，队列中没有该函数，于是该函数便不会执行。
let callback = res => {
console.log('当前进度', res.currentTime)
console.log('视频总时长', res.duration)
// 当播放到第 3 秒时，调用 off* 接口取消对该事件的监听，callback 函数将不再执行
if (res.currentTime >= 3) {
video.offTimeUpdate(callback)
}
}
video.onTimeUpdate(callback)
对于 off* 接口有一种常见的错误理解，如下
video.onTimeUpdate(res => {
console.log('当前进度', res.currentTime)
console.log('视频总时长', res.duration)
})
video.play()
setTimeout(() => {
video.offTimeUpdate(res => {
console.log('当前进度', res.currentTime)
console.log('视频总时长', res.duration)
})
}, 3000)
这里传入 on* 接口和 off* 接口的两个函数虽然代码一样，但是是两个不同的函数实例。因此 off* 接口在回调函数队列中找不到这个实例，也就做不到把这个函数从回调函数队列中移除了。
# 销毁视频
当不再需要使用视频时，可以将创建的视频销毁
video.destroy()