小程序
小游戏
企业微信
微信支付
扫描小程序码分享
web-view页怎样添加一个可手指拖动悬浮按钮啊？有没有人知道啊，按钮是用cover-view写的，在其上添加了bindtouchmove="buttonMove" bindtouchstart="buttonStart" 事件，ios可以拖动，但安卓是一点也拖不动啊
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
打印一下看是不是报错了，还有就是返回的参数是不是有什么区别，或者使用https://developers.weixin.qq.com/miniprogram/dev/component/movable-area.html方法试一下
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
<web-view src="">
<cover-view class="show w" bindtap="userClose" bindtouchmove="buttonMove" bindtouchstart="buttonStart" style="top:{{buttonTop}}rpx;left:{{buttonLeft}}rpx;">
<cover-image src="https://sales-dev.ihxlife.com/HuaPM_V/bcard/image/room/tool_show.png" class="user_show"></cover-image>
<cover-view class="text">显示</cover-view>
</cover-view>
</web-view>
data: {
tpUrl: 'https://sales-int.ihxlife.com/ldi/mp/ww.html',
buttonTop: "",
buttonLeft: "",
windowHeight: '',
windowWidth: '',
},
userClose() {
console.log(4556677)
buttonStart: function (e) {
console.log(777, e)
this.setData({
startPoint: e.touches[0]
})
//获取拖动开始点
buttonMove: function (e) {
console.log(666, e)
let rpx = this.data.rpx
var endPoint = e.touches[e.touches.length - 1] //获取拖动结束点
//计算在X轴上拖动的距离和在Y轴上拖动的距离
var translateX = endPoint.clientX - this.data.startPoint.clientX
var translateY = endPoint.clientY - this.data.startPoint.clientY
startPoint: endPoint
}) //重置开始位置
var buttonTop = this.data.buttonTop + translateY / rpx
var buttonLeft = this.data.buttonLeft + translateX / rpx
//判断是移动否超出屏幕
if (buttonLeft + 90 >= this.data.windowWidth) {
buttonLeft = this.data.windowWidth - 90;
}
if (buttonLeft <= 0) {
buttonLeft = 0;
if (buttonTop <= 0) {
buttonTop = 0
if (buttonTop + 138 >= this.data.windowHeight) {
buttonTop = this.data.windowHeight - 138;
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
打印一下看是不是报错了，还有就是返回的参数是不是有什么区别，或者使用https://developers.weixin.qq.com/miniprogram/dev/component/movable-area.html方法试一下
<web-view src=""><cover-view class="show w" bindtap="userClose" bindtouchmove="buttonMove" bindtouchstart="buttonStart" style="top:{{buttonTop}}rpx;left:{{buttonLeft}}rpx;"><cover-image src="https://sales-dev.ihxlife.com/HuaPM_V/bcard/image/room/tool_show.png" class="user_show"></cover-image><cover-view class="text">显示</cover-view></cover-view></web-view>data: {tpUrl: 'https://sales-int.ihxlife.com/ldi/mp/ww.html',buttonTop: "",buttonLeft: "",windowHeight: '',windowWidth: '',},userClose() {console.log(4556677)},buttonStart: function (e) {console.log(777, e)this.setData({startPoint: e.touches[0]})//获取拖动开始点},buttonMove: function (e) {console.log(666, e)let rpx = this.data.rpxvar endPoint = e.touches[e.touches.length - 1] //获取拖动结束点//计算在X轴上拖动的距离和在Y轴上拖动的距离var translateX = endPoint.clientX - this.data.startPoint.clientXvar translateY = endPoint.clientY - this.data.startPoint.clientYthis.setData({startPoint: endPoint}) //重置开始位置var buttonTop = this.data.buttonTop + translateY / rpxvar buttonLeft = this.data.buttonLeft + translateX / rpx//判断是移动否超出屏幕if (buttonLeft + 90 >= this.data.windowWidth) {buttonLeft = this.data.windowWidth - 90;}if (buttonLeft <= 0) {buttonLeft = 0;}if (buttonTop <= 0) {buttonTop = 0}if (buttonTop + 138 >= this.data.windowHeight) {buttonTop = this.data.windowHeight - 138;}