微信小程序根据图片获取相应的主题色
·
async getRgba(imgs) {
const hexColor = await this.getImageColor(imgs)
var r = parseInt(hexColor.slice(1, 3), 16);
var g = parseInt(hexColor.slice(3, 5), 16);
var b = parseInt(hexColor.slice(5, 7), 16);
// 构建渐变背景
const startColor = `rgb(${r}, ${g}, ${b})`;
const gradientBg = `linear-gradient(180deg, ${startColor} 0%, #F9F9F9 100%)`;
this.setData({
rgbaColor: gradientBg
})
},
getImageColor(url) {
return new Promise((resolve, reject) => {
url = url.split('?')[0]
wx.request({
url: url + '?x-oss-process=image/average-hue',
success: (res) => {
if (res.statusCode === 200) {
let color = res.data.RGB.replace(/0x/g, '#')
resolve(color)
} else {
reject(res)
}
}
})
})
},
我搭配用的是阿里云的云存储,也有可以第三方和canvas来提取,如果有需要我后续可以出示例
更多推荐



所有评论(0)