小程序的拖拽、缩放和旋转手势

在开发中，有时会遇到像App中的手势那样的效果，下面就仿照App实现了一下。 
wxml部分：

<view class="touch-container">
  "msg">{{msg}}</view>
    "img"
style"width: {{}}rpx; heightheight leftleft toptop transform translate(-50%,-%) scale({{ scale }}) rotate rotate deg);"
catchtouchstart"touchstart"
catchtouchend"touchend"
</view>

wxss部分：

}

msg 60rpx;
  fontsize30rpx;
}
  position absolute690rpx300rpx;
js部分：


var canOnePointMove = false
  x0,
 twoPoint   x1  y20

Page({
    msg ''    src'http://img01.taopic.com/150508/318763-15050PU9398.jpg'    height    left375    top600    scale1    rotate0

  onReachBottomfunction()    return
 width  edetailwidth
ifwidth >750      height 750*/ width
    }
1200 height
    thatsetData({
  touchstartthis
      onePointx [].pageX 2
}else      twoPointx1 2
x2 y2   touchmove){
 onePointDiffY y
        left thatdataleft + onePointDiffX        toptop  onePointDiffY
 preTwoPoint  JSONparseJSONstringifytwoPoint))
 perAngle  Mathatan((preTwoPoint preTwoPointy2)/(x2))*180/PI
(absperAngle  curAngle        that          msg'旋转'          rotaterotate curAngle  perAngle)
         predistance sqrtpow),0);"> curdistance ))
          scalescale curdistance  predistance0.005
}
json部分：


"navigationBarTitleText""识别手势"  "navigationBarTextStyle":"black""navigationBarBackgroundColor""#FFF""disableScroll"true

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。