0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

はじめに

この記事は Slint Advent Calendar 2025 1日目の記事です。

今年も残り1ヶ月。来年は日本で Slint がたくさん使われるようになるといいなと思っています。

2024年の11月18日に、Slint 1.9 がリリースされ、Slint Advent Calendar 2024@hermit4 さんが 祝 Slint 1.9リリース という記事を書いてくれました。

今週は、それ以降のリリースについて紹介していこうと思っています。

まずは 2025年2月28日にリリースされた Slint 1.10 のリリースについて、このリリース記事を日本語にしてみました。

Slint 1.10 リリース / Figma プラグイン、メニュー、Live‑Preview がデータ編集機能に対応

Rust で書かれ、Rust/C++/Python/JavaScript 向け API を備えたネイティブ GUI ツールキットである Slint は、あらゆるプラットフォームで高速かつレスポンシブなアプリを実現します。今回、新たにバージョン 1.10 をリリースしました。本バージョンでは、新しい Figma
プラグイン
Live‑Preview 用のデータエディタ、さらに メニューバーおよびコンテキストメニュー対応 が導入されています。

Figma プラグイン

image.png

Figma は非常に人気の高い UI デザインツールですが、デザインを最終的なソフトウェアに反映させるのはいつも難題です。そこで、私達は Figma 用の Slint プラグインを開発しました。

Figma 上で要素を選択すると、その要素に対応する Slint コードを表示してくれます。開発モードの「インスペクター」パネルに表示されるかフローティングパネルに表示されるかは Figma のライセンスの種類によります。

まだ初版ということで、Figma の要素のうち Slint に直接マッピングできるもの(たとえば Rectangle、Frame、Text など)のみをサポートしています。しかし、Figmaがデザイナーと開発者の協業を支援する新機能(プロジェクト変数、再利用可能なインスタンス、「開発モード」体験の継続的改善など)を導入していることから、ここには大きな可能性を感じています。この分野の進化を楽しみにするとともに、本プラグインがFigmaから直接必要な情報を得られる一助となれば幸いです。

ぜひお試しいただき、ご意見をお聞かせください。

Live‑Preview のデータエディタ

Slint UIの重要な要素は、プロパティ、コールバック、データモデルといったビジネスロジックへのデータインターフェースです。ライブプレビューに「データ」タブを追加し、コンポーネントのプロパティとグローバルプロパティの両方を表示します。リアルタイムにインタラクションやアニメーションのテストができ、コンパイルの必要はありません。

data-view.gif

メニュー (MenuBar / コンテキストメニュー) 対応

デスクトップアプリケーションにはメニューバーとコンテキストメニューが備わっています。これらをサポートするため、新しい MenuBar および ContextMenuArea 要素を導入しました。どちらも Menu 要素を子に持ち、その内部に MenuItem を配置することでメニュー構造を形成します。for および if を使用してメニューを動的に生成できます。
Windows および macOSでは、ネイティブな見た目と操作感を実現するため、このメニューの実装には muda クレートをバックエンドで使用しています。

export component Example inherits Window {
    MenuBar {
        Menu {
            title: @tr("File");
            MenuItem {
                title: @tr("New");
                activated => { file-new(); }
            }
            MenuItem {
                title: @tr("Open");
                activated => { file-open(); }
            }
        }
        Menu {
            title: @tr("Edit");
            MenuItem {
                title: @tr("Copy");
            }
        }
        // ... more menus here
    }
    callback file-new();
    callback file-open();
    // ... actual window content goes here
}

image.png

マイクロコントローラ向け: SDF フォント

マイクロコントローラでは、テキストレンダリングには事前にレンダリング済のグリフを使用します。これらは使用される全てのサイズがバイナリに埋め込まれていました。動作上は問題ありませんが、フラッシュメモリを大量に消費していました。今回のリリースでは、フラッシュメモリ使用量を大幅に削減する新手法を導入しました。

まず、グリフを Signed Distance Field (SDF)としてプリレンダリングし、単一サイズのみをバイナリに埋め込みます。UIで文字「a」が3つの異なるサイズで使用される場合、必要なスペースは従来の3分の1に削減されます。

次に、実行時にグリフの距離フィールドを目的のサイズにスケーリングし、各ピクセルのアルファカバレッジをグリフのエッジまでの符号化距離から計算します。これにより、実行時の計算量を若干増やす代わりにフラッシュストレージを削減し、滑らかにスケーリングされたテキストを生成します。

この機能を有効化するには:

  • Rust: build.rs内 で slint_build::CompilerConfiguration::with_sdf_fonts() 関数を使用
  • C++: CMakeターゲットプロパティ SLINT_EMBED_RESOURCES=embed-for-software-renderer-with-sdf を設定

バグ修正と改善

本リリースでは以下のバグ修正と新APIを追加:

  • string 型: .is-empty および .character-count プロパティを追加 (Tasuku Suzuki に感謝)
  • Path: stroke-line-cap プロパティを追加
  • C++ SoftwareRenderer: 行単位レンダリング関数 を追加
  • esp-idf: RGB888 レンダリングをサポート
  • Skiaのソフトウェアレンダラーが部分レンダリングを採用し、レンダリング性能が向上
  • 画像読み込みに最新の Image 0.25 crate を使用
  • ListBoxTabWidgetListView など、ウィジェットのアクセシビリティを大幅に改善しました(@DataTriny に感謝)
  • jemalloc の採用により、Slint コンパイラ、言語サーバー、ビューアのパフォーマンスを向上させました(@milianw 氏に感謝)

変更点の完全なリストについては、ChangeLog をご覧ください。

おわりに

今年の2月にリリースされた Slint 1.10 のリリース記事を翻訳しました。

昨年のアドベントカレンダーの22日目に書いた Slint で書いたログイン画面を bash から表示する余談 に書いた以下の機能が取り込まれた思い出深いリリースでした。

明日は Slint 1.11 のリリースのおさらいをする予定です。お楽しみに!

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?