收藏
回答

drawImage绘制未播放video使用canvasToTempFilePath后安卓无法显示

框架类型 问题类型 操作系统 工具版本
小程序 Bug Windows 1.06.2409140

-当前bug

-代码片段

我在视频元数据加载完后使用

createSelectorQuery

获取视频的上下文,

使用下面代码绘制到下面的节点上展示出来,但是安卓无法展示,IOS和开发者工具都可以,安卓需要点击一下播放再点击截图才行,



 seekComplete: function () {


      const {

        canvasWidth,

        canvasHeight,

        video

      } = this.data

      const Offcanvas = wx.createOffscreenCanvas({

        type: '2d',

        width: canvasWidth,

        height: canvasHeight,

        compInst: this,

      })

      const context = Offcanvas.getContext('2d')

      // console.log('离屏的canvas实例',canvas.getContext('2d'));

      context.clearRect(0, 0, canvasWidth, canvasHeight)

      context.drawImage(video, 0, 0, canvasWidth, canvasHeight)

      console.log(context, 'Offcanvas', video);

      setTimeout(() => {

        wx.canvasToTempFilePath({

          x: 0,

          y: 0,

          width: canvasWidth,

          height: canvasHeight,

          destWidth: canvasWidth,

          destHeight: canvasHeight,

          canvas: Offcanvas,

          success: res => {

            console.log('获取离屏canvas路径回调', res.tempFilePath);

            this.setData({

              coverImagePath: res.tempFilePath,

            });

            this.triggerEvent("captureSuccess", {

              coverImagePath: res.tempFilePath,

            });

          },

          fail: error => {

            console.error('获取失败', error)

          }

        })

      }, 300)


回答关注问题邀请回答
收藏

1 个回答

  • Demons
    Demons
    11-07

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    11-07
    有用
    回复 1
    • 在的啊
      在的啊
      星期一 14:24
      在当前页面OSS上传视频到阿里云后拿到视频获取他的上下文,然后点击获取视频封面截图视频canvas转换图片,安卓真机在未播放的情况不会截图,。我不太会提供代码片段
      星期一 14:24
      回复
登录 后发表内容