画面解像度を取得する

Recipe ID: sys-018

現在アプリケーションが表示されているディスプレイ(モニター)の解像度を取得する方法を解説します。

前提条件

@tauri-apps/api パッケージが必要です。

Permissions (権限) の設定

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

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

1. フロントエンドから作成する (TypeScript)

@tauri-apps/api/windowcurrentMonitor() 関数を使用します。
戻り値の Monitor オブジェクトには、物理サイズ(width, height)とスケールファクタ(scaleFactor)が含まれています。

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

async function getResolution() {
  // 現在のモニター情報を取得 (null の可能性あり)
  const monitor = await currentMonitor();
  
  if (monitor) {
    const { width, height } = monitor.size;
    const scaleFactor = monitor.scaleFactor;
    
    console.log(`Physical Resolution: ${width}x${height}`);
    console.log(`Scale Factor: ${scaleFactor}`);
    
    // 論理サイズ (CSSピクセル相当) の計算
    const logicalWidth = width / scaleFactor;
    const logicalHeight = height / scaleFactor;
    console.log(`Logical Size: ${logicalWidth}x${logicalHeight}`);
  } else {
    console.log('モニター情報を取得できませんでした');
  }
}

getResolution();

2. バックエンドから作成する (Rust)

Rust 側の tauri::Window インスタンスから、現在のモニター情報を取得できます。

Rust 実装

use tauri::{command, Window};

#[command]
fn get_resolution_from_rust(window: Window) -> String {
    if let Ok(Some(monitor)) = window.current_monitor() {
        let size = monitor.size();
        let scale_factor = monitor.scale_factor();
        format!(
            "{}x{} (Scale: {})",
            size.width, size.height, scale_factor
        )
    } else {
        "Monitor not found".to_string()
    }
}

#[cfg_attr(mobile, tauri::mobile_entry_point)]
pub fn run() {
    tauri::Builder::default()
        .invoke_handler(tauri::generate_handler![get_resolution_from_rust])
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

フロントエンドからの呼び出し

import { invoke } from '@tauri-apps/api/core';

invoke<string>('get_resolution_from_rust')
  .then(res => console.log(`Resolution from Rust: ${res}`))
  .catch(console.error);