ウィンドウの表示位置を座標で指定する

Recipe ID: win-005

ウィンドウの表示位置(X座標、Y座標)を取得・設定する方法を紹介します。

マルチモニター環境や、特定の位置にウィンドウを表示したい場合などに使用します。
tauri.conf.json での初期設定に加え、フロントエンドやバックエンドから LogicalPosition(論理ピクセル)を用いて、DPIスケーリングを考慮した座標指定を行う方法について解説します。

前提条件

Permissions (権限) の設定

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

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

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

アプリ起動時の初期位置を設定したい場合は、src-tauri/tauri.conf.json を編集するのが最も簡単です。

{
  "app": {
    "windows": [
      {
        "title": "My App",
        "x": 100,
        "y": 100
      }
    ]
  }
}

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

実行中にユーザー操作などでウィンドウ位置を変更する場合、Window APIを使用します。

サンプルコード

LogicalPosition (論理ピクセル) を使用することで、高DPIディスプレイでも適切なサイズ感で変更できます。

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

const appWindow = getCurrentWindow();

// 座標を設定 (論理ピクセル)
// 高DPI環境でも自動的に調整されます
await appWindow.setPosition(new LogicalPosition(100, 100));

// 現在の座標を取得 (論理ピクセルに変換)
// outerPosition() は物理ピクセルを返すため、scaleFactor を使って変換します
const factor = await appWindow.scaleFactor();
const physicalPos = await appWindow.outerPosition();
const logicalPos = physicalPos.toLogical(factor);

console.log(`X: ${logicalPos.x}, Y: ${logicalPos.y}`); // -> 100, 100

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

Rust 側から制御する場合は Window インスタンスの set_position メソッドを使用します。

use tauri::{LogicalPosition, Manager};

#[tauri::command]
fn set_position(app_handle: tauri::AppHandle, x: f64, y: f64) {
    if let Some(window) = app_handle.get_webview_window("main") {
        // 座標を設定 (論理ピクセル)
        window.set_position(LogicalPosition::new(x, y)).unwrap();

        // 現在の座標を取得 (物理ピクセル)
        let factor = window.scale_factor().unwrap();
        let physical_pos = window.outer_position().unwrap();
        
        // 論理ピクセルに変換
        let logical_pos = physical_pos.to_logical::<f64>(factor);
        println!("Current Pos: {}, {}", logical_pos.x, logical_pos.y);
    }
}