第一步:先定义一个canvas标签,如下。
第二步:获取图片在view中的高度和宽度,uni获取高度和宽度的方法,如下。
let view = uni.createSelectorQuery().in(this);
view.select('#myCanvas').boundingClientRect(response => {}).exec();
response中就会返回一个指定的标签的宽高,还有一些top、buttom,的值。
第三步:生成canvas的图片,代码如下。
uni.getImageInfo({
src: this.image,
success: (response) => {
const canvas = uni.createCanvasContext('myCanvas', this);
const windowWidth = wx.getSystemInfoSync().windowWidth;
canvas.clearRect(0, 0, windowWidth, 300);
canvas.drawImage(response.path, 0, 0, 200, 200);
canvas.draw();
}
})
this.image:这个就是你要生成的图片。
第四步:把生成的canvas图片保存到本地,如下。
uni.showModal({
title: '提示',
content: '