0

enchant.jsで
touchで線を描くとそこの上をオブジェクトが移動する、
ということを実現したいです。

1本指でなら成功するのですが、
2本以上の指になるとすべて同じ線と認識され、
オブジェクトが異なる線を移動してしまい、うまくいかなくなります。

2本指以上は線を描写しないようにするのが一番早いかな、と思いましたが、
enchant.Event
配下にもそのようなイベントがなく、やり方がわかりません。
2本指以上を認識する方法について、どなたかわかる方がいれば教えてください。

コードは必要部分のみ抜粋しています。
宜しくお願いします。


enchant();

window.onload = function() {
    game = new Game(STAGE_WIDTH, STAGE_HEIGHT);
    game.fps = FRAME;
    game.preload(
        CHARA_0_IMG
    );
    game.rootScene.backgroundColor = "white";

    game.onload = function() {
        var scene = new GamePlayScene();

        // touch start
        game.rootScene.on('touchstart', function(e){
            drawFlg = true;
        });

        // touch move
        game.rootScene.on('touchmove', function(e){
            if (drawFlg === true) { // 描写できるとき
                createCircle(e.x, e.y);
            }
        });

        // touch end
        game.rootScene.on('touchend', function(e){
            drawFlg = false;
            // 描写数のメモ
            drawNo++;
        });
    }
    game.start();
}

// 円の描写
function createCircle(x, y) {
    var ball = new Sprite(10, 10);
    var texture = new Surface(10, 10);
    var context = texture.context;
    context.fillStyle = "green";
    context.strokeStyle = "green";

    context.lineWidth = 2;
    context.arc(5, 5, 4, 0, Math.PI * 2, false);
    context.fill();
    context.stroke();

    ball.image = texture;
    ball.moveBy(x, y);
    ball.destroy = false;

    game.rootScene.addChild(ball);

    if (!circleList[drawNo]) {
        circleList[drawNo] = [];
    }
    circleList[drawNo].push(ball);
    drawList[drawNo] = false;

    ball.addEventListener(Event.ENTER_FRAME, function() {
        if (ball.destroy === true) {
            game.rootScene.removeChild(ball);
        }
    });
}

1 件の回答 1

1

enchant.jsではマルチタッチを扱うメソッドが無いようです。
コチラの記事では、強引な方法でマルチタッチを実現しているようですが
そもそもの仕様が1本以上の指を同時に認識できないため、判定はほぼ不可能だと思われます。

プラグインも検索してみましたが、見つけられませんでした。

enchant.jsの枠組みを外れますが、hammer.jsとenchant.jsを組み合わせることで判定することはできるかもしれません。

hammer.jsでタッチされた指の数を取得するには、イベントリスナーのコールバックに渡ってくるeventデータのtouchesプロパティの要素数で確認できるようです。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。