var nativeView = new plus.nativeObj.View('testNview', {
top: '300px',
left: (sreenWidth - 40) + 'px',
width: '40px',
height: '80px'
});
nativeView.addEventListener("click", function(e) {
var clientX = e.clientX;
var clientY = e.clientY;
var target = e.target;
if (0 < e.clientY && e.clientY <= 40) {
mui.alert('点击按钮1');
} else {
mui.toast('点击按钮2');
}
});
nativeView.addEventListener("touchstart", function(event) {
flag = true;
var touch;
if (event.touches) {
touch = event.touches[0];
} else {
touch = event;
}
cur.x = touch.clientX;
cur.y = touch.clientY;
});
nativeView.addEventListener("touchmove", function(event) {
if (flag) {
var touch;
if (event.touches) {
touch = event.touches[0];
} else {
touch = event;
}
moveX = touch.pageX - cur.x;
moveY = touch.pageY - cur.y;
x = moveX;
y = moveY;
if (x < 0) {
x = 0;
} else if (x > (boxWidth - modelWidth)) {
x = sreenWidth - 40;
}
if (y < 0) {
y = 0;
} else if (y > (boxHeight - modelHeight)) {
y = (boxHeight - modelHeight);
}
nativeView.setStyle({
top: y + 'px',
left: x + 'px'
});
// 原本是touchend里的内容,判断离那边近停靠哪边
setTimeout(function(){
var pointX = x + modelWidth / 2;
var pointY = y + modelHeight / 2;
if (pointX < boxWidth / 2) {
x = 0;
} else {
x = sreenWidth - 40;
}
nativeView.setStyle({
top: y + 'px',
left: x + 'px'
});
},1000);
}
});
nativeView.addEventListener("touchend", function(event) {
console.log('执行touchend。');
// 判断离那边近停靠哪边
var pointX = x + modelWidth / 2;
var pointY = y + modelHeight / 2;
if (pointX < boxWidth / 2) {
x = 0;
}else{
x = sreenWidth - 40;
}
nativeView.setStyle({
top: y + 'px',
left: x + 'px'
});
},true);
- 发布:2020-09-08 13:57
- 更新:2020-09-08 13:57
- 阅读:984
产品分类: HTML5+
HBuilderX版本号: 2.8.11
手机系统: Android
手机系统版本号: Android 5.1
手机厂商: 模拟器
手机机型: 夜神
打包方式: 云端
示例代码:
操作步骤:
运行代码
运行代码
预期结果:
拖拽View,拖拽结束后判断中心位置选择停靠屏幕左侧或右侧
拖拽View,拖拽结束后判断中心位置选择停靠屏幕左侧或右侧
实际结果:
touchend无法接收监听响应;
touchend存在时click监听无法接收到响应。
touchend无法接收监听响应;
touchend存在时click监听无法接收到响应。
bug描述:
使用plus.nativeObj.View创建的View,通过监听实现可拖动悬浮菜单。
click事件不能与touchend同时使用,并且touchend经常不响应监听事件。
0 个回复