vivo x9  微信版本7.0.4   系统版本2.6.2

var memberTopicCount = this.data.memberTopicCount;//动态数

var memberFollowCount = this.data.memberFollowCount;//关注数

var memberBeFollowedCount = this.data.memberBeFollowedCount;//粉丝数

var memberNickName = this.data.memberNickName;//名字

var memberAvatarPath = this.data.memberAvatarPath;//头像

var that = this;

var memberIds = storage.getMember();

var memberId = memberIds.memberId;

http.request({

url: '/wechatMessage/access/mobile/v1/token',

data: {

},

success: function (data) {

http.request({

url: '/file/mobile/v1/saveImg/wxacode',

method: 'POST',

data: {

wxaCodePath: 'view/member/homePage?memberId=' + memberId,

},

success: function (data) {

var filepath = that.data.imageHost + data.filePath;

wx.downloadFile({

url: that.data.imageHost + data.filePath,

success: function (fliesres) {

that.setData({

hiddensaveimage: true,

filePathimg: that.data.imageHost + data.filePath

})

wx.showToast({

title: '生成中',

icon: 'loading',

duration: 6000

})

wx.downloadFile({

url: that.data.imageHost + that.data.memberAvatarPath,

success: function (sres) {

that.setData({

mysrc: sres.tempFilePath,

})

wx.downloadFile({

url: that.data.backimage,

success: function (backimage) {

const ctx = wx.createCanvasContext('smile')

ctx.save(); // 先保存状态 已便于画完圆再用

ctx.beginPath()

ctx.drawImage(backimage.tempFilePath, 0, 0, 960, 1120)

ctx.font = "bold 16px PingFangSC-Regular, sans-serif"

ctx.setFontSize(37)

// 判断字体长度

if (that.data.memberNickName.length === 4) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 260;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 1) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 300;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 2) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 285;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 6) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 230;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 5) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 240;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 8) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 240;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length === 10) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 220;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

if (that.data.memberNickName.length > 10) {

var avatarurl_widths = 400;    //绘制的头像宽度

var avatarurl_heigths = 400;   //绘制的头像高度

var avatarurls_x = 210;   //绘制的头像在画布上的位置

var avatarurls_y = 185;   //绘制的头像在画布上的位置

ctx.fillText(that.data.memberNickName, avatarurl_widths / 2 + avatarurls_x - 40, avatarurl_heigths / 2 + avatarurls_y + avatarurls_y + 5)

}

ctx.font = "normal 16px PingFangSC-Regular, sans-serif"

ctx.setFontSize(32)

ctx.fillText('动态:' + memberTopicCount, 270, 660, 150)

ctx.fillText('关注:' + memberFollowCount, 440, 660, 150)

ctx.fillText('粉丝:' + memberBeFollowedCount, 600, 660, 150)

ctx.drawImage(fliesres.tempFilePath, 760, 900, 140, 140)

ctx.font = " 30px PingFangSC-Regular, sans-serif"

ctx.setFontSize(28)

ctx.fillText('长按扫码关注', 720, 1070)

ctx.beginPath(); //开始绘制

//先画个圆

var avatarurl_width = 180;    //绘制的头像宽度

var avatarurl_heigth = 180;   //绘制的头像高度

var avatarurl_x = 400;   //绘制的头像在画布上的位置

var avatarurl_y = 330;   //绘制的头像在画布上的位置

ctx.arc(avatarurl_width / 2 + avatarurl_x, avatarurl_heigth / 2 + avatarurl_y, avatarurl_width / 2, 0, Math.PI * 2, false);

ctx.clip();//画好了圆 剪切  原始画布中剪切任意形状和尺寸。则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因

ctx.setFillStyle('#EEEEEE')

ctx.drawImage(sres.tempFilePath, avatarurl_x, avatarurl_y, avatarurl_width, avatarurl_heigth);

ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制

ctx.draw(true, setTimeout(function () {

wx.canvasToTempFilePath({

canvasId: 'smile',

success: function (res) {

wx.saveImageToPhotosAlbum({

filePath: res.tempFilePath,

success: function (data) {

console.log(res.tempFilePath);

wx.previewImage({

current: res.tempFilePath, // 当前显示图片的http链接  

urls: [res.tempFilePath] // 需要预览的图片http链接列表  

})

wx.showToast({

title: '保存成功',

mask: true,

icon: "success",

duration: 1500

})

wx.hideToast();

}, fail: function (res) {

wx.getSetting({

success: (res) => {

if (!res.authSetting['scope.writePhotosAlbum']) {

that.openConfirm();

} else {

}

}

})

wx.showToast({

title: '保存失败',

mask: true,

icon: "none",

duration: 1500

});

}

})

}, fail: function (fres) {

that.setData({

hiddensaveimage: false

})

wx.showToast({

title: '生成失败,请稍后重试',

mask: true,

icon: "none",

duration: 1500

})

}

})

that.setData({

hiddensaveimage: false

})

}, 1000))

}, fail: function (fres) {

}

})

}

})

}

})

// 生图片end

}

});

}.bind(this)

});