Druid UI框架学习1

UI框架

发布日期: 2023-02-23

Druid允许您构建可部署在Windows、macOS、Linux和web上的简单交互式图形应用程序。Druid是一个数据驱动的声明性框架。

一、创建rust项目。

cargo new druid-app

二、使用vim（SpaceVim）编辑器打开项目

项目结构

src
└── main.rs
Cargo.toml
Cargo.lock

我们需要在Cargo.toml中添加Druid的包

[dependencies]
druid = "0.8.2"

三、构建我们的第一个窗体

1. 引入包

use druid::widget::{Button, Flex, Label};
use druid::{AppLauncher, LocalizedString, PlatformError, Widget, WidgetExt, WindowDesc};

2. 编写主界面

fn ui_builder() -> impl Widget<u32> {
    //创建一个本地处理话的数据
    let text = LocalizedString::new("hello-counter")
        .with_arg("count", |data:&u32,_evt|{(*data).into()});
    let label = Label::new(text).padding(5.0).center();
    let button = Button::new("+ 1")
        .on_click(|_ctx,data:&mut u32,_ent|{
            *data += 1;
        });
    Flex::column().with_child(label).with_child(button)
}

3. 编写启动类

fn main() -> Result<(), PlatformError>{
    let win = WindowDesc::new(ui_builder());
    let data = 0_u32;
    let _app = AppLauncher::with_window(win)
        .log_to_console()
        .launch(data);
    Ok(())
}

四、编译程序

cargo build --release

点击target/release目录下的druid-app可运行文件

[tianqi@localhost druid-app]$ ll target/release/
总用量 6.3M
drwxr-xr-x 66 tianqi tianqi 4.0K  2月 23 13:53 build
drwxr-xr-x  2 tianqi tianqi  32K  2月 23 13:54 deps
-rwxr-xr-x  2 tianqi tianqi 6.3M  2月 23 13:54 druid-app
-rw-r--r--  1 tianqi tianqi  100  2月 23 13:54 druid-app.d
drwxr-xr-x  2 tianqi tianqi 4.0K  2月 23 13:53 examples
drwxr-xr-x  2 tianqi tianqi 4.0K  2月 23 13:53 incremental