freya-devtools-app 0.4.0-rc.16

Devtools App for Freya app
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

use freya::prelude::*;
use torin::gaps::Gaps;

fn gap_label(tooltip_text: &'static str, value: f32) -> impl IntoElement {
    TooltipContainer::new(Tooltip::new(tooltip_text)).child(
        label()
            .text_align(TextAlign::Center)
            .width(Size::px(25.))
            .height(Size::px(25.))
            .text(format!("{value}")),
    )
}

pub fn computed_layout(inner_area: String, padding: Gaps, margin: Gaps) -> impl IntoElement {
    rect().width(Size::fill()).max_width(Size::px(300.)).child(
        rect()
            .width(Size::fill())
            .height(Size::px(220.))
            .main_align(Alignment::center())
            .cross_align(Alignment::center())
            .background((40, 40, 40))
            .content(Content::Flex)
            .corner_radius(CornerRadius::new_all(5.))
            .child(gap_label("Top margin", margin.top()))
            .child(
                rect()
                    .direction(Direction::Horizontal)
                    .height(Size::flex(1.))
                    .width(Size::fill())
                    .cross_align(Alignment::center())
                    .content(Content::Flex)
                    .child(gap_label("Left margin", margin.left()))
                    .child(
                        rect()
                            .width(Size::flex(1.))
                            .height(Size::fill())
                            .content(Content::Flex)
                            .cross_align(Alignment::Center)
                            .background((71, 180, 240))
                            .corner_radius(CornerRadius::new_all(5.))
                            .child(gap_label("Top padding", padding.top()))
                            .child(
                                rect()
                                    .direction(Direction::Horizontal)
                                    .height(Size::flex(1.))
                                    .content(Content::Flex)
                                    .cross_align(Alignment::center())
                                    .child(gap_label("Left padding", padding.left()))
                                    .child(
                                        rect()
                                            .width(Size::flex(1.))
                                            .height(Size::fill())
                                            .main_align(Alignment::center())
                                            .cross_align(Alignment::center())
                                            .background((40, 40, 40))
                                            .corner_radius(CornerRadius::new_all(5.))
                                            .child(
                                                TooltipContainer::new(Tooltip::new("Inner area"))
                                                    .child(label().text(inner_area)),
                                            ),
                                    )
                                    .child(gap_label("Right padding", padding.right())),
                            )
                            .child(gap_label("Bottom padding", padding.bottom())),
                    )
                    .child(gap_label("Right margin", margin.right())),
            )
            .child(gap_label("Bottom margin", margin.bottom())),
    )
}