游戏对局回放

游戏对局回放是 一组录制游戏画面来生成对局回放、并可以将对局回放分享给好朋友的 API，基础库 >= v2.8.0 支持。

录制

wx.getGameRecorder() 返回一个全局单例 GameRecorder，是一个游戏录制对象。录制游戏画面是一项比较消耗性能的能力，在某些系统、设备上无法进行游戏画面录制。因此在调用游戏画面录制能力前，需先判断当前环境是否支持该能力。

  1. const recorder = wx.getGameRecorder()
  2. console.log('是否支持录制游戏画面', recorder.isFrameSupported())
  3. // 目前还未实现，后期可能会支持到
  4. console.log('是否支持录制游戏画面的同时也录制音频', recorder.isSoundSupported())

所有和录制有关的 API 都挂载在 GameRecorder 上：

调用 GameRecorder.start() 开始录制，调用 GameRecorder.stop() 结束录制。

  1. const recorder = wx.getGameRecorder()
  2. // 发起开始录制的调用
  3. recorder.start()
  4. // start 事件的回调函数的执行表示录制的真正开始
  5. recorder.on('start', () => {
  6.   // 真正开始录制后的 5 秒后结束录制
  7.   setTimeout(() => {
  8.     recorder.stop()
  9.   }, 5000)
  10. })
  11. // stop 事件的回调函数的执行表示录制完成
  12. recorder.on('stop', (res) => {
  13.   console.log(`对局回放时长: ${res.duration}`)
  14. })

如果在录制过程中有玩家思考等待等过程，可以调用 GameRecorder.pause() 暂停录制，然后再用 GameRecorder.resume() 恢复录制。

  1. recorder.pause()
  2. // pause 事件的回调函数的执行表示录制真正暂停
  3. recorder.on('start', () => {
  4.   // 真正开始暂停后的 5 秒后恢复录制
  5.   setTimeout(() => {
  6.     recorder.resume()
  7.   }, 5000)
  8. })
  10. // resume 事件的回调函数的执行录制继续进行
  11. recorder.on('resume', () => {
  12.   console.log('继续录制')
  13. })

如果想舍弃已经在录制的视频，可以调用 GameRecorder.abort()

  1. recorder.abort()
  2. // abort 事件的回调函数的执行表示录制中的游戏画面已经被舍弃
  3. recorder.on('abort', () => {
  4.   console.log('继续录制')
  5. })

stop 事件触发就表示已经有一个录制好的视频被输出来了。录制完成的视频保存在内部，不能被访问到，也不能直接播放，只能发送给好友或分享到微信游戏中心。内部只会保存 最近一次录制的视频，发起分享时也只会分享这个 最近一次录制的视频。

分享

游戏对局回放的分享不能通过调用 API 触发，只有在用户点击 游戏对局回放分享按钮 时才会发起。需要调用 wx.createGameRecorderShareButton() 创建 游戏对局回放分享按钮。参数分为两部分，指定按钮样式的 style 和指定分享配置的 share。

按钮的默认样式如下：

游戏对局回放 - 图1

icon 指定左侧的图标，text 指定右侧的按钮文本，style.backgroundColor 指定按钮的背景色，image 指定按钮的背景图片，会覆盖背景色。完整的参数说明参见 wx.createGameRecorderShareButton() 。

  1. const button = wx.createGameRecorderShareButton({
  2.   // 样式参数
  3.   style: {
  4.     left: 10,
  5.     top: 150,
  6.     height: 50,
  7.     color: '#ffffff',
  8.     textAlign: 'center',
  9.     fontSize: 16,
  10.     borderRadius: 4,
  11.     iconMarginRight: 16,
  12.     paddingLeft: 1,
  13.     paddingRight: 30,
  14.   },
  15.   // 按钮的背景图片
  16.   image: 'button.jpg',
  17.   text: '自定义文案',
  18.   icon: 'icon.jpg',
  19.   // 分享参数
  20.   share: {
  21.     query: 'a=1&b=2',
  22.     // 背景音乐的路径
  23.     bgm: 'walkin.mp3',
  24.     timeRange: [[0, 1000], [2000, 3000]],
  25.     title: {
  26.       template: 'default.score',
  27.       data: {
  28.         score: 6500
  29.       }
  30.     },
  31.     button: {
  32.       template: 'default.enter',
  33.     }
  34.   }
  35. })

点击按钮后会拉起视频编辑界面，用户可以对视频再加一首背景音乐或增加一些表情、贴纸。

游戏对局回放 - 图2

点击视频编辑界面右下角的绿色按钮可以将视频分享到会话。

游戏对局回放 - 图3

点击分享到会话的卡片可以进入视频，点击视频左下角的按钮可以跳转到该小游戏。

游戏对局回放 - 图4

分享参数的含义如下：

  • share.title 对局回放标题的配置。这个配置生成的文案会出现在视频上和视频的分享卡片的副标题处。配置的含义见 wx.createGameRecorderShareButton()。
  • share.button 对局回放按钮文案的配置。在视频上点击这个按钮会跳转到录制这个视频的小游戏。配置的含义见 wx.createGameRecorderShareButton()。
  • share.query 点击按钮跳转小游戏时的 query。
  • share.bgm 对局回放的背景音乐。用户可以在转发之前的视频编辑界面上再选一首背景音乐，两个音乐会混合在一起，而不是覆盖。
  • share.timeRange 录制对局回放的裁剪区间。是一个二维数组，单位 ms（毫秒）。[[1000, 3000], [4000, 5000]] 表示剪辑已录制视频的 1-3 秒和 4-5 秒最终合成为一个 3 秒的视频。对局回放剪辑后的总时长最多 60 秒，即 1 分钟。

分享过程中的异常

分享结果不能被获取到，但是如果分享过程中发生了客户端层面的异常，GameRecorderShareButton.onTap() 注册的回调函数会执行。

  1. button.onTap(res => {
  2.   console.log(`错误码：${res.error.code}，错误信息：${res.error.message}`)
  3. })