makepad-example-ui-zoo 1.0.0

Makepad ui-zoo example
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

use crate::{
    makepad_widgets::*,
};

live_design!{
    use link::theme::*;
    use link::shaders::*;
    use link::widgets::*;
    use crate::layout_templates::*;

    pub DemoImage = <UIZooTabLayout_B> {
        desc = {
            <Markdown> { body: dep("crate://self/resources/image.md") } 
        }
        demos = {
            <H4> { text: "Default" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150, flow: Down,
                <Image> { source: dep("crate://self/resources/ducky.png" ) }
            }

            <Hr> {}
            <H4> { text: "min_height" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { height: Fill, source: dep("crate://self/resources/ducky.png" ), min_height: 100 }
            }

            <Hr> {}
            <H4> { text: "width_scale" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, source: dep("crate://self/resources/ducky.png" ), width_scale: 1.1 }
            }

            <Hr> {}
            <H4> { text: "fit: Stretch" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, height: Fill, source: dep("crate://self/resources/ducky.png"), fit: Stretch }
            }


            <Hr> {}
            <H4> { text: "fit: Horizontal" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, height: Fill, source: dep("crate://self/resources/ducky.png" ), fit: Horizontal }
            }

            <Hr> {}
            <H4> { text: "fit: Vertical" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, height: Fill, source: dep("crate://self/resources/ducky.png" ), fit: Vertical }
            }

            <Hr> {}
            <H4> { text: "fit: Smallest" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, height: Fill, source: dep("crate://self/resources/ducky.png" ), fit: Smallest }
            }
            
            <Hr> {}
            <H4> { text: "fit: Biggest" }
            <View> {
                show_bg: true, draw_bg: { color: (THEME_COLOR_D_1)}, width: Fill, height: 150,
                <Image> { width: Fill, height: Fill, source: dep("crate://self/resources/ducky.png" ), fit: Biggest }
            }

        }
    }
}