summaryrefslogtreecommitdiffstats
path: root/examples/declarative/states/states.qml
blob: 0c27637764fc752be18afd9cc07ebe84ba947be5 (plain)
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
Rect {
    id: Page
    width: 300
    height: 300
    color: "white"
    // A target region.  Clicking in here sets the state to '' - the default state
    Rect {
        width: 50
        height: 50
        x: 0
        y: 0
        color: "transparent"
        pen.color: "black"
        MouseRegion {
            anchors.fill: parent
            onClicked: { Page.state='' }
        }
    }
    // Another target region.  Clicking in here sets the state to 'Position1'
    Rect {
        width: 50
        height: 50
        x: 150
        y: 50
        color: "transparent"
        pen.color: "black"
        MouseRegion {
            anchors.fill: parent
            onClicked: { Page.state='Position1' }
        }
    }
    // Another target region.  Clicking in here sets the state to 'Position2'
    Rect {
        width: 50
        height: 50
        x: 0
        y: 200
        color: "transparent"
        pen.color: "black"
        MouseRegion {
            anchors.fill: parent
            onClicked: { Page.state='Position2' }
        }
    }
    // Rect which will be moved when my state changes
    Rect {
        id: myrect
        width: 50
        height: 50
        color: "red"
    }
    states: [
        // In state 'Position1', change the 'myrect' item x, y to 150, 50.
        State {
            name: "Position1"
            SetProperty {
                target: myrect
                property: "x"
                value: 150
            }
            SetProperty {
                target: myrect
                property: "y"
                value: 50
            }
        }        // In state 'Position2', change y to 100.  We do not specify 'x' here - 
        // it will therefore be restored to its default value of 0, if it
        // had been changed.
,
        State {
            name: "Position2"
            SetProperty {
                target: myrect
                property: "y"
                value: 200
            }
        }
    ]
}