2

我的代码在手指滑动手势上运行良好，即如果我滑动手指，它会触发事件并调用 nextMonth() 函数。现在有什么方法可以检查我是否向上和向下滑动，以便我可以在两个不同的手势上调用两种不同的方法。

            var myGesture = new MSGesture();
            var v = this.element.querySelector(".bartouch");
            myGesture.target = v;
            v.addEventListener("MSGestureEnd", handleListner,false);
            v.addEventListener("MSPointerDown", handleListner, false);

        function handleListner(evt) {
            if (evt.type == "MSPointerDown")   
                {
                myGesture.addPointer(evt.pointerId);
                return;
            }
        that.nextMonth();
        }
4

2 回答 2

1

你有两个选择：

  1. 使用MSGesture, 和处理MSGestureStart, MSGestureChange, 和MSGestureEnd事件来计算用户手指（或手指）的平移，并查看它们是否在正确的方向上。MSGestureChange由包含translateX&属性返回的事件对象translateY告诉您用户手指移动了多远。这里有一个详细的示例。

  2. 使用Windows.UI.Input.GestureRecognizer并使用手势对象上的手势设置，将手势设置为具体的 X 平移或 Y 平移。Ball 8 示例显示了如何执行此操作。它主要涉及创建 GestureRecognizer 类，并通过处理MSPointer[Down|Move|Up|Cancel]要查看交互的 DIV 上的 DOM 事件来为其提供事件，并通过其process[Down|Move|Up]Event处理程序将它们传递给您的（共享）识别器实例。

就个人而言，我建议使用 2 而不是 1——虽然设置起来更困难，但您最终会让用户在滑动、轻弹等方面拥有一致的手势体验，而不必像您一样手动调整手势如果您选择方法1。

于 2012-09-20T16:25:03.993 回答
0

我已经在我的一个游戏中成功地使用了 HammerJS来处理各个方向的手势。

这是我处理所有四个方向所需的所有代码：

var hammerOptions = { swipeVelocityX: 0.1, swipeVelocityY: 0.1 };
Hammer(contentContainer, hammerOptions).on("swipeleft", function(event) { moveBlocksLeft(); });
Hammer(contentContainer, hammerOptions).on("swiperight", function(event) { moveBlocksRight(); });
Hammer(contentContainer, hammerOptions).on("swipeup", function(event) { moveBlocksUp(); });
Hammer(contentContainer, hammerOptions).on("swipedown", function(event) { moveBlocksDown(); });

包含内容的div在哪里contentContainer，每个方向都有进一步处理手势的功能。

于 2014-06-23T14:10:23.563 回答