如何檢測Windows 8 metro應用程序中的多點觸控操作？

我現在正在開發一款地鐵應用程序，並且正在尋求啓用多點觸控。我瀏覽過谷歌，但我似乎無法找到任何API來支持它。有人能指出我在正確的方向支持Windows 8 Metro應用程序中的多點觸控操作嗎？如何檢測Windows 8 metro應用程序中的多點觸控操作？

來源

2011-12-29 jjcm

你究竟想要做什麼？有觸摸，指針（約觸摸/鼠標/筆的抽象）和操作事件的每個UI元素

來源

2011-12-30 13:03:06

看看這個帖子從後Touch Input for IE10 and Metro style Apps

示例腳本：

<script> 
function handleEvent(event) { 
    var currentPointers = event.getPointerList(); 
    if (currentPointers.length == 1) { 
     event.target.style.backgroundColor = "red"; 
     } else { 
     event.target.style.backgroundColor = "green"; //multiple touch points are used 
     } 
    } 
document.getElementById("foo").addEventListener("MSPointerMove", handleEvent, false); 
</script>

來源

2012-01-17 14:14:01

你試過嗎？ getPointerList似乎不是事件有效負載的一部分...：\ – 2012-05-31 01:32:09

RTM中不再支持 – Aerilys 2012-08-29 09:05:31

在JavaScript中，您可以使用event.pointerId來檢測多個觸摸輸入。該標識符爲每個新輸入提供一個id。當您想用手指移動多重觸碰時，可以使用MSPointerMove事件和此ID。我使用jQuery，但綁定和解除綁定功能將不起作用，因爲事件未附加。你必須使用普通的JavaScript來獲得多點觸控工作：

var pointerId=0; 
//add a Eventlistner to the Down Event (compareable to mousedown and touchstart) 
$('#button1')[0].addEventListener("MSPointerDown",function(event) { 
     pointerId=event.pointerId; //save the pointerId to a (in this case) global var 
     window.addEventListener("MSPointerMove", moveHandler, false); 
     //The handlers should also be removed on MSPointerUp. 
     //You can't use jQuery unbind for this, it dosn't work. 
     //use window.removeListener("MSPointerMove",moveHandler); 
},false); 

//define the moveHandler and check the pointer ID 
var moveHandler = function(event) { 
     if(pointerId==event.pointerId) { 
      //If the pointerId is the same, the moving comes from one finger 
      //For example we can move the button with the finger 
      $("#button1").css({'top':event.pageY,'left':event.pageX,'position':'absolute'}); 
     } 
}

以下是一個foreach的事件處理程序連接到不止一個按鈕，一個完整的例子。如果你啓動這個應用程序，你會得到4個方格，你可以用多個手指移動。

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>App1</title> 

    <!-- WinJS references --> 
    <link href="//Microsoft.WinJS.1.0.RC/css/ui-dark.css" rel="stylesheet" /> 
    <script src="//Microsoft.WinJS.1.0.RC/js/base.js"></script> 
    <script src="//Microsoft.WinJS.1.0.RC/js/ui.js"></script> 

    <!-- App1 references --> 
    <link href="/css/default.css" rel="stylesheet" /> 
    <script src="/js/default.js"></script> 
    <script src="js/jquery.js"></script> 
    <script> 
     function start() { 
      //add a Eventlistner to the Down Event (compareable to mousedown and touchstart) 
      $(".button").each(function (i, element) { 
       var pointerId = 0; 
       $(element)[0].addEventListener("MSPointerDown", function (event) { 
        pointerId = event.pointerId; //save the pointerId to a (in this case) global var 
        window.addEventListener("MSPointerMove", moveHandler, false); 
       }, false); 

       //PointerUp handler 
       window.addEventListener("MSPointerUp", upHandler, false); 

       //define the moveHandler and check the pointer ID 
       var moveHandler = function (event) { 
        if (pointerId == event.pointerId) { 
         $(element).css({ "top": event.pageY-50, "left":event.pageX-50 }); 
        } 
       } 

       //remove the moveHandler on PointerUp 
       var upHandler = function (event) { 
        if (pointerId == event.pointerId) { 
         window.removeListener("MSPointerMove", moveHandler); 
        } 
       } 
      }); 
     } 
    </script> 
</head> 
<body> 
    <div class="button" style="width:100px;height:100px;background-color:#F80;position:absolute;"></div> 
    <div class="button" style="width:100px;height:100px;background-color:#08F;position:absolute;"></div> 
    <div class="button" style="width:100px;height:100px;background-color:#fff;position:absolute;"></div> 
    <div class="button" style="width:100px;height:100px;background-color:#4cff00;position:absolute;"></div> 
</body> 
</html>

有了這個接近，你可以同時使用4個手指。

來源

2012-06-24 11:16:46

嘗試在ManipulationDelta任何控制的......

你可以找到一個觸摸是否是detrmining任何操作事件參數的Scale屬性多點觸控與否....

private void AssetMap_ManipulationDelta_1(object sender, ManipulationDeltaRoutedEventArgs e) 
     { 

      if (e.Cumulative.Scale != 1) 
      { 

//indicates that it is multitouch 

}

希望它會幫助你...

來源

2012-08-28 10:49:18 kakun06

如何檢測Windows 8 metro應用程序中的多點觸控操作？

回答

相關問題