summaryrefslogtreecommitdiffstats
path: root/examples/declarative/dynamic/dynamic.qml
blob: 7331b3f1bbc27947623ec4613837e669b60de30f (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
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import Qt 4.7
import Qt.labs.particles 1.0
import "qml"

Item {
    id: window
    //This is a desktop-sized example
    width: 1024; height: 512
    property int activeSuns: 0

    // sky
    Rectangle { id: sky
        anchors { left: parent.left; top: parent.top; right: toolbox.right; bottom: parent.verticalCenter }
        gradient: Gradient {
            GradientStop { id: stopA; position: 0.0; color: "#0E1533" }
            GradientStop { id: stopB; position: 1.0; color: "#437284" }
        }
    }

    // stars (when there's no sun)
    Particles {
        id: stars
        x: 0; y: 0; width: parent.width; height: parent.height / 2
        source: "images/star.png"; angleDeviation: 360; velocity: 0
        velocityDeviation: 0; count: parent.width / 10; fadeInDuration: 2800
        opacity: 1
    }

    // ground, which has a z such that the sun can set behind it
    Rectangle {
        id: ground
        z: 2
        anchors { left: parent.left; top: parent.verticalCenter; right: toolbox.right; bottom: parent.bottom }
        gradient: Gradient {
            GradientStop { position: 0.0; color: "ForestGreen" }
            GradientStop { position: 1.0; color: "DarkGreen" }
        }
    }

    //Day state, for when you place a sun
    states: State {
        name: "Day"; when: window.activeSuns > 0
        PropertyChanges { target: stopA; color: "DeepSkyBlue"}
        PropertyChanges { target: stopB; color: "SkyBlue"}
        PropertyChanges { target: stars; opacity: 0 }
    }

    transitions: Transition {
        PropertyAnimation { duration: 3000 }
        ColorAnimation { duration: 3000 }
    }

    SystemPalette { id: activePalette }

    // toolbox
    Rectangle {
        id: toolbox
        z: 3 //Above ground
        color: activePalette.window;
        width: 480
        anchors { right: parent.right; top:parent.top; bottom: parent.bottom }
        Rectangle { //Not a child of any positioner
            color: "white"; border.color: "black";
            width: toolRow.width + 4
            height: toolRow.height + 4
            x: toolboxPositioner.x + toolRow.x - 2
            y: toolboxPositioner.y + toolRow.y - 2
        }
        Column {
            id: toolboxPositioner
            anchors.centerIn: parent
            spacing: 8
            Text { text: "Drag an item into the scene." }
            Row {
                id: toolRow
                spacing: 8;
                PaletteItem {
                    anchors.verticalCenter: parent.verticalCenter
                    file: "Sun.qml";
                    image: "../images/sun.png"
                }
                PaletteItem {
                    file: "GenericItem.qml"
                    image: "../images/moon.png"
                }
                PaletteItem {
                    anchors.verticalCenter: parent.verticalCenter
                    file: "PerspectiveItem.qml"
                    image: "../images/tree_s.png"
                }
                PaletteItem {
                    anchors.verticalCenter: parent.verticalCenter
                    file: "PerspectiveItem.qml"
                    image: "../images/rabbit_brown.png"
                }
                PaletteItem {
                    anchors.verticalCenter: parent.verticalCenter
                    file: "PerspectiveItem.qml"
                    image: "../images/rabbit_bw.png"
                }
            }
            Text { text: "Active Suns: " + activeSuns }
            Rectangle { width: 440; height: 1; color: "black" }
            Text { text: "Arbitrary QML: " }
            TextEdit {
                id: qmlText
                width: 460
                height: 220
                readOnly: false
                focusOnPress: true
                font.pixelSize: 14

                text: "import Qt 4.7\nImage {\n  id: smile;\n  x: 500*Math.random();\n  y: 200*Math.random(); \n  source: 'images/face-smile.png';\n  NumberAnimation on opacity { \n    to: 0; duration: 1500;\n  }\n   Component.onCompleted: smile.destroy(1500);\n}"
            }
            Button {
                text: "Create"
                onClicked: createQmlObject(qmlText.text, window, 'CustomObject');
            }
        }
    }

}