ダブルクリック・タップできるようにする
Akashic Engine に直接ダブルクリックを検出する機能はありません。 onPointDown
や onPointUp
などを組み合わせて実現する必要があります。 いわゆる「クリック」はマウスを離したタイミングで判定されますが、ここでは単純にマウスを押したタイミングで処理を行います。
実現コード
javascript
var rect = new g.FilledRect({
..., // その他のプロパティ
touchable: true // 触れられるオブジェクトにする
});
var isRightAfterClick = false; // クリックの直後か否か。
var doubleClickTimer = null;
rect.onPointDown.add(function () {
if (isRightAfterClick) {
isRightAfterClick = false;
// ダブルクリックされた
console.log("double clicked!");
} else {
// ダブルクリックではない
console.log("clicked!");
}
});
rect.onPointUp.add(function () {
isRightAfterClick = true;
doubleClickTimer = scene.setTimeout(function () {
isRightAfterClick = false;
doubleClickTimer = null;
}, 300);
});
次のコンテンツは、矩形をダブルクリック・ダブルタップした場合に矩形の色が変わります。
解説
この例では、 onPointUp
トリガーで isRightAfterClick
を true
に設定し、タイマーにて一定時間後に false
に戻しています。 onPointDown
トリガーでマウス押下・タップを検出した時、isRightAfterClick
が true
であれば、前回のクリックから一定時間以内なのでダブルクリックとして扱います。
タイマーの時間を変更することで、ダブルクリックとして認識する時間を調整できます。