小程序swiper图片缩放预览

        小程序中swiper是封装好的,它的性能配置这里不介绍了,不懂的同志可以点击https://developers.weixin.qq.com/miniprogram/dev/component/swiper.html进行查看,上面介绍的很详细,但是上面没有说明swiper可以放大轮播,对于初学者来说是一脸懵逼。

        听到放大轮播,脑子里第一反应是将整个swiper的宽高加倍,调整position和z-index,让它覆盖于其他组件之上,成功了,但只是粗糙的实现效果,当缩放回去的时候,页面其他组件出现瞬间的弹跳,因为swiper从原有的位置上移出,造成其他组件位置变动,于是又想到放置2个一样的swiper,一个放置原位,一个用于缩放,后者更改样式,进行显示隐藏操作即可,功能上实现了,但是代码量也增多。

        在小程序的API上wx.previewImage接口(媒体-图片)可以实现此功能,并且swiper中的图片还能通过计算两指间距实现放大缩小,将接口放入image绑定的方法中就好。

接口配置
具体方法
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 13,085评论 2 59
  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明AI阅读 16,026评论 3 119
  • 周末回老家看望母亲。只需带两套衣服,我提了个大拉杆箱。吴哥送我出门时盯着箱子问:“两套衣服怎么要这么大箱子?” “...
    月儿上山了阅读 1,753评论 59 35
  • 半年下来,突然发现自己画了这么多少女手绘呢!
    兰登pro阅读 301评论 20 2
  • 2006年 8月8日 星期二 晴 对老一辈的人来说,每年都有四个祭奠祖先和已故亲人的重要日子。一个是祭日,也就是亲...
    音乐如水阅读 839评论 0 2