rgpui 1.3.0

GUI UI framework
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135

//! 切换按钮。
//!
//! 按下态保持的按钮（与 momentary 的 `Button` 区分），附 `ToggleGroup` 单选组。

use crate::{prelude::*, *};
use std::sync::Arc;

/// 切换按钮。
#[derive(IntoElement)]
pub struct Toggle {
    /// 标签。
    label: SharedString,
    /// 是否按下。
    pressed: bool,
    /// 切换回调（参数为切换后的状态）。
    on_change: Option<Arc<dyn Fn(bool, &mut Window, &mut App) + Send + Sync + 'static>>,
    /// 用户样式。
    style: StyleRefinement,
}

impl Toggle {
    /// 创建切换按钮。
    pub fn new(label: impl Into<SharedString>) -> Self {
        Self {
            label: label.into(),
            pressed: false,
            on_change: None,
            style: StyleRefinement::default(),
        }
    }

    /// 设置按下状态（状态由父持有）。
    pub fn pressed(mut self, pressed: bool) -> Self {
        self.pressed = pressed;
        self
    }

    /// 设置切换回调。
    pub fn on_change<F>(mut self, f: F) -> Self
    where
        F: Fn(bool, &mut Window, &mut App) + Send + Sync + 'static,
    {
        self.on_change = Some(Arc::new(f));
        self
    }
}

impl Styled for Toggle {
    fn style(&mut self) -> &mut StyleRefinement {
        &mut self.style
    }
}

impl RenderOnce for Toggle {
    fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
        let accent = cx.theme().tokens.accent.color;
        let pressed = self.pressed;
        let user_style = self.style;

        Button::new(self.label.clone())
            .label(self.label)
            .map(|mut this| {
                if pressed {
                    this.style()
                        .refine(&StyleRefinement::default().bg(accent.opacity(0.15)));
                }
                this.style().refine(&user_style);
                this
            })
            .on_click(move |_, window, cx| {
                if let Some(ref cb) = self.on_change {
                    cb(!pressed, window, cx);
                }
            })
    }
}

/// 单选切换组（选项互斥，选中态由父持有）。
#[derive(IntoElement)]
pub struct ToggleGroup {
    /// 选项标签。
    options: Vec<SharedString>,
    /// 选中下标。
    selected: Option<usize>,
    /// 变更回调。
    on_change: Option<Arc<dyn Fn(usize, &mut Window, &mut App) + Send + Sync + 'static>>,
}

impl ToggleGroup {
    /// 创建切换组。
    pub fn new(options: Vec<SharedString>) -> Self {
        Self {
            options,
            selected: None,
            on_change: None,
        }
    }

    /// 设置选中下标。
    pub fn selected(mut self, index: Option<usize>) -> Self {
        self.selected = index;
        self
    }

    /// 设置变更回调。
    pub fn on_change<F>(mut self, f: F) -> Self
    where
        F: Fn(usize, &mut Window, &mut App) + Send + Sync + 'static,
    {
        self.on_change = Some(Arc::new(f));
        self
    }
}

impl RenderOnce for ToggleGroup {
    fn render(self, _window: &mut Window, _cx: &mut App) -> impl IntoElement {
        let selected = self.selected;
        let on_change = self.on_change;
        div()
            .flex()
            .flex_row()
            .gap(px(4.0))
            .children(self.options.into_iter().enumerate().map(|(ix, label)| {
                let on_change = on_change.clone();
                Toggle::new(label)
                    .pressed(Some(ix) == selected)
                    .on_change(move |_, window, cx| {
                        if let Some(ref cb) = on_change {
                            cb(ix, window, cx);
                        }
                    })
                    .into_any_element()
            }))
    }
}