VideoContext ☁️

wx.createVideoContext(id, this)

创建 video 上下文 VideoContext() 对象。

参数

• id (string()) – <video> 组件的 id

• this (object()) – 在自定义组件下，当前组件实例的this，以操作组件内 <video> 组件

返回

VideoContext()

class VideoContext()

VideoContext 实例，可通过 wx.createVideoContext() 获取。

videoContext 通过 id 跟一个 <video> 组件绑定，对应操作的 <video> 组件。

方法

VideoContext.play()

播放视频

VideoContext.pause()

暂停视频

VideoContext.stop()

停止视频

VideoContext.seek(position)

跳转到指定位置

参数

• position (number()) – 跳转到的位置，单位 s

VideoContext.sendDanmu({text[,color]})

发送弹幕

参数

• text (string()) – 弹幕文字

• color (string()) – 弹幕颜色

VideoContext.playbackRate(rate)

设置倍速播放

参数

• rate (number()) – 倍率，支持 0.5/0.8/1.0/1.25/1.5，2.6.3 起支持 2.0 倍速

1.4.0 新版功能: 低版本需做 兼容处理 。

VideoContext.requestFullScreen({[direction]})

进入全屏

参数

• direction (number()) –

  设置全屏时视频的方向，不指定则根据宽高比自动判断, 合法值:

  • 0 正常竖向

  • 90 屏幕逆时针90度

  • -90 屏幕顺时针90度

1.4.0 新版功能: 低版本需做 兼容处理 。

1.7.0 新版功能: 参数 direction

VideoContext.exitFullScreen()

退出全屏

1.4.0 新版功能: 低版本需做 兼容处理 。

VideoContext.showStatusBar()

显示状态栏，仅在iOS的全屏下有效

2.1.0 新版功能: 低版本需做 兼容处理 。

VideoContext.hideStatusBar()

隐藏状态栏，仅在iOS的全屏下有效

2.1.0 新版功能: 低版本需做 兼容处理 。

示例代码

在开发者工具中预览效果

<view class="section tc">
  <video
    id="myVideo"
    src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400"
    enable-danmu
    danmu-btn
    controls
  ></video>
  <view class="btn-area">
    <input bindblur="bindInputBlur" />
    <button bindtap="bindSendDanmu">发送弹幕</button>
  </view>
</view>

function getRandomColor() {
  const rgb = []
  for (let i = 0; i < 3; ++i) {
    let color = Math.floor(Math.random() * 256).toString(16)
    color = color.length == 1 ? '0' + color : color
    rgb.push(color)
  }
  return '#' + rgb.join('')
}

Page({
  onReady(res) {
    this.videoContext = wx.createVideoContext('myVideo')
  },
  inputValue: '',
  bindInputBlur(e) {
    this.inputValue = e.detail.value
  },
  bindSendDanmu() {
    this.videoContext.sendDanmu({
      text: this.inputValue,
      color: getRandomColor()
    })
  }
})