Rust の UI フレームワーク Slint で Hello World

github.com

プロジェクト作成

mkdir example
cd example
cargo init

Cargo.toml に以下の依存を追加

[dependencies]
slint = "1.16.1"

[build-dependencies]
slint-build = "1.16.1"

slint-build は Slint のUI構築用独自DSLのコンパイル用に必要

slint ファイル作成

slint ファイル作成し、

mkdir ui
touch ui/app-window.slint

windows なら New-Item ui/app-window.slint

ui/app-window.slint を以下のように編集する。

import { VerticalBox } from "std-widgets.slint";

export component AppWindow inherits Window {
    preferred-width: 300px;
    preferred-height: 200px;

    VerticalBox {
        Text {
            text: "Hello World";
        }
    }
}

Window の中に VerticalBox を配備し、その中にテキストを定義している。

slint では UI をこのようなDSLで宣言的に定義する。

slint ファイルをコンパイルするため、build.rs を作成する。

touch build.rs

build.rs を以下のように編集。

fn main() {
    slint_build::compile("ui/app-window.slint").expect("Slint build failed");
}

main.rs

メインファイル src/main.rs を以下のように編集する。

#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]

use std::error::Error;

slint::include_modules!();

fn main() -> Result<(), Box<dyn Error>> {
    let ui = AppWindow::new()?;

    ui.run()?;

    Ok(())
}

実行

cargo run