1

(iOS / Windows phone ではテストされていません)

モバイル用の HTML5 ゲームを作成していて、ユーザーのタッチ入力をジョイスティック/コントローラーとして使用したいのですが、そこで見つけたすべての touchmove スクリプトは、長時間の touchmove の後に壊れているようです。私はこれを Android デバイスでのみ適切にテストしましたが、いくつかの異なるブラウザーを試しましたが、結果は同じです。私は知ってe.preventdefaultおりwidth=device-width、両方を使用していますが、このバグは依然として発生します。私が使用しているコードは次のとおりです。

function initInput()
    {
        canvas = document.getElementById("Canvas");

        canvas.addEventListener("mousedown",mouseDown, false);
        canvas.addEventListener("mouseup", mouseUp, false);        
        canvas.addEventListener("mousemove",mouseXY, false);

        canvas.addEventListener("touchstart", touchDown, false);
        canvas.addEventListener("touchend", touchUp, false);
        canvas.addEventListener("touchcancel", touchUp, false);
        canvas.addEventListener("touchleave", touchUp, false);
        canvas.addEventListener("touchmove", touchXY, false);

    }       

    function mouseUp(e)
    {
        e.preventDefault();
        mouseIsDown = 0;
    }

    function touchUp(e)
    {
        e.preventDefault();
        mouseIsDown = 0;
    }

    function mouseDown(e)
    {
        e.preventDefault();
        mouseIsDown = 1;
        touchInitX = e.pageX - canvas.offsetLeft;
        touchInitY = e.pageY - canvas.offsetTop;
    }

    function touchDown(e)
    {
        e.preventDefault();
        mouseIsDown = 1;
        var touch = e.targetTouches[0];

        if (e.touches)
        {
            if (e.touches.length == 1)
            {
                touchInitX =  touch.pageX - touch.target.offsetLeft;
                touchInitY =  touch.pageY - touch.target.offsetTop;
            }   
        }
    }

    function mouseXY(e)
    {
            e.preventDefault();
            canvasX = e.pageX - canvas.offsetLeft;
            canvasY = e.pageY - canvas.offsetTop;
    }

    function touchXY(e) {
        e.preventDefault();
        var touch = e.targetTouches[0];

        if (e.touches) {
            if (e.touches.length == 1)
            {
                canvasX = touch.pageX - canvas.offsetLeft;
                canvasY = touch.pageY - canvas.offsetTop;
            }
        }
    }

そして、この動作の発生をテストできるいくつかの例を次に示します。

http://jsfiddle.net/B5wgb/8/

http://www.onlywebpro.com/demo/gamedev/mouse_detect.html

これらは私がウェブ上で見つけたさまざまなアプローチ/スクリプトであり、これまでのところ、私が見つけたすべての touchmove コード例は、適切に機能していないようです。Android デバイスで連続ドラッグをシミュレートすると、ある時点で touchmove が中断され、touchend に続いて touchstart が返され、指を離して touchmove を停止するまで続きます。これには 1 秒から数分かかることがありますが、touchmove は必ずどこかで中断します。

任意の提案/解決策をいただければ幸いです。

4

1 に答える 1

0

これは、一般的なハードウェア?/ソフトウェア? タッチ入力がバグる、Sony Xperia Z シリーズの問題。

于 2015-05-28T21:02:31.230 に答える