How do I detect multitouch actions in a Windows 8

2019-05-07 03:46发布

站内问答 / C#
570 4 6

I am working on a metro app right now and I'm looking to enable multitouch. I've browsed around google, but I can't seem to find any API to support it. Can someone point me in the right direction to support multitouch actions in a Windows 8 Metro app?

4条回答
趁早两清
2楼-- · 2019-05-07 04:34

Try ManipulationDelta of any control...

you can find whether a touch is multitouch or not by detrmining the Scale property of any manipulation event args....

 private void AssetMap_ManipulationDelta_1(object sender, ManipulationDeltaRoutedEventArgs e)
        {

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

//indicates that it is multitouch

}

hope it will help you...

查看更多
0人赞 添加讨论(0) 举报
淡お忘
3楼-- · 2019-05-07 04:42

Take a look at this post Touch Input for IE10 and Metro style Apps

Sample script from post:

<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>
查看更多
0人赞 添加讨论(0) 举报
地球回转人心会变
4楼-- · 2019-05-07 04:44

What exactly are you trying to do? There are Touch, Pointer (an abstraction around touch/mouse/stylus), and Manipulation events on every UI element

查看更多
0人赞 添加讨论(0) 举报
时光不老，我们不散
5楼-- · 2019-05-07 04:45

In JavaScript you can use the event.pointerId to detected multiple touch inputs. This identifier gives every new input an id. When you want to get multiplie touches for a move with the finger, you can use the MSPointerMove Event and this id. I'am using jQuery, but the bind and unbind function won't work, because the event isn't attached. You have to use plain Javascript to get multitouch working:

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'});
      }
}

Following is a full example with a foreach to attach the event-handlers to more than one button. If you start this application you will get 4 squares that you can move around with multiple fingers.

<!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>

With this approch, you can use 4 Fingers at the same time.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)