blob: e540d25d3565d048907471d760360e393fa50f45 (
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
|
<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=''"/>
</Rect>
<!-- 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'"/>
</Rect>
<!-- 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>
<!-- 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"/>
</State>
<!--
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"/>
</State>
</states>
</Rect>
|
