微信小程序图片压缩

微高兄信小程序图片压缩有三种方法，一种是使用官方提供的接口 wx.compressImage(Object object) ；一种是通过压缩图片的大小，利用canvas重绘来得到压缩图片；最后一种安装第三方图片压缩包。

由于第一种方法网上很多人说压缩不明显或者失效，所以选择使用canvas重绘来实现图片压缩。同时，该种方法可以控制图片的最大尺寸，保持上传图片大小尺寸相差不多。在我们的学生节晚会小程序中，屏幕显示图片会比较美观一致。

1. 通过 wx.chooseImage 接口选择相机图片

2. 通过 wx.getImageInfo 接口获取图片信息（长宽，类型）

3. 计算压缩比例和最终图片的长宽

5. 通过 wx.canvasToTempFilePath 接口将画布内容导出为图片并获取图片路径

wxml 文件

在文件末尾插入 canvas 组件，通过设置left和配隐top值确保图片不会显示在可视范围内。

一定要设置 canvas-id，这是canvas绘图和导出图片必备的属性。

js 文件

设置与页面绑定的数据：canvas的大小，培念厅也是压缩后图片的大小

1. 将画布内容导出为图片时，指定destWidth和destHeight为压缩后图片的大小。这里遇到过玄学bug，不指定的话，有时候图片不会压缩到规定的大小。

实现功能参考： 微信小碧困程序自定义组件实现图片单指拖动、双指缩放效果 有修改。

给图片加拖灶慧旁动事件，我们需要知道它什么时候被点击、被拖拽和拖拽结束。

通过修改imageView的margin-left和margin-top来改变图片的位置以实现图片的单指移动隐橡效果和所有 *** 作结束松手后的回d效果。

通过修改imageView的宽和高以实现图片放大缩小的效果。且需要同时修改其margin-left和margin-top使图片能以【两手指的中间点为原点】缩放。

Talk is cheap, show you the code.

接下来是交互事件

手机把照片缩小到100k方法一

1、首先打开手机，在手机的浏览器上输入“极速img”，然后在点击并进入其官网。

2、进入官网后，在首页点击“上传图片”，选择手机相册或者文件夹中的图片，然后点击开始压哗颤缩，完成后点击下载即可，这样就可以把照片缩小到100k。

手机把照片缩小到100k方法二：

1、首先打开手机，在手机桌面上找到“答皮微信”并点击进入。

2、进入到“微信”的首页后，然后点击页面下方的“发现”选项，在“发现”页面中找到“小清芦差程序”点击进入。

3、进入到“小程序”界面后输入“极速玩转”搜索并打开该小程序，在“极速玩转”界面选择“图片无损压缩”进入压缩页面。

4、然后点击页面中的“+”选项上传图片，可打开相册选择图片或直接拍照上传压缩都可以，成功后页面会自动跳转至“转换成功”，点击文件名后的“下载”按钮下载图片即可。

---