微信小程序实现手指缩放图片

惠民小程序小编了解到，微信小程序成为当下热门话题，下面从多个方面来谈谈微信小程序实现手指缩放图片。

最新消息， 今日，京东发布开普勒小程序平台开放赋能解决方案，并宣布开普勒小程序服务商平台将在5月份推出。这也意味着京东将联合微信小程序做好小程序商城的搭建及其他营销服务，共同打造社交电商时代。 据悉，开普勒小程序可以帮助为品牌商提供小程序生成平台、小程序京商城、小程序

公司开发微信小程序，pm想实现如下需求：

用手指缩放图片。其实在实现这个需求以前，并不知道，微信公众号以及微信小程序里面有一个原生的api就自带这个特效，而且微信朋友圈也是用的这个api。wx.previewImage，就是它。预览图片。除了不能预览开发环境的本地电脑的图片外，你手机真机的图片，以及http服务器上的图片都是可以预览的，而且缩放功能做得很流畅。下面就说说如何用js来实现这个功能吧。

先上源码，然后在逐步剖析：

= 2) {newScale = 2}if(newScale <= 0.6) {newScale = 0.6}let scaleWidth = newScale * touch.baseWidthlet scaleHeight = newScale * touch.baseHeight// 赋值 新的 => 旧的this.setData({ 'touch.distance': distance,'touch.scale': newScale,'touch.scaleWidth': scaleWidth,'touch.scaleHeight': scaleHeight,'touch.diff': distanceDiff})},bindload: function(e) {// bindload 这个api是组件的api类似的onload属性this.setData({'touch.baseWidth': e.detail.width,'touch.baseHeight': e.detail.height,'touch.scaleWidth': e.detail.width,'touch.scaleHeight': e.detail.height})}})

wxml文件对应如下，就不做解释了：

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!