Makepad イベント/アクション スキル

Version: makepad-widgets (dev branch) | Last Updated: 2026-01-19

アップデート確認: https://crates.io/crates/makepad-widgets

Makepad のイベントおよびアクション処理の専門家です。以下のことでユーザーをサポートします:

• イベント処理: マウス、キーボード、タッチ、ライフサイクルイベント
• アクション作成: ウィジェット間の親子通信
• イベントフロー: イベント伝播の理解

使用時期

• Makepad でインプット、ライフサイクル、または UI インタラクションイベントを処理する必要がある場合
• handle_event、Event 列挙体、Hit 処理、またはウィジェットアクション伝播が関わる場合
• Makepad のイベント/アクションフロー（ウィジェット間および親子間）を設計またはデバッグする必要がある場合

ドキュメント

詳細なドキュメントについては、ローカルファイルを参照してください:

• ./references/event-system.md - Event 列挙体と処理
• ./references/action-system.md - Action トレイトとパターン

重要: ドキュメント完全性チェック

質問に回答する前に、Claude は以下のことを実行する必要があります:

1. 上記にリストされた関連参照ファイルを読む
2. ファイル読み込みに失敗するか、ファイルが空の場合:
   • ユーザーに通知: 「本地文档不完整，建议运行 /sync-crate-skills makepad --force 更新文档」
   • SKILL.md のパターンと組み込み知識に基づいて回答を続ける
3. 参照ファイルが存在する場合、その内容を回答に組み込む

イベント列挙体 (主要な列挙値)

pub enum Event {
    // Lifecycle
    Startup,
    Shutdown,
    Foreground,
    Background,
    Resume,
    Pause,

    // Drawing
    Draw(DrawEvent),
    LiveEdit,

    // Window
    WindowGotFocus(WindowId),
    WindowLostFocus(WindowId),
    WindowGeomChange(WindowGeomChangeEvent),
    WindowClosed(WindowClosedEvent),

    // Mouse
    MouseDown(MouseDownEvent),
    MouseMove(MouseMoveEvent),
    MouseUp(MouseUpEvent),
    Scroll(ScrollEvent),

    // Touch
    TouchUpdate(TouchUpdateEvent),

    // Keyboard
    KeyDown(KeyEvent),
    KeyUp(KeyEvent),
    TextInput(TextInputEvent),
    TextCopy(TextClipboardEvent),

    // Timer
    Timer(TimerEvent),
    NextFrame(NextFrameEvent),

    // Network
    HttpResponse(HttpResponse),

    // Widget Actions
    Actions(ActionsBuf),
}

ウィジェット内でのイベント処理

impl Widget for MyWidget {
    fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
        // このウィジェットの領域にイベントが命中したかを確認
        match event.hits(cx, self.area()) {
            Hit::FingerDown(fe) => {
                // このウィジェット上でマウス/タッチダウン
                cx.action(MyWidgetAction::Pressed);
            }
            Hit::FingerUp(fe) => {
                if fe.is_over {
                    // ウィジェット上でリリース = クリック
                    cx.action(MyWidgetAction::Clicked);
                }
            }
            Hit::FingerHoverIn(_) => {
                self.animator_play(cx, id!(hover.on));
            }
            Hit::FingerHoverOut(_) => {
                self.animator_play(cx, id!(hover.off));
            }
            Hit::KeyDown(ke) => {
                if ke.key_code == KeyCode::Return {
                    cx.action(MyWidgetAction::Submitted);
                }
            }
            _ => {}
        }
    }
}

Hit 列挙体

pub enum Hit {
    // Finger/Mouse
    FingerDown(FingerDownEvent),
    FingerUp(FingerUpEvent),
    FingerMove(FingerMoveEvent),
    FingerHoverIn(FingerHoverEvent),
    FingerHoverOver(FingerHoverEvent),
    FingerHoverOut(FingerHoverEvent),
    FingerLongPress(FingerLongPressEvent),

    // Keyboard
    KeyDown(KeyEvent),
    KeyUp(KeyEvent),
    KeyFocus,
    KeyFocusLost,
    TextInput(TextInputEvent),
    TextCopy,

    // Nothing
    Nothing,
}

アクションシステム

アクションの定義

#[derive(Clone, Debug, DefaultNone)]
pub enum ButtonAction {
    None,
    Clicked,
    Pressed,
    Released,
}

// DefaultNone は None 列挙値を返す Default を自動実装

アクションの発行

// メインスレッドから (handle_event 内)
cx.action(ButtonAction::Clicked);

// 任意のスレッドから (スレッドセーフ)
Cx::post_action(MyAction::DataLoaded(data));

アクションの処理

fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
    // 子ウィジェットのアクションを処理
    let actions = cx.capture_actions(|cx| {
        self.button.handle_event(cx, event, scope);
    });

    // 特定のアクションをチェック
    if self.button(id!(my_button)).clicked(&actions) {
        // ボタンがクリックされた
    }

    // またはアクションを反復処理
    for action in actions.iter() {
        if let Some(ButtonAction::Clicked) = action.downcast_ref() {
            // クリックを処理
        }
    }
}

ウィジェットアクションヘルパー

// 一般的なウィジェットアクションチェック
impl ButtonRef {
    fn clicked(&self, actions: &ActionsBuf) -> bool;
    fn pressed(&self, actions: &ActionsBuf) -> bool;
    fn released(&self, actions: &ActionsBuf) -> bool;
}

impl TextInputRef {
    fn changed(&self, actions: &ActionsBuf) -> Option<String>;
    fn returned(&self, actions: &ActionsBuf) -> Option<String>;
}

イベントフロー

1. イベント到着: プラットフォームレイヤーから
2. ルートウィジェット: 最初にイベントを受信
3. 下方向に伝播: handle_event 経由で子に伝播
4. ウィジェットがアクションを発行: cx.action() 経由
5. 親がアクションをキャプチャ: cx.capture_actions() 経由
6. アプリが処理: 残りのアクションを処理

タイマーと NextFrame

// タイマーを開始
let timer = cx.start_timer(1.0); // 1 秒

// handle_event 内
if let Event::Timer(te) = event {
    if te.timer_id == self.timer {
        // タイマーが発火
    }
}

// 次フレームコールバックをリクエスト
let next_frame = cx.new_next_frame();

// handle_event 内
if let Event::NextFrame(ne) = event {
    if ne.frame_id == self.next_frame {
        // 次フレームが到着
    }
}

質問に答える際に

1. event.hits(cx, area) を使用してイベントがウィジェットをターゲットにしているかを確認する
2. アクションは子から親への方向に流れる (イベントは逆に下方向に流れる)
3. cx.capture_actions() を使用して子アクションをインターセプトする
4. Cx::post_action() は非同期操作でスレッドセーフ
5. DefaultNone の derive マクロは列挙体の Default を自動実装