6 タッチ・イベントの使用

タッチ・ポイント

ユーザーがタッチ画面にタッチすると、個々の接触ポイントでタッチ・ポイントが作成されます。タッチ・ポイントは、TouchPointクラスのインスタンスによって表され、接触ポイントの位置、状態およびターゲットに関する情報を持ちます。タッチ・ポイントの状態は、押下、移動、静止および解放です。

各タッチ・ポイントがタッチ・アクションに追加されるときに、それらのタッチ・ポイントに順番にIDが割り当てられます。タッチ・ポイントのIDは、タッチ画面に触れて放すまで同じままです。接触ポイントから指が放された時点で、関連付けられているタッチ・ポイントはタッチ・アクションの一部ではなくなります。たとえば、2本の指でタッチ画面にタッチした場合、1つ目のタッチ・ポイントにはID 1が割り当てられ、2つ目のタッチ・ポイントにはID 2が割り当てられます。2本目の指をタッチ画面から放した場合、タッチ・ポイント1のみがタッチ・アクションの一部として残ります。別の指をタッチ・アクションに追加した場合、新しいタッチ・ポイントにID 3が割り当てられ、タッチ・アクションはタッチ・ポイント1および3で構成されることになります。

タッチ・イベント

タッチ・ポイントのアクションを追跡するためにタッチ・イベントが生成されます。タッチ・イベントは、TouchEventクラスのインスタンスによって表されます。タッチ・イベントは、タッチ画面へのタッチによってのみ生成されます。タッチ・イベントはトラックパッドからは生成されません。

タッチ・イベントは、他のイベントと同様に、発生するアクションを詳細に定義するソース、ターゲットおよびイベント・タイプを持ちます。タッチ・イベントのタイプは、TOUCH_PRESSED、TOUCH_MOVED、TOUCH_STATIONARYおよびTOUCH_RELEASEDです。移動距離やタッチ・ポイントでの静止時間に応じて、タッチ・ポイントに対して複数のTOUCH_MOVEDイベントおよびTOUCH_STATIONARYイベントを生成できます。イベントおよびその処理方法の基本情報は、「イベントの処理」を参照してください。

タッチ・イベントには次の項目もあります。

• タッチ・ポイント

  該当するイベントに関連付けられているメイン・タッチ・ポイント

• タッチ・カウント

  タッチ・アクションに現在関連付けられているタッチ・ポイントの数

• タッチ・ポイントのリスト

  タッチ・アクションに現在関連付けられているタッチ・ポイントのセット

• イベント・セットID

  該当するイベントが含まれているイベント・セットのID

イベント・セット

タッチ・アクションに単一の接触ポイントが含まれる場合は、アクションの各状態において単一のタッチ・イベントが生成されます。タッチ・アクションに複数の接触ポイントが含まれる場合は、アクションの各状態においてタッチ・イベント・セットが生成されます。セット内の各タッチ・イベントは、それぞれ異なるタッチ・ポイントに関連付けられます。

各イベント・セットにはイベント・セットIDが割り当てられます。イベント・セットIDは、タッチ・アクションに対するレスポンスとしてセットが生成されるたびに1ずつ増分します。セット内の各イベントのイベント・タイプは、関連付けられているタッチ・ポイントの状態に応じてそれぞれ異なる場合があります。タッチ・アクションの実行中に接触ポイントが追加または削除された場合、イベント・セット内のイベントの数が変わります。例として、表6-1に、ユーザーが2本の指でタッチ画面にタッチし、両方の指を移動し、3本目の指でタッチ画面にタッチし、すべての指を移動し、最後に画面からすべての指を放す場合に生成されるイベント・セットを示します。

タッチ・ポイントのターゲットとタッチ・イベントのターゲット

タッチ・イベントのターゲットは、そのイベントに関連付けられているタッチ・ポイントのターゲットになります。タッチ・ポイントの初期ターゲットは、タッチ画面上の最初の接触ポイントにある最上位ノードです。タッチ・アクションに複数の接触ポイントが含まれる場合は、各タッチ・ポイントおよび各タッチ・イベントのターゲットがそれぞれ異なっていてもかまいません。この機能を使用すると、各タッチ・ポイントを他のタッチ・ポイントから切り離して処理できます。例は、「同時タッチ・ポイントの個別処理」を参照してください。

通常は、1つのタッチ・ポイントのすべてのイベントが同じターゲットに配信されます。ただし、タッチ・ポイントに対してgrab()およびungrab()メソッドを使用することによって、後続イベントのターゲットを変更できます。

grab()メソッドを使用すると、現在イベントを処理しているノード自体をタッチ・ポイントのターゲットにすることができます。grab(target)メソッドを使用すると、別のノードをタッチ・ポイントのターゲットにすることができます。イベント・セット内のイベントはそのセットのすべてのタッチ・ポイントにアクセスできるため、grab()メソッドを使用してタッチ・アクションの後続イベントをすべて同じノードに配信できます。また、「タッチ・ポイントのターゲットの変更」に示すように、grab()メソッドを使用してタッチ・ポイントのターゲットをリセットすることもできます。

ungrab()メソッドを使用すると、現在のターゲットからタッチ・ポイントを解放できます。タッチ・アクションの後続イベントは、タッチ・ポイントの現在の位置にある最上位ノードに送信されるようになります。

タッチにより生成されるその他のイベント

ユーザーがタッチ画面にタッチすると、タッチ・イベント以外に次のタイプのイベントが生成されます。

• マウス・イベント

  マウス・イベントがシミュレートされるため、アプリケーションがタッチ・イベントに対応していない場合でも、タッチ画面付きのデバイスでアプリケーションを実行できます。マウス・イベントがタッチ・アクションによるものかどうかを判別するには、isSynthesized()メソッドを使用します。例は、「マウス・イベントの処理」を参照してください。

• ジェスチャ・イベント

  ジェスチャ・イベントは、一般に認識されているタッチ・アクション(スクロール、スワイプ、回転およびズーム)に対して生成されます。これらのタイプのタッチ・アクションのみをアプリケーションで処理する場合は、タッチ・イベントではなく、ジェスチャ・イベントを処理できます。ジェスチャ・イベントの詳細は、「タッチ対応デバイスからのイベントの使用」を参照してください。

同時タッチ・ポイントの個別処理

一般的なジェスチャでは、すべての接触ポイントの中心にあるノードがターゲットになり、ジェスチャに対するレスポンスはその1つのノードのみに作用します。各タッチ・ポイントを個別に処理することによって、タッチされたすべてのノードを作用対象にすることができます。

タッチ・イベントの例では、フォルダにタッチして指を移動することによって各フォルダを移動できます。複数のフォルダをまとめて移動するには、各フォルダに別々の指でタッチし、すべての指を移動します。

各フォルダは、TouchImageクラスのインスタンスです。TouchImageクラスを使用して、イメージ・ビューを作成し、TOUCH_PRESSED、TOUCH_RELEASEDおよびTOUCH_MOVEDイベントに対するイベント・ハンドラを追加します。例6-1に、このクラスの定義を示します。

public static class TouchImage extends ImageView {
    private long touchId = -1;
    double touchx, touchy;

    public TouchImage(int x, int y, Image img) {
        super(img);
        setTranslateX(x);
        setTranslateY(y);
        setEffect(new DropShadow(8.0, 4.5, 6.5, Color.DARKSLATEGRAY));

        setOnTouchPressed(new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {
                if (touchId == -1) {
                    touchId = event.getTouchPoint().getId();
                    touchx = event.getTouchPoint().getSceneX() - getTranslateX();
                    touchy = event.getTouchPoint().getSceneY() - getTranslateY();
                }
                event.consume();
            }
        });

        setOnTouchReleased(new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {
                if (event.getTouchPoint().getId() == touchId) {
                    touchId = -1;
                }
                event.consume();
            }
        });

        setOnTouchMoved(new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {
                if (event.getTouchPoint().getId() == touchId) {
                    setTranslateX(event.getTouchPoint().getSceneX() - touchx);
                    setTranslateY(event.getTouchPoint().getSceneY() - touchy);
                }
                event.consume();
            }
        });
    }
}

フォルダにタッチすると、各接触ポイントにタッチ・ポイントが作成され、タッチ・イベントがそのフォルダに送信されます。フォルダ上に複数の接触ポイントが存在する場合でもフォルダからのレスポンスが1回のみになるように、タッチIDが使用されています。

TOUCH_PRESSEDイベントが渡された場合、タッチIDがチェックされ、今回のタッチがそのフォルダに対して初めて行われたものかどうかが確認されます。その場合、タッチIDがタッチ・ポイントのIDに設定され、タッチ・ポイントの位置が保存されます。

TOUCH_RELEASEDイベントが渡された場合、タッチIDがチェックされ、処理中のタッチ・ポイントと一致することが確認されます。その場合、タッチIDがリセットされ、処理が完了します。

TOUCH_MOVEDイベントが渡された場合、タッチIDがチェックされ、処理中のタッチ・ポイントと一致することが確認されます。その場合、フォルダが新しいタッチ・ポイントの位置に移動されます。タッチIDがタッチ・ポイントと一致しない場合は、フォルダ上に複数の接触ポイントが存在する可能性があります。同じフォルダが複数回移動されないように、イベントは無視されます。

タッチ・ポイントのターゲットの変更

タッチ・ポイントのターゲットになるノードは、通常、タッチ・アクション全体を通して同じになります。ただし、状況によっては、タッチ・アクションの実行中にタッチ・ポイントのターゲットを変更できます。

タッチ・イベントの例では、1本目の指で円にタッチし、2本目の指で四角形にタッチすることによって、四角形間で円を移動できます。移動後、2本目の指を円上に置いたまま、1本目の指を持ち上げて別の四角形にタッチすると、円が再び移動されます。このアクションは、2つ目のタッチ・ポイントのターゲットを変更した場合にのみ実行できます。

円は、Ballクラスのインスタンスです。Ballクラスを使用して、円を作成し、TOUCH_PRESSED、TOUCH_RELEASED、TOUCH_MOVEDおよびTOUCH_STATIONARYイベントに対するイベント・ハンドラを追加します。TOUCH_MOVEDおよびTOUCH_STATIONARYイベントにも同じハンドラを使用します。例6-2に、このクラスの定義を示します。

private static class Ball extends Circle {
    double touchx, touchy;

    public Ball(int x, int y) {
        super(35);

        RadialGradient gradient = new RadialGradient(0.8, -0.5, 0.5, 0.5, 1,
            true, CycleMethod.NO_CYCLE, new Stop [] {
                new Stop(0, Color.FIREBRICK),
                new Stop(1, Color.BLACK)
            });

        setFill(gradient);
        setTranslateX(x);
        setTranslateY(y);

        setOnTouchPressed(new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {
                if (event.getTouchCount() == 1) {
                    touchx = event.getTouchPoint().getSceneX() - getTranslateX();
                    touchy = event.getTouchPoint().getSceneY() - getTranslateY();
                    setEffect(new Lighting());
                }
                event.consume();
            }
        });

        setOnTouchReleased(new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {
                setEffect(null);
                event.consume();
            }
        });

        // Jump if the first finger touched the ball and is either
        // moving or still, and the second finger touches a rectangle
        EventHandler<TouchEvent> jumpHandler = new EventHandler<TouchEvent>() {
            @Override public void handle(TouchEvent event) {

                if (event.getTouchCount() != 2) {
                    // Ignore if this is not a two-finger touch
                    return;
                }

                TouchPoint main = event.getTouchPoint();
                TouchPoint other = event.getTouchPoints().get(1);

                if (other.getId() == main.getId()) {
                    // Ignore if the second finger is in the ball and
                    // the first finger is anywhere else
                    return;
                }

                if (other.getState() != TouchPoint.State.PRESSED ||
                    other.belongsTo(Ball.this) ||
                    !(other.getTarget() instanceof Rectangle) ){
                    // Jump only if the second finger was just 
                    // pressed in a rectangle
                    return;
                }

                // Jump now
                setTranslateX(other.getSceneX() - touchx);
                setTranslateY(other.getSceneY() - touchy);

                // Grab the destination touch point, which is now inside
                // the ball, so that jumping can continue without
                // releasing the finger
                other.grab();

                // The original touch point is no longer of interest so
                // call ungrab() to release the target
                main.ungrab();

                event.consume();
            }
        };

        setOnTouchStationary(jumpHandler);
        setOnTouchMoved(jumpHandler);
    }
}

TOUCH_PRESSEDイベントが渡された場合、タッチ・ポイントの数がチェックされ、タッチされているのがBallクラスのインスタンスのみであることが確認されます。その場合、タッチ・ポイントの位置が保存され、円が選択されていることを示すためにライティング効果が追加されます。

TOUCH_RELEASEDイベントが渡された場合、円がもう選択されていないことを示すためにライティング効果が削除されます。

TOUCH_MOVEDまたはTOUCH_STATIONARYイベントが渡された場合、移動に必要な次の条件がチェックされます。

• タッチ・カウントは2である必要があります。

  該当するイベントに関連付けられているタッチ・ポイントが移動の始点とみなされます。このイベントはタッチ・アクションのすべてのタッチ・ポイントにアクセスできます。タッチ・ポイント・セット内の2つ目のタッチ・ポイントが移動の終点とみなされます。

• 2つ目のタッチ・ポイントの状態はPRESSEDです。

  円は、2つ目の接触ポイントが作成された場合にのみ移動されます。2つ目のタッチ・ポイントの状態がそれ以外の場合は無視されます。

• 2つ目のタッチ・ポイントのターゲットは四角形です。

  円は、長方形間または長方形内でのみ移動できます。2つ目のタッチ・ポイントのターゲットがそれ以外の場合は、円は移動されません。

移動の条件を満たしている場合、円は2つ目のタッチ・ポイントの位置に移動されます。再び移動するには、1つ目の接触ポイントを解放し、円の移動先にする3つ目の位置にタッチします。ただし、1つ目の接触ポイントを解放すると、円をターゲットとしていたタッチ・ポイントがなくなり、円にタッチ・イベントが渡されなくなります。2回目の移動は、両方の指を持ち上げ、新しい移動を開始しないかぎり実行できません。

2本目の指を円上に置いたまま新しい位置にタッチすることによって2回目の移動を行うためには、grab()メソッドを使用して円を2つ目のタッチ・ポイントのターゲットにします。grabを実行すると、2つ目のタッチ・ポイントのイベントが四角形(元のターゲット)ではなく円に送信されるようになります。その後、円は、新しいタッチ・ポイントが作成されたときに再び移動されます。