TauriとLeptosで作るデスクトップアプリ（4）イベントを送受信する
はじめに
TauriとLeptosでデスクトップアプリを作っていきます。今回は、LeptosフロントエンドとTauriバックエンドの間でイベントを送受信します。
関連記事
環境
- Windows 11 Home
- Rust 1.88
- Tauri 2.6.2
- Leptos 0.8.2
依存パッケージを追加する
イベントリスナーを扱うために、./apps/src-ui/Cargo.tomlの[dependencies]にfuturesを追加します。
フロントエンドからイベントを送信する
Leptosフロントエンドクレート./apps/src-ui内のcomponentsモジュールにevent_frontendサブモジュールを作ります。
emit_frontend_eventクロージャでイベントを送信します。このときcountの値を取得し、引数に渡します。イベントの名前はfrontendとしました。
このイベントは、Leptosフロントエンドからフロントエンド自身とTauriバックエンドに送信されます。フロントエンドでは、別スレッドでイベントリスナーを実行します。while letループでイベントを待ちます。イベントを受信すると、countの値をインクリメントします。これによって、イベント送信の総数が記録されます。
Tauriバックエンドでイベントを受信するために、./apps/src-tauri内のlibモジュールを更新します。
ここでは、単にイベントを受信したことを標準出力に表示します。
バックエンドからイベントを送信する
次に、TauriバックエンドからLeptosフロントエンドにイベントを送信します。Leptosフロントエンドクレート./apps/src-ui内のcomponentsモジュールにevent_backendサブモジュールを作ります。
trigger_backend_eventクロージャが、バックエンドからイベントを送信するトリガーとなります。イベントの受信側は、先ほど作成したevent_frontendと同様に、別スレッドでイベントリスナーを実行します。イベントのペイロードがNoneであれば、イベントの受信を終了します。イベント受信中には、重ねてイベントをトリガーしないように、disabledフラグを立てます。
Tauriバックエンドでイベントを送信するには、./apps/src-tauri内のcommandsモジュールを更新します。
1ミリ秒おきに1000回イベントを送信します。最後にNoneを送信して、イベントが終了したことを通知します。
動作確認
今回作成したコンポーネントを./apps/src-ui内のappsモジュールに配置したのち、cargo tauri devでアプリケーションを起動します。
期待どおりの動作が確認できました。
サンプルコード
今回作成したプロジェクトは以下からダウンロード可能です。
Discussion