Skip to main content

showcase/pages/
controls.rs

1use material::widget::page;
2use material_ui_rs as material;
3
4use super::super::{Message, RadioChoice, SegmentChoice, Showcase};
5
6pub(super) fn view(state: &Showcase) -> material::Element<'_, Message> {
7    page::sections([
8        page::section("Counter", counter_controls(state)).into(),
9        page::section("Actions", action_buttons(state)).into(),
10        page::section("FABs", fabs(state)).into(),
11        page::section("Chips", chips(state)).into(),
12        page::section("Segmented buttons", segmented_buttons(state)).into(),
13        page::section("Selection controls", selection_controls(state)).into(),
14    ])
15    .into()
16}
17
18fn counter_controls(state: &Showcase) -> material::Element<'_, Message> {
19    use material::widget::button::{self, ButtonVariant};
20
21    page::row([
22        button::action(
23            button::button("Minus", ButtonVariant::Outlined),
24            Message::Decrement,
25        ),
26        material::text::headline_medium(state.count.to_string()).into(),
27        button::action(
28            button::button("Plus", ButtonVariant::Filled),
29            Message::Increment,
30        ),
31    ])
32    .into()
33}
34
35fn action_buttons(state: &Showcase) -> material::Element<'_, Message> {
36    use material::widget::button::{self, ButtonVariant};
37
38    page::row(button::enabled_actions(
39        state.enabled,
40        Message::Increment,
41        [
42            button::button("Filled", ButtonVariant::Filled),
43            button::button("Tonal", ButtonVariant::FilledTonal),
44            button::button("Text", ButtonVariant::Text),
45        ],
46    ))
47    .into()
48}
49
50fn fabs(state: &Showcase) -> material::Element<'_, Message> {
51    use material::widget::button::{self, FabSize, FabVariant};
52
53    page::stack([
54        page::row(button::enabled_actions(
55            state.enabled,
56            Message::Increment,
57            [
58                button::fab("add", FabVariant::Surface, FabSize::Small),
59                button::fab("add", FabVariant::Surface, FabSize::Standard),
60                button::fab("add", FabVariant::Surface, FabSize::Large),
61                button::fab("add", FabVariant::Primary, FabSize::Standard),
62                button::fab("add", FabVariant::Secondary, FabSize::Standard),
63                button::fab("add", FabVariant::Tertiary, FabSize::Standard),
64            ],
65        ))
66        .into(),
67        page::row(button::enabled_actions(
68            state.enabled,
69            Message::Increment,
70            [
71                button::extended_fab_with_icon("add", "Create", FabVariant::Primary),
72                button::extended_fab_with_icon("share", "Share", FabVariant::Secondary),
73                button::extended_fab_with_icon("add", "Add", FabVariant::Tertiary),
74                button::extended_fab("Reroute", FabVariant::Surface),
75            ],
76        ))
77        .into(),
78    ])
79    .into()
80}
81
82fn chips(state: &Showcase) -> material::Element<'_, Message> {
83    use material::widget::button::{self, ChipVariant};
84
85    page::compact_row(button::enabled_actions(
86        state.enabled,
87        Message::Increment,
88        [
89            button::chip("Assist", ChipVariant::Assist),
90            button::chip("Suggestion", ChipVariant::Suggestion),
91            button::chip("Filter", ChipVariant::Filter),
92            button::chip("Selected", ChipVariant::SelectedFilter),
93        ],
94    ))
95    .into()
96}
97
98fn segmented_buttons(state: &Showcase) -> material::Element<'_, Message> {
99    use material::widget::segmented_button;
100
101    segmented_button::group(segmented_button::animated_label_actions(
102        &state.segment_state,
103        [
104            ("List", Message::SegmentSelected(SegmentChoice::List)),
105            ("Grid", Message::SegmentSelected(SegmentChoice::Grid)),
106            ("Map", Message::SegmentSelected(SegmentChoice::Map)),
107        ],
108    ))
109    .into()
110}
111
112fn selection_controls(state: &Showcase) -> material::Element<'_, Message> {
113    let switches = page::component_stack([
114        material::widget::checkbox::standard(
115            state.enabled,
116            "Enable actions",
117            Message::EnabledChanged,
118        ),
119        state
120            .theme_controller
121            .dark_mode_switch("Dark theme", Message::ThemeChanged),
122    ]);
123
124    let radios = page::row([
125        material::widget::radio::standard(
126            "Standard",
127            RadioChoice::Standard,
128            state.radio_choice,
129            Message::ChoiceSelected,
130        ),
131        material::widget::radio::standard(
132            "Expressive",
133            RadioChoice::Expressive,
134            state.radio_choice,
135            Message::ChoiceSelected,
136        ),
137        material::widget::radio::standard(
138            "Dense",
139            RadioChoice::Dense,
140            state.radio_choice,
141            Message::ChoiceSelected,
142        ),
143    ]);
144
145    page::spacious_stack([switches.into(), radios.into()]).into()
146}