Closed weisiwu closed 5 years ago
代码如下:
import weCropper from '../../we-cropper/dist/weCropper.js'; var app = getApp(); const device = wx.getSystemInfoSync() // 获取设备信息 const width = 350; const height = 300; Page({ data: { "choseImg": "choseImageBtn.png", "chosenImg": "", "indexBk": "index-bk.png", wecropper: null, cropperOpt: { id: 'cropper', width, height, scale: 2.5, zoom: 8, cut: { x: 0, y: 0, width: 350, height: 300 } } }, onLoad: function() { var that = this; // 页面加载时初始化画布 const { data } = this // 若同一个页面只有一个裁剪容器,在其它Page方法中可通过this.wecropper访问实例 var wecropper = new weCropper(that) .on('ready', (ctx) => { }) .on('beforeImageLoad', (ctx) => { wx.showToast({ title: '上传中', icon: 'loading', duration: 20000 }) }) .on('imageLoad', (ctx) => { wx.hideToast() }); // 加载页面请求用户数据 app.getUserInfo(function(userInfo){ //更新数据 that.setData({ "userInfo": userInfo, "wecropper": wecropper, "date": ((new Date).getDate() + "." + ((new Date).getMonth() + 1) + "." + (new Date).getFullYear()) }); }); }, // 选择图片函数 choseImg: function(evt) { var that = this; console.log("点击按钮!"); // 选择完毕后,显示等待提示 wx.chooseImage({ count: 1, success: function(res) { var tempFilePaths = res.tempFilePaths; wx.showLoading({ title: "加工中", complete: function() { setTimeout(function() {wx.hideLoading()}, 500); } }); that.setData({ "chosenImg": tempFilePaths, "showBtnLine": "block", "showChose": "none" }); }, fail: function(errInfo) { wx.showLoading({ title: "加工失败", complete: function() { setTimeout(function() {wx.hideLoading()}, 1000); } }); } }); }, // 剪切图片 modifyImg: function() { var that = this, src = that.data.chosenImg[0]; this.wecropper.pushOrign(src); this.wecropper.getCropperImage((src) => { that.setData({ "chosenImg": src }); }); // 保存图片到服务器 //that.saveImg(); } });
@dlhandsome 想请教您一下,十分感谢。
这个地方是有点问题,当初是想通过改变输出尺寸来解决清晰度问题,但貌似这个思路是错的
有解决办法吗
2019年,这个问题终于要解决了。。 https://github.com/we-plugin/we-cropper/pull/88
代码如下: