那曲檬骨新材料有限公司

0
  • 聊天消息
  • 系統消息
  • 評論與回復
登錄后你可以
  • 下載海量資料
  • 學習在線課程
  • 觀看技術視頻
  • 寫文章/發帖/加入社區
會員中心
創作中心

完善資料讓更多小伙伴認識你,還能領取20積分哦,立即完善>

3天內不再提示

Rust UI框架:Slint UI簡單入門

jf_wN0SrCdH ? 來源:Rust語言中文社區 ? 2023-05-12 16:03 ? 次閱讀

Slint 1.0 已發布,標志著項目已順利從開發階段“畢業”,可正式用于生產環境。

Slint 可用于為各種操作系統處理器架構開發 UI,包括 Linux、macOS、Windows、WebAssembly、Blackberry QNX 和裸機。它允許 JavaScript 開發人員為嵌入式和桌面應用程序創建原生用戶界面。

Slint UI 介紹

Slint 曾經被稱為 SixtyFPS,特點是既快又小,是一個 Rust 編寫的綜合性 UI 工具包,用于為桌面和嵌入式設備構建原生用戶界面。其開發團隊希望將 Slint 打造成下一代 GUI 工具包,因此從頭開始構建項目時就考慮了可擴展性、包容性、工具性和跨平臺兼容性。

  • 流暢:平滑,觸摸友好的用戶接口

  • 跨平臺:目標平臺包括嵌入式設備和桌面應用軟件(手機和網頁)

  • 多語言:可以使用自己擅長的語言API(C++,Rust,JavaScript)

  • 快速設計:適時預覽快速迭代

多語言支持的描述,參考官方原文:

We choose to first support this set of languages because it is the implementation language, another low level language, and a dynamic language. We believe that it will be easy to extend the integration into more programming languages later.

Slint 的定位是一個支持多語言、適配任意顯示屏、且高效流暢的用戶圖形接口工具包。設計目標包括:

  • 可擴展:在連接到設備的任何屏幕上運行,從臺式計算機到低功耗嵌入式設備。

  • 輕量級:能夠在幾百KB內存的場景中運行,并且需要很少的處理能力。

  • 原生支持:Slint 支持多種目標平臺,從嵌入式設備到桌面應用,包括移動設備和 Web。

開發團隊表示,使用 Slint 構建的圖形應用程序可以在內存小于 300 kB 的系統上運行,例如包含 264kB RAM 和 ARM Cortex-M0+ 處理器的 Raspberry Pi Pico。因此,Slint 非常適合為嵌入式設備應用程序開發 UI。

e32d15be-f09a-11ed-90ce-dac502259ad0.png

Slint 使用了聲明式編程來簡化 UI 的開發,優化應用程序開發和性能的方法是:

  • 用聲明式語言來描述 UI,使用的語法提供了一種廣泛的方式來描述各種圖形元素,同時易于閱讀、編寫和學習

  • Slint 編譯器對描述 UI 的代碼進行優化并翻譯成原生代碼

  • 采用任何語言編寫的業務邏輯,可通過使用 Slint 提供的特定于語言的 API 與 UI 連接

整體架構

e353995a-f09a-11ed-90ce-dac502259ad0.png

控件支持

e36e1190-f09a-11ed-90ce-dac502259ad0.jpg

示例:

  • 不同平臺的原生桌面小部件(Windows、macOS、Linux)

e3887ed6-f09a-11ed-90ce-dac502259ad0.png

e39e3d66-f09a-11ed-90ce-dac502259ad0.png

e3b4ba96-f09a-11ed-90ce-dac502259ad0.png

  • WebAssembly

e3c7403a-f09a-11ed-90ce-dac502259ad0.png

Slint 完全采用 Rust 實現,同時支持不同的編程語言,目前為 C++、JavaScript 和 Rust 提供了 API。

詳情查看發布公告:https://slint-ui.com/blog/announcing-slint-1.0.html

MCU支持

slint-ui 是嵌入式開發的福音,基于 Rust ,使用了聲明式編程來簡化 UI 的開發,從此再也不用忍受 lvgl/minigui 之類各種各樣的一大票用 c 搞出來的雜七雜八蹩腳又折磨人的 UI 框架(c 框架心智負擔太重,很難做到界面與邏輯分離,一旦需求變動幾乎就是災難)。也許有人會問為什么不用 QT?QT 太龐大,不適合沒有操作系統的單片機,再者QT For MCU是商業軟件不開源,slint-ui 支持 GPLv3 許可證(采用GPL協議,總感覺有點怪怪的,不知道后續是否會步QT后塵全面商用收費)

關于移植到 MCU 相關的信息可以看一下官方文章及項目例程:

  1. Slint::mcu - Rust:https://slint-ui.com/releases/0.3.0/docs/rust/slint/docs/mcu/index.html

  2. Porting the Slint UI Toolkit to a Microcontroller with 264K RAM — Slint Blog:https://slint-ui.com/blog/porting-slint-to-microcontrollers.html

  3. Slint-mcu-rust-template.git:https://github.com/slint-ui/slint-mcu-rust-template.git

界面展示:
打印機:【查看在線交互演示】:https://slint-ui.com/releases/0.3.0/demos/printerdemo

e3ed93b6-f09a-11ed-90ce-dac502259ad0.png

Rust Slint 簡單入門

1. slint 界面代碼嵌入在 Rust 中

新建項目

cargo new rust-ui

添加庫 TOML

[dependencies]
slint = "1.0.0"

main.rs中添加代碼:

fn main() {
    // 運行slintUI窗體
    MainWindow::new().run();
}
// slint宏,創建 UI
slint::slint!{
    export component MainWindow inherits Window {
        title: "Main Window";
        width: 600px;
        height: 500px;
        // 定義一個 Text 組件
        Text{
            text: "Hello, world";
            color:blue;
        }
    }
}

上述是將界面 slint 代碼嵌入在 rust 同一個文件中,slint 聲明式編程來簡化 UI 的開發,有 Flutter、Compose 以及其他前端開發經驗同學很容易上手。更多組件的使用的請參考開發文檔和 Demo示例

2、界面 slint 文件與 Rust 代碼分開

cargo.toml 添加

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

添加界面文件,新建 ui/main.slint 文件

import {GroupBox, LineEdit, Button} from "std-widgets.slint";

export component MainWindow inherits Window {
    title: "Main Window";
    width: 600px;
    height: 500px;

    VerticalLayout { 
        alignment:start;
        padding-left: 25px;
        padding-right: 25px;

        Text { 
            font-size: 27px;
            font-weight: 700;
            color: #6776FF;  
         }

        GroupBox{
            title:"lineEdit";
            LineEdit {
                placeholder-text: "enter text";
            }
        }

        Button {
            text: "Click Me";
            clicked => { self.text = "Clicked"; }
        }

    }
}

添加 build.rs 文件

fn main() {
    slint_build::compile("ui/main.slint").unwrap();
}

main.rs 主文件

slint::include_modules!();

fn main() {
   MainWindow::new().unwrap().run().unwrap();
}

建立好的項目文件結構如下:

e405cb0c-f09a-11ed-90ce-dac502259ad0.png

執行命令:cargo run,運行效果如下圖,以上所有程序開發均在vs code下完成(依賴slint官方插件)

注:VSCode插件:slint 語法高亮并可以進行界面預覽 https://marketplace.visualstudio.com/items?itemName=Slint.slint

e41a8d08-f09a-11ed-90ce-dac502259ad0.png

總結

Slint 是一個 Rust 編寫的綜合性 UI 工具包,定義和提供一系列方便構建 UI 的組件,使用了聲明式編程來簡化 UI 的開發,可用于為桌面和嵌入式設備構建原生用戶界面。使用 Slint 構建的圖形應用程序可以在內存小于 300 kB 的系統上運行,實事求是的講,內存較大的嵌入式設備上 Android 更占優勢,但是低內存的嵌入式設備(比如單片機)上 Slint 有很大機會,總之,Slint 非常適合為嵌入式設備應用程序開發 UI。

審核編輯 :李倩


聲明:本文內容及配圖由入駐作者撰寫或者入駐合作網站授權轉載。文章觀點僅代表作者本人,不代表電子發燒友網立場。文章及其配圖僅供工程師學習之用,如有內容侵權或者其他違規問題,請聯系本站處理。 舉報投訴
  • 框架
    +關注

    關注

    0

    文章

    403

    瀏覽量

    17541
  • 嵌入式設備
    +關注

    關注

    0

    文章

    110

    瀏覽量

    17031
  • GUI
    GUI
    +關注

    關注

    3

    文章

    662

    瀏覽量

    39887

原文標題:Rust UI 框架:Slint UI 簡單入門

文章出處:【微信號:Rust語言中文社區,微信公眾號:Rust語言中文社區】歡迎添加關注!文章轉載請注明出處。

收藏 人收藏

    評論

    相關推薦

    自動化創建UI并解析數據

    *附件:32960_auto.rar備注:Main.vi是ui自動化2.1.vi,配置文件為32960.B.ini。 目前可以實現根據配置文件自動化創建控件并布局,且可以自動解析接收到的數據內容寫入
    發表于 12-10 08:41

    自動化創建UI并解析數據

    Labview實現動態增加控件效果 - *附件:32960_auto.rar 備注:Main.vi是ui自動化2.1.vi,配置文件為32960.B.ini。 目前可以實現根據配置文件自動化創建控件
    發表于 11-29 11:26

    三星電子為其2023年款智能電視推送One UI更新

    10月14日,據國外媒體報道,三星電子已正式向2023年款的智能電視推送了One UI更新。   此次One UI更新建立在Tizen 8.0操作系統之上,為三星智能電視引入了一系列顯著的改進
    的頭像 發表于 10-15 17:11 ?1196次閱讀

    esp-box的slint例子為啥燒錄后無法顯示怎么解決?

    設備:esp-box-3b 開發環境:esp-idf + slint 按照官方的slint開發例子,運行和燒錄都沒問題,但是屏幕無法顯示
    發表于 07-22 08:14

    VA段碼COG液晶屏可個性化靈活設計UI,實現創意UI的高對比高亮多色彩炫酷顯示。

    VA段碼COG液晶屏可個性化靈活設計UI,實現創意UI的高對比高亮多色彩炫酷顯示。
    的頭像 發表于 07-11 10:50 ?660次閱讀
    VA段碼COG液晶屏可個性化靈活設計<b class='flag-5'>UI</b>,實現創意<b class='flag-5'>UI</b>的高對比高亮多色彩炫酷顯示。

    使用 GPT4V+AI Agent 做自動 UI 測試的探索

    一、背景 從 Web 誕生之日起,UI 自動化就成了測試的難點,到現在近 30 年,一直沒有有效的手段解決Web UI測試的問題,盡管發展了很多的 webdriver 驅動,圖片 diff 驅動
    的頭像 發表于 06-20 15:42 ?547次閱讀
    使用 GPT4V+AI Agent 做自動 <b class='flag-5'>UI</b> 測試的探索

    RK3588 在使用rockit接口設置vo時,UI消失,大家遇到過嗎?

    使用RK3588,先通過vo顯示出來了UI,然后希望通過vo輸出解碼的視頻,在設置vo時,在調用RK_MPI_VO_GetPubAttr接口,UI直接消失,所在進程依然運行
    發表于 06-11 17:59

    鴻蒙Ability Kit(程序框架服務)【UIAbility組件與UI的數據同步】

    基于當前的應用模型,可以通過以下幾種方式來實現UIAbility組件與UI之間的數據同步。
    的頭像 發表于 06-03 10:26 ?550次閱讀
    鴻蒙Ability Kit(程序<b class='flag-5'>框架</b>服務)【UIAbility組件與<b class='flag-5'>UI</b>的數據同步】

    鴻蒙ArkUI:【從代碼到UI顯示的整體渲染流程】

    方舟開發框架(簡稱ArkUI)是鴻蒙開發的UI框架,提供如下兩種開發范式,我們 **只學聲明式開發范式**
    的頭像 發表于 05-13 16:06 ?1021次閱讀
    鴻蒙ArkUI:【從代碼到<b class='flag-5'>UI</b>顯示的整體渲染流程】

    鴻蒙OS開發實戰:【自動化測試框架】使用指南

    為支撐HarmonyOS操作系統的自動化測試活動開展,我們提供了支持JS/TS語言的單元及UI測試框架,支持開發者針對應用接口進行單元測試,并且可基于UI操作進行UI自動化腳本的編寫。
    的頭像 發表于 04-08 14:49 ?1539次閱讀
    鴻蒙OS開發實戰:【自動化測試<b class='flag-5'>框架</b>】使用指南

    touchgfx的ui控件非常多的時候容易死機是什么原因導致的?

    由于項目比較復雜,ui上控件以及容器比較多,包括文本和動態文本都很多;當再增加文本或者增加ui圖片的時候容易HardFault_Handler程序卡死;目前測試發現增加定義 幾個動態文本 就死機,刪除之后正常;也遇到過增加一張圖片之后死機,刪除圖片之后就正常;
    發表于 03-21 06:09

    ocl最大輸出功率和ui有關系嗎

    在音頻設備中,OCL(Output Capacitor-Less)電路是一種常見的功率放大電路。它具有結構簡單、成本低廉、輸出驅動能力強等優點,因此被廣泛應用于音頻放大器設計中。而UI參數指的是
    的頭像 發表于 03-09 14:25 ?2271次閱讀

    【AWTK開源智能串口屏方案】設計UI界面并上傳到串口屏

    本篇文章將介紹如何使用AWStudio設計串口屏端的UI界面和添加綁定規則,以及怎么將資源文件上傳到串口屏端。引言:AWTK-HMI是基于AWTK與AWTK-MVVM開發的低代碼智能串口屏方案,本系
    的頭像 發表于 02-22 08:24 ?790次閱讀
    【AWTK開源智能串口屏方案】設計<b class='flag-5'>UI</b>界面并上傳到串口屏

    微軟發布Agent框架UFO,引領UI交互新紀元

    微軟近日宣布推出全新的Agent框架——UFO(UI-Focused Agent),旨在構建更智能、更直觀的用戶界面交互體驗。該框架基于OpenAI的GPT-4V圖像識別模型開發,專為Windows操作系統上的應用程序設計,能夠
    的頭像 發表于 02-19 11:15 ?1282次閱讀

    鴻蒙開發-HarmonyOS UI架構

    初步布局Index 當我們新建一個工程之后,首先會進入Index頁。我們先簡單的做一個文章列表的顯示 class Article { title?: string desc?: string
    發表于 02-16 16:38
    全讯网999| 大发888国际娱乐bet| 博彩e族字谜专区| 博狗玩百家乐官网好吗| 百家乐官网投注网站| 二八杠单机游戏| 利高娱乐| 百家乐官网翻天片尾曲| 网上百家乐官网大转轮| 百家乐官网看图赢钱| 百家乐规| 龙博娱乐| 百家乐官网方案| 百家乐有赢钱公式吗| 百家乐博赌城| 金龙娱乐城开户送彩金| 百家乐官网技论坛| 百家乐的寻龙定穴| 二八杠麻将做记号| 百家乐官网有破解的吗| 网上百家乐公式| 百家乐发牌靴8| 太阳城百家乐官网的破解| 爱赢百家乐官网的玩法技巧和规则| 澳门百家乐规| 澳门百家乐官网娱乐城网址| 澳门百家乐职业赌客| 德州扑克边池| 百家乐官网赌场占多大概率| 利都百家乐国际娱乐平台| 麻将二八杠技巧| 最新百家乐官网双面数字筹码| 苹果百家乐的玩法技巧和规则| 离岛区| 沙巴百家乐现金网| 威尼斯人娱乐网上百家乐| 利来国际网上娱乐| 百家乐官网博百家乐官网的玩法技巧和规则| 百家乐机器出千| 澳门百家乐官网职业赌客| 威尼斯人娱乐棋牌是真的吗|