小程序一个按钮可全屏滑动

<movable-area class="movable-box" style="height:calc(100vh - {{tabBarH}})px">
<slot/>
  <movable-view out-of-bounds="true" class='movable-v' x="{{x}}" y="{{y}}" damping='40' direction="all" bindchange="onChange" bindscale="onScale">
    <image class='mybnt' mode="aspectFit" src='https://sucai.suoluomei.cn/sucai_zs/images/20200110163116-fafa.png'>  image>
  movable-view>
movable-area>

js可以不写

  data: {
    x: 0,
    y: 0
  },

  onChange: function(e) {
    // console.log(e.detail)
    if (e.detail.x >= 150) {
      this.setData({
        x: 300,
        y: e.detail.y
      });
    }else{
      this.setData({
        x: 0,
        y: e.detail.y
      });
    }
  },

.movable-box {
  width: 100vw;
  height: calc(100vh - 0rpx);
  /* overflow: hidden; */
}

.movable-v {
  position: fixed;
  width: 150rpx;
  height: 150rpx;
  z-index: 100;
}

.mybnt {
  width: 150rpx;
  height: 150rpx;
}

引入的页面json添加这个

html引用

<buoy>buoy>