Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

The "touchmove" event on android system: Transformer Prime

I am working on a Transformer Pad and developing a drawing plate. I use PhoneGap(javascript) to write the code instead of JAVA.

But the touchmove event is quite weird.

I think as I move my finger on the pad, it will continuously to collect the coordinates which I touch on the canvas. BUT IT DOES NOT! It's ridiculous, it only collect "1" coordinate: the first point on the canvas my finger moves to.

Here are my code about the "Touch && Move event":

function touchStart(event){
    if (event.targetTouches.length == 1) {
    var touch = event.targetTouches[0];     

        if (event.type == "touchstart") {
            line_start_x= touch.pageX-  canvas_org_x;
            line_start_y= touch.pageY-  canvas_org_y;
            context.beginPath();                        
            context.moveTo(line_start_x, line_start_y); 

        }//if           
    }//if 1
}//function.

function Touch_Move(event){
    line_end_x= event.touches[0].pageX-  canvas_org_x;
                line_end_y= event.touches[0].pageY-  canvas_org_y;
                context.lineTo(line_end_x, line_end_y);
                context.stroke();
                test++;                 
}

I don't know why each time I move my finger on the pad, trying to draw a line, curve, or anything I want. As the finger moves, only a VERY SHORT segment appears. So I declare a variable:"var test=0" in the beginning of this js file. I found that although I move my finger on the pad without leaving it or stopping, the value of "test" remains 1. It means that I move my finger on it. But it doesn't continuously to trigger the event: "Touch_Move".

What can I do now? I need a corresponding event to "mousemove" on touch pad. At least, the event has to continuously be triggered.

                                                                   Thank you!
like image 610
Alston Avatar asked Jun 26 '12 09:06

Alston


1 Answers

Oh, Jesus. I finally find the answers: Please take reference for this site.

If you work on an Android System,remember the 'touchmove' only fire ONCE as your finger moves around the pad. So if you wanna draw a line or something, you have to do this:

function onStart ( touchEvent ) {
if( navigator.userAgent.match(/Android/i) ) {   // if you already work on Android system, you can        skip this step
touchEvent.preventDefault();     //THIS IS THE KEY. You can read the difficult doc released by W3C to learn more.
}

And if you have more time, you can read the W3C's document about introducing the 'movetouch', it is REALLY hard to understand. The doc sucks.

like image 76
Alston Avatar answered Sep 28 '22 10:09

Alston