提交 48b2e0a3 authored 作者: gzcnkilys_admin's avatar gzcnkilys_admin

1、增加移动端滑动翻页,只判断方向。

上级 13c6cf7b
...@@ -1299,22 +1299,22 @@ ...@@ -1299,22 +1299,22 @@
var isLeftPage = data.opts.page % 2 === 0; var isLeftPage = data.opts.page % 2 === 0;
if (isLeftPage) { if (isLeftPage) {
// 左页:只能向右滑动 // 左页
virtualCorner = (point.y < height / 2) ? 'tr' : 'br';
} else {
// 右页:只能向左滑动
virtualCorner = (point.y < height / 2) ? 'tl' : 'bl'; virtualCorner = (point.y < height / 2) ? 'tl' : 'bl';
} else {
// 右页
virtualCorner = (point.y < height / 2) ? 'tr' : 'br';
} }
} else { } else {
// 单页模式:左半区只能左滑,右半区只能右滑 // 单页模式
var centerX = width / 2; var centerX = width / 2;
var centerY = height / 2; var centerY = height / 2;
if (point.x < centerX) { if (point.x < centerX) {
// 左半区:只能向左翻页 // 左半区
virtualCorner = (point.y < centerY) ? 'tl' : 'bl'; virtualCorner = (point.y < centerY) ? 'tl' : 'bl';
} else { } else {
// 右半区:只能向右翻页 // 右半区
virtualCorner = (point.y < centerY) ? 'tr' : 'br'; virtualCorner = (point.y < centerY) ? 'tr' : 'br';
} }
} }
...@@ -1333,7 +1333,7 @@ ...@@ -1333,7 +1333,7 @@
// 添加区域信息,用于判断是否应该显示折叠页动画 // 添加区域信息,用于判断是否应该显示折叠页动画
dragArea: turnData && turnData.display === 'double' ? dragArea: turnData && turnData.display === 'double' ?
(data.opts.page % 2 === 0 ? 'leftPage' : 'rightPage') : (data.opts.page % 2 === 0 ? 'leftPage' : 'rightPage') :
(point.x < width / 2 ? 'leftHalf' : 'rightHalf') (point.x < width / 2 ? 'left' : 'right')
}; };
} }
...@@ -1352,6 +1352,7 @@ ...@@ -1352,6 +1352,7 @@
x: virtualPoint.x, x: virtualPoint.x,
y: virtualPoint.y, y: virtualPoint.y,
isVirtual: true, isVirtual: true,
dragArea: virtualPoint.dragArea,
originalPoint: virtualPoint.originalPoint, originalPoint: virtualPoint.originalPoint,
realCorner: realCorner, realCorner: realCorner,
dragStartX: virtualPoint.dragStartX, dragStartX: virtualPoint.dragStartX,
...@@ -1732,7 +1733,6 @@ ...@@ -1732,7 +1733,6 @@
_moveFoldingPage: function (bool) { _moveFoldingPage: function (bool) {
console.log('_moveFoldingPage', bool);
var data = this.data().f, var data = this.data().f,
folding = flipMethods._foldingPage.call(this); folding = flipMethods._foldingPage.call(this);
...@@ -1758,6 +1758,7 @@ ...@@ -1758,6 +1758,7 @@
dd = this.data(), dd = this.data(),
data = dd.f; data = dd.f;
console.log('data', data);
if (!data.point || data.point.corner != c.corner) { if (!data.point || data.point.corner != c.corner) {
var event = $.Event('start'); var event = $.Event('start');
this.trigger(event, [data.opts, c.corner]); this.trigger(event, [data.opts, c.corner]);
...@@ -1934,42 +1935,52 @@ ...@@ -1934,42 +1935,52 @@
e = (isTouch) ? e.originalEvent.touches : [e]; e = (isTouch) ? e.originalEvent.touches : [e];
if (data.corner) { if (data.corner) {
var pos = data.parent.offset(); let pos = data.parent.offset();
var currentMouseX = e[0].pageX - pos.left; let currentMouseX = e[0].pageX - pos.left;
var currentMouseY = e[0].pageY - pos.top; let currentMouseY = e[0].pageY - pos.top;
// 检查是否是虚拟corner(非corner区域拖拽) // 检查是否是虚拟corner(非corner区域拖拽)
if (data.corner.isVirtual) { if (data.corner.isVirtual) {
// 计算拖动距离 // 计算拖动距离,提高效率,只使用
var dragDistance = Math.sqrt( let dragDistance = Math.abs(currentMouseX - data.corner.dragStartX);
Math.pow(currentMouseX - data.corner.dragStartX, 2) +
Math.pow(currentMouseY - data.corner.dragStartY, 2)
);
// 最小拖动距离阈值 // 最小拖动距离阈值
var minDragDistance = data.opts.minDragDistance || 30; let minDragDistance = data.opts.minDragDistance || 30;
if (dragDistance < minDragDistance) { if (dragDistance < minDragDistance) {
// 拖动距离太小,不执行翻页效果 // 拖动距离太小,不执行翻页效果
return; return;
}
else {
// 单页特殊处理
if (data.opts.display === 'single') {
// 判断滑动方向,判断在左右半区,同向滑动直接翻页不播放翻页特效。
console.log('currentMouseX', currentMouseX);
let direction = currentMouseX - data.corner.dragStartX > 0 ? 'right' : 'left';
// 方向
if(direction === data.corner.dragArea)
{
if (direction === 'right') {
// 向右翻页
// 设置翻页从左下角开始
data.corner.corner = 'bl';
this.turn('next');
} else {
// 向左翻页
// 设置翻页从右下角开始
data.corner.corner = 'br';
this.turn('previous');
}
// 清理操作
data.corner.isVirtual = false;
data.corner.dragStartX = 0;
data.corner.dragStartY = 0;
return;
}
}
} }
// todo解决单页翻页的问题
// else {
// // 单页特殊处理
// if (data.opts.display === 'single') {
// // 判断滑动方向,判断在左右半区,同向滑动直接翻页不播放翻页特效。
// if (currentMouseX - data.corner.dragStartX > 0) {
// // 向右滑动
// turnMethods.next();
// } else {
// // 向左滑动
// turnMethods.previous();
// }
// }
// return;
// }
// 根据拖动轨迹计算真实的折叠点 // 根据拖动轨迹计算真实的折叠点
var foldPoint = flipMethods._calculateNonCornerFoldPoint.call(this, var foldPoint = flipMethods._calculateNonCornerFoldPoint.call(this,
data.corner.corner, currentMouseX - data.corner.dragStartX, currentMouseY - data.corner.dragStartY, data.corner.corner, currentMouseX - data.corner.dragStartX, currentMouseY - data.corner.dragStartY,
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论