ウィンドウのアイコンを変更する

アプリケーションのウィンドウアイコン（タスクバーやタイトルバーに表示されるアイコン）を変更する方法を紹介します。

通知の状態に応じてアイコンを変化させたり、ユーザーが選択したテーマに合わせて動的にアイコンを切り替えたい場合に使用します。
tauri.conf.json でのデフォルト設定、および動的にアイコン画像を変更する方法について解説します。

前提条件

Permissions (権限) の設定

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

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

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

デフォルトのウィンドウアイコンは、アプリケーション全体のアイコン設定として bundle セクションで定義します。
Tauri v2 では、app > windows 内で個別にアイコンを指定するのではなく、以下の bundle > icon 設定が使用されます。

{
  "bundle": {
    "icon": [
      "icons/32x32.png",
      "icons/128x128.png",
      "icons/128x128@2x.png",
      "icons/icon.icns",
      "icons/icon.ico"
    ]
  }
}

配列形式で複数の解像度や形式を指定することで、OSごとに最適なアイコンが自動的に選択されます。
パスは tauri.conf.json からの相対パス（通常は src-tauri ディレクトリ内）です。

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

フロントエンドからアイコンを変更する場合、src-tauri/Cargo.toml の設定変更と、@tauri-apps/api/image の使用が必要です。

1. 準備 (Cargo.toml & tauri.conf.json)

Cargo.toml の設定
src-tauri/Cargo.toml で、tauri の依存関係に image-png (または image-ico) フィーチャーを追加してください。これが必須です。

[dependencies]
tauri = { version = "2.0.0", features = ["image-png", "wry"] }

リソースの設定 (tauri.conf.json)
画像ファイルをアプリに同梱するため、resources に追加します。

{
  "bundle": {
    "resources": [
      "icons/custom-icon.png"
    ]
  }
}

2. 権限の設定 (Permissions)

src-tauri/capabilities/default.json に以下の権限を追加します。
* core:path:default: resolveResource を使用するために必要
* core:window:allow-set-icon: アイコンを変更するために必要

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

3. サンプルコード

Tauri v2 では setIcon にパス文字列ではなく、Image オブジェクトを渡す必要があります。

import { getCurrentWindow } from '@tauri-apps/api/window';
import { resolveResource } from '@tauri-apps/api/path';
import { Image } from '@tauri-apps/api/image';

const appWindow = getCurrentWindow();

// 1. リソースのシステム絶対パスを解決
const resourcePath = await resolveResource('icons/custom-icon.png');

// 2. パスからImageオブジェクトを生成
// ※ Cargo.tomlの "image-png" が有効でないとエラーになります
const icon = await Image.fromPath(resourcePath);

// 3. アイコンを設定
await appWindow.setIcon(icon);

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

Rust 側から動的にアイコンを変更する場合、tauri::image::Image を使用します。
この機能を使用するには、src-tauri/Cargo.toml に画像形式に対応した features を追加する必要があります。

1. Cargo.toml の設定

src-tauri/Cargo.toml を開き、tauri の依存関係定義に image-png (または image-ico) フィーチャーを追加してください。

[dependencies]
tauri = { version = "2.0.0", features = ["image-png", "wry"] } 
# ※ "wry" など既存の機能も維持してください

2. サンプルコード

以下は、include_bytes! マクロを使用してバイナリに画像を埋め込み、それをウィンドウアイコンとして設定する例です。

use tauri::Manager;
use tauri::image::Image;

#[tauri::command]
fn change_icon(app_handle: tauri::AppHandle) {
    if let Some(window) = app_handle.get_webview_window("main") {
        // 例: 埋め込み画像を使用する場合 (パスは src-tauri/src/ からの相対パス)
        // features = ["image-png"] が有効である必要があります
        let icon_bytes = include_bytes!("../icons/icon.png");
        
        // バイト列からImageを生成
        if let Ok(icon_img) = Image::from_bytes(icon_bytes) {
            let _ = window.set_icon(icon_img);
        }
    }
}