📌  相关文章
📜  在PhoneGap中滑动和平移

📅  最后修改于: 2021-01-07 10:41:55             🧑  作者: Mango

在PhoneGap中滑动和平移

在前面的手势部分中，我们了解了锤子库，点击，触摸以及如何在PhoneGap中检测手势。在本节中，我们将学习滑动和平移手势。我们将仔细研究这些手势的工作方式。我们将使用我们之前的示例，并在其中进行一些更改以用于点击和触摸手势。以下是用于开发点击和触摸手势应用程序的以下步骤：

1)创建index2.html

我们将使用与index.html中预设的代码相同的代码创建一个新文件index3.html 。我们稍后将在index3.html文件而不是index.html中进行更改。


2)获取手势div

现在，我们将使用id获得手势div并创建Hammer对象。我们将获得手势元素，并使用

3)找出事件的类型

当我们向左或向右滑动屏幕时，将调用匿名函数。此函数将返回事件，然后将事件类型存储到变量中。之后，我们将通过以下方式将此变量设置为结果div：

var out = ev.type + "
";
document.getElementById('resultDiv').innerHTML = out;

4)更多信息

我们有很多信息，而不仅仅是手势的类型。我们可以通过以下方式添加手势中移动的距离：

out += "Distance: " + ev.distance + "
";

我们还可以获取滑动角度。下面提到的代码行告诉我们滑动发生在什么角度。

out += "Angle: " + ev.angle + "
";

我们还可以得到增量x和增量y。增量x和增量y分别是沿x轴和y轴移动的距离。

out += "DeltaX: " + ev.deltaX + "
";
out += "DeltaY: " + ev.deltaY + "
";

完整的代码



    
        
        
        
        
        
         Gesture Example