summaryrefslogtreecommitdiffstats
path: root/examples/declarative/velocity/Day.qml
blob: b65f2bc286c29fbeafa093c3a3bfcf3867883050 (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
<Rect width="400" height="500" radius="7" pen.color="black" id="Page">
    <properties>
        <Property name="day" type="string" />
        <Property name="stickies" />
    </properties>

    <Image x="10" y="10" source="cork.jpg" opaque="true"/>
    <Text x="20" y="20" height="40" font.size="14" font.bold="true" width="370" text="{day}" style="Outline" styleColor="#dedede"/>

    <Repeater dataSource="{Page.stickies}">
        <Item x="{Math.random() * 200 + 100}" y="{Math.random() * 300 + 50}" id="StickyPage">
            <rotation>
                <Follow source="{-Flick.xVelocity / 100}" spring="2.0" damping="0.1"/>
            </rotation>
            <Item id="Sticky" scale="0.5">
                <Image id="StickyImage" source="sticky.png" smooth="true" y="-20" x="{8 + -width * 0.6 / 2}" scale="0.6" />
                <TextEdit id="MyText" smooth="true" font.size="28" readOnly="false" x="-104" y="36" wrap="true" rotation="-8" text="{noteText}" width="195" height="172" />
                <Item y="-20" x="{StickyImage.x}" width="{StickyImage.width * StickyImage.scale}" height="{StickyImage.height * StickyImage.scale}" >
                    <MouseRegion id="Mouse" onClicked="MyText.focus = true" anchors.fill="{parent}" drag.target="{StickyPage}" drag.axis="xy" drag.ymin="0" drag.ymax="500" drag.xmin="0" drag.xmax="400"/>
                </Item>
            </Item>
            <Image source="tack.png" x="{-width / 2}" y="{-height * 0.7 / 2}" scale="0.7" />

            <states>
                <State name="pressed" when="{Mouse.pressed}">
                    <SetProperties target="{Sticky}" rotation="8" scale="1"/>
                    <SetProperties target="{Page}" z="8"/>
                </State>
            </states>
            <transitions>
                <Transition>
                    <NumericAnimation properties="rotation,scale" duration="200"/>
                </Transition>
            </transitions>
        </Item>
    </Repeater>




</Rect>