#gui #graphics #gamedev #tic-tac-toe

mcgooey

一个仅使用百分比和窗口部件树工作的GUI系统

4个版本

0.1.4 2022年5月3日
0.1.3 2022年5月3日
0.1.2 2022年5月2日
0.1.1 2022年5月2日
0.1.0 2022年5月1日

图形API 中排名第 896

GPL-3.0 许可证

615KB
790 代码行

McGooey

McGooey 是一个基于 Macroquad 的 Rust 编写的 GUI 系统。McGooey 是 Mc — Macroquad,Gooey — GUI。用 McGooey 制作的 GUI 也确实很有质感。

McGooey 中的 GUI 以窗口部件树的形式编写。 Widget 是一个可以用来创建新 UI 窗口部件的 trait。McGooey 对窗口部件的布局也有很强的观点。每个窗口部件都应该只在其传递给它的空间内进行逻辑绘制,即其父窗口部件的空间,在允许边距和该父窗口部件的其他子元素之后。因此,所有窗口部件的尺寸都指定为百分比。即使文本也随着其父窗口部件的大小而缩放(因为其大小是其父窗口部件大小的百分比)。

简单的窗口部件树

View::new(
        Column::new().push(
            Button::default(state.clone())
                .color(WHITE)
                .is_pressed_callback(|_button: &mut Button<()>| {       // Specify the type of the external state variable as a type parameter
                    panic!("EXIT");
                })
                .child(
                    Text::default()
                        .text("Click me to exit")
                        .geometry(Geometry::new(Vector2::from(90, 90))) // that is, occupy 90% of parent's width and height. 
                                                                        // 10% of vertical and horizontal padding are added automatically
                        .color(RED),
                ),
        ),
    )

视图是一个包含定义其外观的多个窗口部件的单个屏幕。每个视图都必须将其交互式窗口部件传递给一个 Rc,这是一个可以由窗口部件以及您应用程序的其他组件进行修改的外部状态。一个返回使用所需外部状态构建的视图的函数(Unit 类型作为示例)

  fn ui(state: Rc<RefCell<()>>) -> View {
    View::new(
        Column::new().push(
            Button::default(state.clone())
                .color(WHITE)
                .is_pressed_callback(|_button: &mut Button<()>| {
                    panic!("EXIT");
                })
                .child(
                    Text::default()
                        .text("Click me to exit")
                        .geometry(Geometry::new(Vector2::from(90, 90)))
                        .color(RED),
                ),
        ),
    )
}
        
#[macroquad::main("XandO")]
async fn main() {
    let mut ui = ui(Rc::new(RefCell::new(())));
    loop {
        ui.tick();
        ui.draw();

        next_frame().await
    }
}

Xando

Xando 是一个使用 McGooey 实现的井字棋游戏,展示了在按钮点击等事件上修改外部状态等常见场景。通过 McGooey,Xando 能够轻松实现游戏中的可变单元格数量。

依赖项

~20MB
~271K SLoC