{{test.rightWidthObserver(rightWidth)}}
{{test.leftWidthObserver(leftWidth)}}
var rightWidth = 0;
var leftWidth = 0;
var direction=0;
var time=0;
function rightWidthObserver(w){
rightWidth = -w;
console.log("rightWidthObserver",w);
}
function leftWidthObserver(w){
leftWidth = w;
}
// 拖动中时的事件
function lwmove(event, ins) {
//组件实例
var node = ins.selectComponent(".ceil");
console.log("rightWidthObserver",rightWidth);
// 获取拖动点的坐标数据
var touch = event.touches[0] || event.changedTouches[0]
//拿出拖动开始时存储的数据
var moveE = ins.getState();
direction = (touch.pageX - moveE.pageX );
moveE.pageX = touch.pageX;
console.log("向左还是向右",direction);
//计算拖动点与拖动开始时的触发点之间的横坐标之差
var gap = touch.pageX - moveE.startX + moveE.rX;
//获取左滑的距离（拖动中不存储这个数据，而是拖动结束来存储这个数据）
var left = moveE.rX;
//为向左滑动做处理，开始设置左滑的距离
if(gap>=leftWidth) gap = leftWidth;
if(gap<=rightWidth) gap = rightWidth;
// 设置组件向左滑的距离
node.setStyle({
"transform": "translateX(" + (gap ) + "px) rotate(0deg)"
})
// if (gap < 0) {
// // 设置组件向左滑的距离
// node.setStyle({
// "transform": "translateX(" + (gap + left) + "px)"
// })
// }
//console.log("拖动中", gap,left,(gap + left));
}
// 拖动结束时的事件
function lwend(event, ins) {
console.log("拖动结束");
//组件实例
var node = ins.selectComponent(".ceil");
// 获取离开点的坐标数据
var touch = event.touches[0] || event.changedTouches[0]
//拿出拖动开始时存储的数据
var moveE = ins.getState();
var x = touch.pageX;
//计算拖动点与拖动开始时的触发点之间的横坐标之差
var gap = x - moveE.startX+moveE.rX;
if(Math.abs(moveE.startY-touch.pageY) > Math.abs(gap) && Math.abs(gap)<20) {
node.setStyle({
"transform": "translateX("+moveE.rX+"px) rotate(0deg)"
})
return;
};
time = getDate().getTime()-time;
console.log("time",time);
if(gap>=leftWidth) gap = leftWidth;
if(gap<=rightWidth) gap = rightWidth;
console.log(gap,moveE.rX, "gggg");
if(direction>0){ //向右滑
if(gap<=leftWidth && gap>=0 && moveE.rX == 0){
gap = leftWidth;
}else if(gap<=leftWidth && gap>=0 && time>300){
gap = leftWidth;
} else if(moveE.rX == leftWidth){
gap = leftWidth;
}else {
gap = 0;
}
}else {//向左滑
if(gap>=rightWidth && gap<=0 && moveE.rX == 0){
gap=rightWidth;
}else if(gap>=rightWidth && gap<=0 && time>300){
gap=rightWidth;
}else if(moveE.rX == rightWidth){
gap=rightWidth;
}else{
gap = 0;
}
}
moveE.rX = gap;
node.setStyle({
"transform": "translateX("+gap+"px) rotate(0deg)"
})
// if (gap <= rightWidth) { // 左滑
// // 设置左滑最大距离
// node.setStyle({
// "transform": "translateX("+rightWidth+"px)"
// })
// // 存储左滑距离
// moveE.rX = rightWidth;
// } else if (gap >= leftWidth) {
// //右滑
// //设置左滑最小距离
// node.setStyle({
// "transform": "translateX("+leftWidth+"px)"
// })
// // 存储左滑距离
// moveE.rX = leftWidth;
// }
}
module.exports = {
touchStart:function(event, ins){
// 获取事件触发点的坐标数据
var touch = event.touches[0] || event.changedTouches[0]
//存储坐标数据，后期使用
var moveE = ins.getState();
moveE.startX = touch.pageX;
moveE.startY = touch.pageY;
direction=0;
time = getDate().getTime();
ins.callMethod("closePrevBox");
//默认左滑当前的距离，也要存储起来
if (!moveE.rX) {
moveE.rX = 0;
}
moveE.pageX = 0;
console.log('inss', ins.setStyle)
},
touchmove: lwmove,
touchEnd:lwend,
closePrevBox:function(newValue, oldValue, ownerInstance, instance){
var node = ownerInstance.selectComponent(".ceil");
node.setStyle({
"transform": "translateX(0px) rotate(0deg)"
})
},
rightWidthObserver:rightWidthObserver,
leftWidthObserver:leftWidthObserver
}