ウィンドウを画面中央に配置する

Recipe ID: win-025

ウィンドウをモニター画面の中央(センター)に移動させる方法を紹介します。

アプリ起動時や、ダイアログを表示する際に、ユーザーの視線が集まる中央に配置する場合に使用します。
tauri.conf.json での初期配置設定、および実行時に動的に中央寄せを行う手順について解説します。

前提条件

Permissions (権限) の設定

src-tauri/capabilities/default.json に以下の権限を追加します。

{
  "permissions": [
    ...,
    "core:window:allow-center",
    "core:window:default"
  ]
}

1. 静的な設定 (tauri.conf.json)

起動時に画面中央に配置するには、center: true を設定します。

{
  "app": {
    "windows": [
      {
        "center": true
      }
    ]
  }
}

2. フロントエンドから変更する (TypeScript)

サンプルコード

import { getCurrentWindow } from '@tauri-apps/api/window';

const appWindow = getCurrentWindow();

// ウィンドウを画面中央に配置
await appWindow.center();

参考: https://v2.tauri.app/ja/reference/javascript/api/namespacewindow/#methods-1

3. バックエンドから変更する (Rust)

use tauri::Manager;

#[tauri::command]
fn center_window(app_handle: tauri::AppHandle) {
    if let Some(window) = app_handle.get_webview_window("main") {
        window.center().unwrap();
    }
}