小程序生成图片保存到系统相册

完整的page文件

// pages/canvas/canvas.js

Page({

/**

* 页面的初始数据

*/

data: {

},

/**

* 生命周期函数--监听页面加载

*/

onLoad: function (options) {

//先创建一个画布

const ctx = wx.createCanvasContext( "nihao")

//填充背景色

ctx.fillStyle = '#fff';

ctx.fillRect( 0, 0, 250, 150)

//将图片转化为画布

ctx.drawImage( "titleFont.png", 0, 0, 250, 90)

ctx.drawImage( "zhuye1.png", 0, 0, 200, 150)

ctx.drawImage( "mozhu.png", 0, 0, 250, 150)

//成功执行，draw方法中进行回调

ctx.draw( true, function(){

console.log( "draw callback success")

//保存临时图片

wx.canvasToTempFilePath({

x: 0,

y: 0,

width: 250,

height: 150,

destWidth: 250,

destHeight: 150,

canvasId: 'nihao',

success: function (res) {

console.log( "get tempfilepath(success) is:",res.tempFilePath)

//将图片保存在系统相册中(应先获取权限，)

wx.saveImageToPhotosAlbum({

filePath: res.tempFilePath,

success(res) {

console.log( "save photo is success")

},

fail: function () {

console.log( "save photo is fail")

}

})

},

fail: function () {

console.log( 'get tempfilepath is fail')

}

})

})

},

/**

* 生命周期函数--监听页面初次渲染完成

*/

onReady: function () {

},

/**

* 生命周期函数--监听页面显示

*/

onShow: function () {

},

/**

* 生命周期函数--监听页面隐藏

*/

onHide: function () {

},

/**

* 生命周期函数--监听页面卸载

*/

onUnload: function () {

},

/**

* 页面相关事件处理函数--监听用户下拉动作

*/

onPullDownRefresh: function () {

},

/**

* 页面上拉触底事件的处理函数

*/

onReachBottom: function () {

},

/**

* 用户点击右上角分享

*/

onShareAppMessage: function () {

}

})