小程序 悬浮拖拽

<!--可拖动按钮控件表-->
<!--buttonStart和buttonEnd一定不能用catch事件，否则按钮点击事件会失效-->
<view class="btn_Suspension" bindtap="btn_Suspension_click" catchtouchmove="buttonMove" bindtouchstart="buttonStart" bindtouchend="buttonEnd" style="top:{{buttonTop}}px;left:{{buttonLeft}}px;">
  <image class="Suspension_logo" src="../../../images/upload_img/down.png"></image>
</view>

.btn_Suspension {
    position: fixed;
    height: 100rpx;
    width: 100rpx;
    background-color: rgba(255, 255, 255, 0.755);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    box-shadow: 1px 0px 1px 1px #ede7e7;
}

.Suspension_logo {
    position: absolute;
    height: 50%;
    width: 50%;
    left: 23%;
    top: 27%
}

var startPoint;
Page({
	data:{
	 buttonTop: 0,
    buttonLeft: 0,
    windowHeight: '',
    windowWidth: '',
    }
 //可拖动悬浮按钮点击事件
  btn_Suspension_click: function () {
    
    wx.showToast({
      title: '点击成功',
      icon: 'success',
      duration: 1000
    })
  },
  //以下是按钮拖动事件
  buttonStart: function (e) {
    startPoint = e.touches[0] //获取拖动开始点
  },
  buttonMove: function (e) {
    var endPoint = e.touches[e.touches.length - 1] //获取拖动结束点
    //计算在X轴上拖动的距离和在Y轴上拖动的距离
    var translateX = endPoint.clientX - startPoint.clientX
    var translateY = endPoint.clientY - startPoint.clientY
    startPoint = endPoint //重置开始位置
    var buttonTop = this.data.buttonTop + translateY
    var buttonLeft = this.data.buttonLeft + translateX
    //判断是移动否超出屏幕
    if (buttonLeft + 50 >= this.data.windowWidth) {
      buttonLeft = this.data.windowWidth - 50;
    }
    if (buttonLeft <= 0) {
      buttonLeft = 0;
    }
    if (buttonTop <= 0) {
      buttonTop = 0
    }
    if (buttonTop + 50 >= this.data.windowHeight) {
      buttonTop = this.data.windowHeight - 50;
    }
    this.setData({
      buttonTop: buttonTop,
      buttonLeft: buttonLeft
    })
  },
  buttonEnd: function (e) {
  },
})
  onLoad: function (options) {
    var that = this;
    wx.getSystemInfo({
      success: function (res) {
        console.log(res);
        // 屏幕宽度、高度
        console.log('height=' + res.windowHeight);
        console.log('width=' + res.windowWidth);
        // 高度,宽度 单位为px
        that.setData({
          windowHeight: res.windowHeight,
          windowWidth: res.windowWidth,
          buttonTop: res.windowHeight * 0.70, //这里定义按钮的初始位置
          buttonLeft: res.windowWidth * 0.70, //这里定义按钮的初始位置
        })
      }
    })
   })