ウィンドウのレシピ
サイズ・位置・タイトルの変更、最大化・最小化・フルスクリーン、透明ウィンドウやフレームレスウィンドウ、サブウィンドウの作成、マルチモニター対応など、ウィンドウの見た目と振る舞いを制御するレシピです。
全 27 件 / 対象: Tauri 2.x
- 1 ウィンドウのサイズを変更する setSize()(権限 core:window:allow-set-size)と Rust の set_size() でサイズを変える。innerSize() が物理ピクセルで返る落とし穴と、表示前に決めてチラつきを防ぐ手順も示す。
- 2 ウィンドウのタイトルを動的に変える setTitle()(権限 core:window:allow-set-title)と Rust の set_title() でファイル名や未保存マークをタイトルに出す。document.title が自動反映されない点と同期方法も示す。
- 3 ウィンドウを最大化・最小化する toggleMaximize・minimize で最大化・最小化し、isMaximized で状態を取得する。toggle 専用の権限、onResized での状態同期、自作タイトルバーのボタン、Rust での検知も扱う。
- 4 アプリをフルスクリーンで表示する setFullscreen と core:window:allow-set-fullscreen で全画面を切り替える。F11・Esc での解除、onResized での状態同期、外部モニター表示、macOS の Space の扱いも。
- 5 ウィンドウの位置を指定する(起動時の初期位置・実行中の移動) 起動時の位置は tauri.conf.json の x / y、実行中は setPosition()(権限 core:window:allow-set-position)で指定する。外枠と内側の座標の違いと、画面外に出たときの戻し方も示す。
- 6 ウィンドウをドラッグ移動できる領域を作る data-tauri-drag-region 属性と権限 core:window:allow-start-dragging で、自作タイトルバーをドラッグで動かせるようにする。ボタンの除外と startDragging() の使い方も示す。
- 7 ウィンドウを常に最前面に固定する alwaysOnTop と setAlwaysOnTop()(権限 core:window:allow-set-always-on-top)でウィンドウを最前面に固定し、ピン留めボタンでの切り替えと、裏に隠れるダイアログの対処を示す。
- 8 背景が透ける透明なウィンドウを作る transparent: true とページの CSS で背景を透かし、デスクトップに浮かぶウィジェットを作る。白い背景が残る原因、macOS の macOSPrivateApi、Mica などの効果も示す。
- 9 枠のないフレームレスウィンドウを作る decorations: false で標準のタイトルバーと枠を消し、data-tauri-drag-region と自作ボタンで移動・最小化・閉じるを作り直す。必要な権限と setDecorations() での切り替えも示す。
- 10 ユーザーによるリサイズを禁止する resizable: false と setResizable()(Rust は set_resizable())でウィンドウの大きさを固定する。最小・最大サイズを同じ値にする方法との違いと、最大化ボタンの扱いも示す。
- 11 ウィンドウを表示・非表示にする show()・hide()(権限 core:window:allow-show / allow-hide)でウィンドウを出し入れする。visible: false で起動時のチラつきを防ぐ手順と、隠したウィンドウを呼び戻す方法も示す。
- 12 ウィンドウにフォーカスを当てる・外す setFocus()(権限 core:window:allow-set-focus)で手前に出し、onFocusChanged() で変化を追う。外す API はないため、代わりの手段と focus: false で奪わない作り方も示す。
- 13 ウィンドウのアイコンを変更する setIcon()(権限 core:window:allow-set-icon)でウィンドウのアイコンを実行中に差し替える。必要な Cargo の image-png、canvas で描くバッジ、タスクバー・Dock のバッジも示す。
- 14 ウィンドウの影を付ける・消す shadow 設定と setShadow()(権限 core:window:allow-set-shadow)で影を切り替える。Windows で枠付きの影が消えない、フレームレスで 1px の白い枠線が出る問題の対処も示す。
- 15 ウィンドウの最小・最大サイズを制限する tauri.conf.json の minWidth などと setMinSize()・setSizeConstraints() でリサイズできる範囲を決める。必要な権限、幅だけの制限、表示内容に応じた切り替えも示す。
- 16 ウィンドウを閉じる前に確認ダイアログを出す onCloseRequested() と dialog プラグインの 3 択で未保存時だけ確認する。core:window:allow-destroy が無いと × で閉じない理由と Rust の prevent_close() も示す。
- 17 新しいサブウィンドウを開く (Vite Multi-page) Vite の Multi-page で専用 HTML を作り、new WebviewWindow()(core:webview:allow-create-webview-window)か Rust で開く。本番でメイン画面が出る原因も示す。
- 18 親ウィンドウに対してモーダル表示する (Vite Multi-page) サブウィンドウを parent 付きで開き、親を setEnabled(false)(権限 core:window:allow-set-enabled)で止め、閉じたら戻す。どの閉じ方でも復帰させる方法と OS ごとの違いも示す。
- 19 別のウィンドウ作成時にデータを渡す 新しく開くウィンドウへ初期データを渡す 3 つの方法(URL クエリ、emitTo のハンドシェイク、Rust の initialization_script)と、作成直後の送信が届かない原因、複数開いたときの取り違えの防ぎ方。
- 20 タスクバーでウィンドウを点滅させる requestUserAttention()(権限 core:window:allow-request-user-attention)でタスクバーや Dock のアイコンを点滅させる。種類ごとの OS の違い、止め方、効かない条件も示す。
- 21 画面のスケール倍率(DPI)を取得する scaleFactor() で拡大率を取得し、物理ピクセルと論理ピクセルを換算する。onScaleChanged() で倍率の変化を検知する方法と、devicePixelRatio との使い分けも示す。
- 22 接続されているモニター情報を取得する availableMonitors() などで全モニターの名前・解像度・位置・倍率・作業領域を取得する。自ウィンドウがある画面の解像度(物理・論理)の求め方、別モニターへの移動、Rust 版も示す。
- 23 マウスカーソルのアイコンを変更する ページ上のカーソルは CSS の cursor で変えるのが確実。setCursorIcon()(権限 core:window:allow-set-cursor-icon)との違い、処理中の待機カーソル、独自画像、非表示の方法を示す。
- 24 ウィンドウを画面中央に配置する center: true と center()(権限 core:window:allow-center)でウィンドウを中央に置く。どのモニターの中央になるか、サブウィンドウの中央配置、初回表示のチラつき対策も示す。
- 25 マウスクリックを透過させる(クリックスルー) setIgnoreCursorEvents()(権限 core:window:allow-set-ignore-cursor-events)でクリックを背後のアプリへ通す。ボタンの上だけ押せる部分透過と、解除用のショートカットも示す。
- 26 開いている全ウィンドウのリストを取得する getAllWebviewWindows()(権限は core:default に含まれる)と Rust の webview_windows() で全ウィンドウを列挙する。状態の読み取り、まとめて閉じる処理、開閉に合わせた一覧の更新も示す。
- 27 グローバルショートカットを登録する Global Shortcut プラグインの register() と Rust の Builder で、アプリが背面にあっても反応するキーを登録する。default 権限が空な点、再読み込み後の二重登録エラーの避け方も示す。