需要通过判断才能决定画不画出来的icon

[fqdltd]

如果我有个icon,那么这个icon 需要通过 我获取到的data 来判断他是否要画出来···这个需要怎么写呢···draw 方法里 有判断的 方法么？ 还是我可以在 draw之外 组成一个 series 数组 然后再传到 draw中呢

[kiccer]

你可以先判断好之后再调用 draw 绘制

[fqdltd]

另外如果画个 arc 支持 渐变么边框么···我有个需求 圆形的边框是渐变的颜色

[kiccer]

这个不支持，如果你现在需要这个功能，你可以尝试一个渐变的圆上面再覆盖一个小点的纯白的圆

[fqdltd]

还有个问题 画图的时候 我能拿到 文本的宽度么？ 比如我有个名称 这个名称是动态的 但是我又要在这个名称后面加上一个icon，现在就是我要怎么知道 我画出来的这个名称的 宽度 是多少···这个可以计算的出来么

[kiccer]

你可以参考一下我的这个回答

[fqdltd]

感谢····

[fqdltd]

我有3个 text 我如何 去获取 某一个 text的 字体宽度呢

[kiccer]

自定义关键字，然后通过关键字判断

[fqdltd]

import {
WxCanvas2d,
Text,
Image,
Arc,
Rect,
saveToAlbum
} from 'wx-canvas-2d'

canvas.draw({
series: _series
}).then(() => {
console.log('绘制成功！')
// 保存图片到相册
canvas.saveToAlbum({
destWidth: this.screenWidth,
destHeight: this.screenHeight - 92
}).then(res => {
wx.showModal({
content: '图片已保存到相册，赶紧晒一下吧~'
})
}).catch((err) => {
console.log(err)
if (err.code === 105) {
// wx.showModal({
// content: '请重新点击一次保存到相册'
// })
} else {
wx.showModal({
content: '图片保存失败'
})
}
})
}).catch(err => {
console.log('绘制失败！', err)
});

这样写法会出现 TypeError: canvas.saveToAlbum is not a function

[fqdltd]

我需要怎么画 才能把 头像 放到这个 原框内呢

[kiccer]

图片圆角可以解决

[kiccer]

import {
WxCanvas2d,
Text,
Image,
Arc,
Rect,
saveToAlbum
} from 'wx-canvas-2d'

canvas.draw({
series: _series
}).then(() => {
console.log('绘制成功！')
// 保存图片到相册
canvas.saveToAlbum({
destWidth: this.screenWidth,
destHeight: this.screenHeight - 92
}).then(res => {
wx.showModal({
content: '图片已保存到相册，赶紧晒一下吧~'
})
}).catch((err) => {
console.log(err)
if (err.code === 105) {
// wx.showModal({
// content: '请重新点击一次保存到相册'
// })
} else {
wx.showModal({
content: '图片保存失败'
})
}
})
}).catch(err => {
console.log('绘制失败！', err)
});

这样写法会出现 TypeError: canvas.saveToAlbum is not a function

#7

[fqdltd]

我设置了圆角
_series.push({
type: Image,
url: this.cardInfo.sysEnduserEntity.headPortrait,
x: 20 + 20,
y: this.screenHeight - 92 - 50 - 228 + 25,
width: 49,
height: 49,
mode: 'widthFix',
radius: 5000,
zIndex: 0
});

但是好像并没有效果···这个是 我获取的微信的头像

[kiccer]

你的5000太大了，根据你的图片大小，你的圆角最大只能设置成 49 / 2

[fqdltd]

我在微信开发者工具上 是可以 保存下来图片的···但是到真机上面就会 save的时候就会catch出异常
setTimeout(function() {
var _this = this;
canvas.draw({
series: _series
}).then(() => {
uni.showModal({
title: '授权提示',
content: "是否将图片保存到手机相册",
success: (res) => {
if (res.confirm) {
com.showLoading();
// 保存到相册
canvas.save({
destWidth: _this.screenWidth,
destHeight: _this.backImageHeight
}).then(res => {
com.hideLoading();
uni.showToast({
title: "保存成功",
icon: "none"
});
}).catch(err=>{
com.hideLoading();
uni.showToast({
title: "保存失败" + err,
icon: "none"
});
})

							} else {
								com.hideLoading();
								uni.showToast({
									title: "保存失败",
									icon: "none"
								});
							}
						}
					});
				}).catch(err => {
					com.hideLoading();
					//console.log('绘制失败！', err)
					uni.showToast({
						title: "保存失败" + err,
						icon: "none"
					});
				});
			}, 500)