※この翻訳ドキュメントはスクリプトによって出力・同期されています。内容が怪しそうな場合はGitHubにissueを追加したり英語の原文の確認をお願いします。

Event クラスの prevent_default と stop_propagation のインターフェイス¶

このページではEventクラスのprevent_defaultとstop_propagationメソッドの各インターフェイスについて説明します。

各インターフェイスの概要¶

prevent_defaultメソッドのインターフェイスはJavaScriptのpreventDefaultメソッドに該当するコード表現を加えます。このインターフェイスはイベントにおけるブラウザのデフォルトの挙動を無効化します。

stop_propagationメソッドのインターフェイスはイベントの伝搬を停止します。例えば、このインスタンス上で実行（発火）されたイベントは親のインスタンスへは伝搬しなくなります（親のイベントは無視されるようになります）。

prevent_default インターフェイスの基本的な使い方¶

Eventのサブクラスのインスタンスはprevent_defaultメソッドを持っています（注: このインターフェイスを持っていないサブクラスも存在します）。prevent_defaultメソッドは特に引数を必要としません。

import apysc as ap


def on_click(e: ap.MouseEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the rectangle calls when clicked.

    Parameters
    ----------
    e : ap.MouseEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    e.prevent_default()


ap.Stage(
    stage_width=150,
    stage_height=150,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()
sprite.graphics.begin_fill(color=ap.Color("#0af"))
rectangle: ap.Rectangle = sprite.graphics.draw_rect(x=50, y=50, width=50, height=50)
rectangle.click(on_click)

ap.save_overall_html(dest_dir_path="event_prevent_default_basic_usage/")

stop_propagation インターフェイスの基本的な使い方¶

Eventのサブクラスのインスタンスはstop_propagationメソッドを持っています（注: このメソッドを持っていないサブクラスも存在します）。stop_propagationメソッドはprevent_defaultメソッドと同様に引数を必要としません。

以下のコード例ではクリックイベントをSpriteの親のインスタンスと四角の子のインスタンスにそれぞれ設定しています。四角の子のインスタンスのクリックのハンドラではstop_propagationメソッドを読んでいるため、親のSpriteのハンドラは呼ばれません（イベントが伝搬しません）。

import apysc as ap


def on_rectangle_click(e: ap.MouseEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the rectangle calls when clicked.

    Parameters
    ----------
    e : ap.MouseEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    e.stop_propagation()
    ap.trace("The rectangle is clicked!")


def on_sprite_click(e: ap.MouseEvent[ap.Sprite], options: dict) -> None:
    """
    The handler that the sprite calls when clicked.

    Parameters
    ----------
    e : ap.MouseEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    ap.trace("The sprite is clicked!")


ap.Stage(
    stage_width=150,
    stage_height=150,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()
sprite.click(on_sprite_click)
sprite.graphics.begin_fill(color=ap.Color("#0af"))
rectangle: ap.Rectangle = sprite.graphics.draw_rect(x=50, y=50, width=50, height=50)
rectangle.click(on_rectangle_click)

ap.save_overall_html(dest_dir_path="event_stop_propagation_basic_usage/")

もし以下の四角をクリックした場合、ブラウザのコンソールにはThe rectangle is clicked!というメッセージのみが表示され、Sprite関係のメッセージは表示されません。

prevent_default API¶

特記事項: このAPIドキュメントはドキュメントビルド用のスクリプトによって自動で生成・同期されています。そのためもしかしたらこの節の内容は前節までの内容と重複している場合があります。

[インターフェイスの構造] prevent_default(self) -> None

[インターフェイス概要]

イベントのデフォルトの挙動を無効化します。

[コードサンプル]

>>> import apysc as ap
>>> def on_click(e: ap.MouseEvent[ap.Rectangle], options: dict) -> None:
...     e.prevent_default()
...     rectangle: ap.Rectangle = e.this
...     rectangle.fill_color = ap.Color("#f0a")
...     rectangle.unbind_mouseup_all()
>>> stage: ap.Stage = ap.Stage()
>>> sprite: ap.Sprite = ap.Sprite()
>>> sprite.graphics.begin_fill(color=ap.Color("#0af"))
>>> rectangle: ap.Rectangle = sprite.graphics.draw_rect(
...     x=50, y=50, width=50, height=50
... )
>>> _ = rectangle.click(on_click)

stop_propagation API¶

特記事項: このAPIドキュメントはドキュメントビルド用のスクリプトによって自動で生成・同期されています。そのためもしかしたらこの節の内容は前節までの内容と重複している場合があります。

[インターフェイスの構造] stop_propagation(self) -> None

[インターフェイス概要]

イベントの伝搬を停止させます。