smudge-platform 0.2.0

Windowing, input and presentation for the Smudge GUI library
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110

//! Buttons, labels, a text input and a scroll view, to try accessibility by
//! hand.
//!
//! Run with `cargo run --example controls -p smudge-platform`. A screen
//! reader announces the two buttons, the field and the list this window
//! shows: press the buttons with the keyboard, type into the field, and
//! scroll the list while the reader runs to hear what changes.

use std::process::ExitCode;

use smudge_core::geometry::{Color, Size};
use smudge_core::reactive::RwSignal;
use smudge_core::reactive::prelude::*;
use smudge_core::style::{Align, Length, px};
use smudge_core::theme::Theme;
use smudge_core::widget::panel;
use smudge_platform::{WindowOptions, run_with};
use smudge_text::TextInputExt;
use smudge_text::label;
use smudge_text::text_input;
use smudge_widgets::ButtonExt;
use smudge_widgets::button;
use smudge_widgets::column;
use smudge_widgets::scroll;

/// The height of one input field, in logical pixels.
const FIELD_HEIGHT: f32 = 32.0;

/// The height of the scroll view, in logical pixels.
const VIEW_HEIGHT: f32 = 180.0;

fn main() -> ExitCode {
    let build = || {
        let clicks = RwSignal::new(0u32);
        let typed = RwSignal::new(String::new());
        let press_clicks = clicks.clone();
        let reset_clicks = clicks.clone();
        let read_clicks = clicks.clone();
        let read_typed = typed.clone();
        panel()
            .padding(px(24.0))
            .gap(Size {
                width: 0.0,
                height: 16.0,
            })
            .align_items(Align::Start)
            .background(Color::rgb(24, 26, 32))
            .child(
                button("Press me")
                    .primary()
                    .on_press(move || press_clicks.update(|count| *count += 1)),
            )
            .child(button("Reset").on_press(move || reset_clicks.set(0)))
            .child(label(move || format!("Clicks: {}", read_clicks.get())))
            .child(
                text_input(typed)
                    .width(Length::pct(100.0))
                    .height(px(FIELD_HEIGHT))
                    .placeholder("Type here")
                    .padding(px(8.0))
                    .border(1.0)
                    .border_color(Color::rgb(70, 74, 88)),
            )
            .child(label(move || {
                if read_typed.get().is_empty() {
                    String::from("The field is empty")
                } else {
                    format!("You typed: {}", read_typed.get())
                }
            }))
            .child(
                scroll(
                    column()
                        .gap(Size {
                            width: 0.0,
                            height: 4.0,
                        })
                        .children((1..=12).map(|index| {
                            label(move || format!("List item {index} of 12"))
                                .height(px(28.0))
                                .padding(px(4.0))
                        })),
                )
                .height(px(VIEW_HEIGHT))
                .width(Length::pct(100.0)),
            )
    };

    let result = run_with(
        WindowOptions {
            title: String::from("Smudge controls"),
            size: Size {
                width: 420.0,
                height: 480.0,
            },
            clear_color: Color::rgb(16, 17, 21),
            ..WindowOptions::default()
        },
        build,
        |app| app.set_theme(Theme::dark()),
    );

    match result {
        Ok(()) => ExitCode::SUCCESS,
        Err(error) => {
            eprintln!("smudge: {error}");
            ExitCode::FAILURE
        }
    }
}