作者大大,您好,非常感谢提供这么棒的一个插件,在使用插件的时候有遇到一些模糊问题,具体场景如下:1 这边是通过uniapp开发微信小程序,在剪切用户上传的头像时,剪切后会很模糊,设置过quality为1,但是还是很模糊。真机效果可见附件。
- 发布:2020-04-01 17:39
- 更新:2020-04-07 11:15
- 阅读:1445
前行者007 - 写代码是不可能写一辈子的,早日上岸吧!
2019年11月份解决过,uniapp(Android+iOS),截图过于模糊,调试解决了,放大截图保存参数放大,具体如代码,H5和小程序部分没试过,具体对照加下应该问题也不大。希望对你有帮助。
uni.canvasToTempFilePath({
x: x,
y: y,
width: width,
height: height,
destWidth: expWidth5,
destHeight: expHeight5,
scale:5,
canvasId: 'avatar-canvas',
// fileType: 'png',
fileType: 'jpeg',
quality: 1.0,
success: (r)=>{
r = r.tempFilePath;
let ctxCanvas = this.ctxCanvas;
// expWidth = this.exportWidth2,
// expHeight = this.exportHeight2;
expWidth = this.exportWidth5,
expHeight = this.exportHeight5;
// ctxCanvas.drawImage(r, 0, 0, expWidth, expHeight);
ctxCanvas.scale(this.scaleSize5, this.scaleSize5);
ctxCanvas.drawImage(r, 0, 0, expWidth, expHeight);
ctxCanvas.draw(false);
this.$emit("upload", {avatar: this.imgSrc, path: r, index: this.indx, data: this.rtn});
return;
enson (作者)
问题已解决!!可以通过expWidth,expHeight 设置导出的图片宽高,提高图片的清晰度,主要问题是因为自身对小程序的canvasToTempFilePath方法不太熟悉
1 先通过设置canvasToTempFilePath的fileType为jpg(quality只对jpg有效),quality为1
2 通过expWidth/expHeight 设置canvasToTempFilePath的destWidth/destHeight,设置输出的图片的宽高
二步走后即可提高图片的清晰度
参考文档:1 https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html
2 https://ext.dcloud.net.cn/plugin?id=404#rating
enson (作者)
赞!!非常感谢分享!!!受益匪浅!!!
2020-04-07 11:00