收藏
回答

canvas生成的图片不能覆盖整个屏幕,这是怎么回事?

问题模块
API和组件

canvas生成的图片不能覆盖整个屏幕,这是怎么回事?

最后一次编辑于  2017-12-04
回答关注问题邀请回答
收藏

4 个回答

  • Tellno
    Tellno
    2017-12-04

    windowHeight 就是获取手机屏幕的高度,然后设置canvas的高度为屏幕的高度,然后导出图也是canvas的高度,导出的图片的长度高度都是canvas的宽高,但在预览的时候下面就如上图有一段黑

    2017-12-04
    赞同
    回复
  • Holyhulk
    Holyhulk
    2017-12-04

    windowHeight 是从哪里读取的呢?尝试使用 getUserInfo 中的 screenHeight

    2017-12-04
    赞同
    回复
  • Tellno
    Tellno
    2017-12-04

    <view  wx:if="{{show==true}}" >

    <canvas style="width:100%;height:{{windowHeight}}px;" canvas-id="myCanvas"></canvas>

    </view>

    save: function () {

    let that = this;

    wx.showLoading({

    title: '正在生成',

    mask: 'true'

    })

    that.setData({

    show: true

    })

    that.drawimage(that.data.windowWidth, that.data.windowHeight)

    setTimeout(() => {

    wx.canvasToTempFilePath({

    x: 0,

    y: 0,

    width: that.data.windowWidth,

    height: that.data.windowHeight,

    canvasId: 'myCanvas',

    success: function (res) {

    wx.hideLoading()

    console.log(res.tempFilePath)

    that.setData({

    show:false

    })

    wx.previewImage({

    urls: [res.tempFilePath],

    })

    }

    })

    },3000)

    },

    drawimage: function (width,height){

    const ctx = wx.createCanvasContext('myCanvas')

    ctx.drawImage('../../static/images/2.jpg', 0, 0, width, height)

    ctx.draw()

    }


    有一段黑

    2017-12-04
    赞同
    回复
  • Holyhulk
    Holyhulk
    2017-12-04

    你好,请提供一下能复现问题的简单代码示例。

    2017-12-04
    赞同
    回复