diff options
author | Martin Jones <martin.jones@nokia.com> | 2009-10-28 03:23:49 (GMT) |
---|---|---|
committer | Martin Jones <martin.jones@nokia.com> | 2009-10-28 03:23:49 (GMT) |
commit | 8c1d6d8f3674e6e7e295df9327371a8e8573e13a (patch) | |
tree | aa0d678385c4c64b8b61a95267b603c6bae248f1 /examples | |
parent | 486eb1ccb91e239bf4440ec62c221e8af1ffddcc (diff) | |
parent | 6b089607ab4ad3b2f3f0b0b95166458f59d504f8 (diff) | |
download | Qt-8c1d6d8f3674e6e7e295df9327371a8e8573e13a.zip Qt-8c1d6d8f3674e6e7e295df9327371a8e8573e13a.tar.gz Qt-8c1d6d8f3674e6e7e295df9327371a8e8573e13a.tar.bz2 |
Merge branch 'kinetic-declarativeui' of git@scm.dev.nokia.troll.no:qt/kinetic into kinetic-declarativeui
Diffstat (limited to 'examples')
-rw-r--r-- | examples/declarative/dynamic/Button.qml | 24 | ||||
-rw-r--r-- | examples/declarative/dynamic/GenericItem.qml | 13 | ||||
-rw-r--r-- | examples/declarative/dynamic/PaletteItem.qml | 13 | ||||
-rw-r--r-- | examples/declarative/dynamic/Sun.qml | 4 | ||||
-rw-r--r-- | examples/declarative/dynamic/dynamic.qml | 94 | ||||
-rw-r--r-- | examples/declarative/dynamic/images/NOTE | 1 | ||||
-rw-r--r-- | examples/declarative/dynamic/images/moon.png | bin | 0 -> 1757 bytes | |||
-rw-r--r-- | examples/declarative/dynamic/images/rabbit_brown.png | bin | 0 -> 1245 bytes | |||
-rw-r--r-- | examples/declarative/dynamic/images/rabbit_bw.png | bin | 0 -> 1759 bytes | |||
-rw-r--r-- | examples/declarative/dynamic/images/tree_s.png | bin | 0 -> 3406 bytes | |||
-rw-r--r-- | examples/declarative/dynamic/itemCreation.js | 81 | ||||
-rw-r--r-- | examples/declarative/dynamic/sunCreation.js | 69 |
12 files changed, 183 insertions, 116 deletions
diff --git a/examples/declarative/dynamic/Button.qml b/examples/declarative/dynamic/Button.qml new file mode 100644 index 0000000..0b8b6db --- /dev/null +++ b/examples/declarative/dynamic/Button.qml @@ -0,0 +1,24 @@ +import Qt 4.6 + +Rectangle { + id: container + + property var text + signal clicked + + SystemPalette { id: activePalette; colorGroup: Qt.Active } + height: text.height + 10 + width: text.width + 20 + border.width: 1 + radius: 4 + gradient: Gradient { + GradientStop { position: 0.0; + color: if(!mr.pressed){activePalette.light;}else{activePalette.button;} + } + GradientStop { position: 1.0; + color: if(!mr.pressed){activePalette.button;}else{activePalette.dark;} + } + } + MouseRegion { id:mr; anchors.fill: parent; onClicked: container.clicked() } + Text { id: text; anchors.centerIn:parent; font.pointSize: 10; text: parent.text; color: activePalette.buttonText } +} diff --git a/examples/declarative/dynamic/GenericItem.qml b/examples/declarative/dynamic/GenericItem.qml new file mode 100644 index 0000000..10e3dba --- /dev/null +++ b/examples/declarative/dynamic/GenericItem.qml @@ -0,0 +1,13 @@ +import Qt 4.6 + +Item{ + property bool created: false + property string image + width: imageItem.width + height: imageItem.height + z: 2 + Image{ + id: imageItem + source: image; + } +} diff --git a/examples/declarative/dynamic/PaletteItem.qml b/examples/declarative/dynamic/PaletteItem.qml new file mode 100644 index 0000000..bb6036d --- /dev/null +++ b/examples/declarative/dynamic/PaletteItem.qml @@ -0,0 +1,13 @@ +import Qt 4.6 + +GenericItem { + id: itemButton + property string file + Script { source: "itemCreation.js" } + MouseRegion { + anchors.fill: parent; + onPressed: startDrag(mouse); + onPositionChanged: moveDrag(mouse); + onReleased: endDrag(mouse); + } +} diff --git a/examples/declarative/dynamic/Sun.qml b/examples/declarative/dynamic/Sun.qml index 16d9907..a9f5d40 100644 --- a/examples/declarative/dynamic/Sun.qml +++ b/examples/declarative/dynamic/Sun.qml @@ -3,9 +3,11 @@ import Qt 4.6 Image { id: sun property bool created: false + property string image: "images/sun.png" onCreatedChanged: if(created){window.activeSuns++;}else{window.activeSuns--;} - source: "images/sun.png"; + source: image; + z: 1 //x and y get set when instantiated //head offscreen diff --git a/examples/declarative/dynamic/dynamic.qml b/examples/declarative/dynamic/dynamic.qml index aea9b0f..e083a5b 100644 --- a/examples/declarative/dynamic/dynamic.qml +++ b/examples/declarative/dynamic/dynamic.qml @@ -2,8 +2,8 @@ import Qt 4.6 Item { id: window - //This is a desktop example - width: 1024; height: 480 + //This is a desktop-sized example + width: 1024; height: 512 property int activeSuns: 0 // sky @@ -33,6 +33,7 @@ Item { } } + //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"} @@ -44,71 +45,72 @@ Item { ColorAnimation { duration: 3000 } } - //TODO: Below feature needs beautification to meet minimum standards + SystemPalette { id: activePalette; colorGroup: Qt.Active } + // toolbox Rectangle { id: toolbox z: 3 //Above ground - color: "white" + 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: 1 - Sun { - id: sunButton - Script { source: "sunCreation.js" } - MouseRegion { - anchors.fill: parent; - onPressed: startDrag(mouse); - onPositionChanged: moveDrag(mouse); - onReleased: endDrag(mouse); + spacing: 8 + Text{ text: "Drag an item into the scene." } + Row{ id: toolRow + spacing: 8; + height: childrenRect.height//TODO: Put bug in JIRA when it comes back up + PaletteItem{ + anchors.verticalCenter: parent.verticalCenter + file: "Sun.qml"; + image: "images/sun.png" } - } - Text{ text: "Active Suns: " + activeSuns } - Rectangle { width: 440; height: 1; color: "black" } - Text{ text: "Arbitrary Javascript: " } - TextEdit { - id: jsText - width: 460 - height: 80 - readOnly: false - focusOnPress: true - - text: "window.activeSuns++;" - } - Rectangle { - width: 80 - height: 20 - color: "lightsteelblue" - Text{ anchors.centerIn: parent; text: "Execute" } - MouseRegion { - anchors.fill: parent; - onClicked: eval(jsText.text.toString()); + PaletteItem{ + anchors.verticalCenter: parent.verticalCenter + file: "GenericItem.qml" + image: "images/moon.png" + } + PaletteItem{ + anchors.verticalCenter: parent.verticalCenter + file: "GenericItem.qml" + image: "images/tree_s.png" + } + PaletteItem{ + anchors.verticalCenter: parent.verticalCenter + file: "GenericItem.qml" + image: "images/rabbit_brown.png" + } + PaletteItem{ + anchors.verticalCenter: parent.verticalCenter + file: "GenericItem.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: 180 + height: 220 readOnly: false focusOnPress: true + font.pixelSize: 16 - text: "import Qt 4.6\nImage { id: smile; x: 10; y: 10; \n source: 'images/face-smile.png';\n opacity: NumberAnimation{ \n running:true; to: 0; duration: 1500;\n }\n Component.onCompleted: smile.destroy(1500);\n}" + text: "import Qt 4.6\nImage { id: smile;\n x: 500*Math.random();\n y: 200*Math.random(); \n source: 'images/face-smile.png';\n opacity: NumberAnimation{ \n running:true; to: 0; duration: 1500;\n }\n Component.onCompleted: smile.destroy(1500);\n}" } - Rectangle { - width: 80 - height: 20 - color: "lightsteelblue" - Text{ anchors.centerIn: parent; text: "Create" } - MouseRegion { - anchors.fill: parent; - onClicked: {var obj=createQmlObject(qmlText.text, window, 'CustomObject'); obj.parent=window;} - } + Button { + text: "Create" + onClicked: {var obj=createQmlObject(qmlText.text, window, 'CustomObject'); obj.parent=window;} } } } diff --git a/examples/declarative/dynamic/images/NOTE b/examples/declarative/dynamic/images/NOTE new file mode 100644 index 0000000..fcd87f9 --- /dev/null +++ b/examples/declarative/dynamic/images/NOTE @@ -0,0 +1 @@ +Images (except star.png) are from the KDE project. diff --git a/examples/declarative/dynamic/images/moon.png b/examples/declarative/dynamic/images/moon.png Binary files differnew file mode 100644 index 0000000..1c0d606 --- /dev/null +++ b/examples/declarative/dynamic/images/moon.png diff --git a/examples/declarative/dynamic/images/rabbit_brown.png b/examples/declarative/dynamic/images/rabbit_brown.png Binary files differnew file mode 100644 index 0000000..ebfdeed --- /dev/null +++ b/examples/declarative/dynamic/images/rabbit_brown.png diff --git a/examples/declarative/dynamic/images/rabbit_bw.png b/examples/declarative/dynamic/images/rabbit_bw.png Binary files differnew file mode 100644 index 0000000..7bff9b9 --- /dev/null +++ b/examples/declarative/dynamic/images/rabbit_bw.png diff --git a/examples/declarative/dynamic/images/tree_s.png b/examples/declarative/dynamic/images/tree_s.png Binary files differnew file mode 100644 index 0000000..6eac35a --- /dev/null +++ b/examples/declarative/dynamic/images/tree_s.png diff --git a/examples/declarative/dynamic/itemCreation.js b/examples/declarative/dynamic/itemCreation.js new file mode 100644 index 0000000..06e67c5 --- /dev/null +++ b/examples/declarative/dynamic/itemCreation.js @@ -0,0 +1,81 @@ +var itemComponent = null; +var draggedItem = null; +var startingMouse; +var startingZ; +//Until QT-2385 is resolved we need to convert to scene coordinates manually +var xOffset; +var yOffset; +function setSceneOffset() +{ + xOffset = 0; + yOffset = 0; + var p = itemButton; + while(p != window){ + xOffset += p.x; + yOffset += p.y; + p = p.parent; + } +} + +function startDrag(mouse) +{ + setSceneOffset(); + startingMouse = { x: mouse.x, y: mouse.y } + loadComponent(); +} + +//Creation is split into two functions due to an asyncronous wait while +//possible external files are loaded. + +function loadComponent() { + if (itemComponent != null) //Already loaded the component + createItem(); + + itemComponent = createComponent(itemButton.file); + if(itemComponent.isLoading){ + component.statusChanged.connect(finishCreation); + }else{//Depending on the content, it can be ready or error immediately + createItem(); + } +} + +function createItem() { + if (itemComponent.isReady && draggedItem == null) { + draggedItem = itemComponent.createObject(); + draggedItem.parent = window; + draggedItem.image = itemButton.image; + draggedItem.x = xOffset; + draggedItem.y = yOffset; + startingZ = draggedItem.z; + draggedItem.z = 4;//On top + } else if (itemComponent.isError) { + draggedItem = null; + print("error creating component"); + print(component.errorsString()); + } +} + +function moveDrag(mouse) +{ + if(draggedItem == null) + return; + + draggedItem.x = mouse.x + xOffset - startingMouse.x; + draggedItem.y = mouse.y + yOffset - startingMouse.y; +} + +function endDrag(mouse) +{ + if(draggedItem == null) + return; + + if(draggedItem.x + draggedItem.width > toolbox.x){ //Don't drop it in the toolbox + draggedItem.destroy(); + draggedItem = null; + }else{ + draggedItem.z = startingZ; + draggedItem.created = true; + draggedItem = null; + } +} + diff --git a/examples/declarative/dynamic/sunCreation.js b/examples/declarative/dynamic/sunCreation.js deleted file mode 100644 index d9e5dce..0000000 --- a/examples/declarative/dynamic/sunCreation.js +++ /dev/null @@ -1,69 +0,0 @@ -var sunComponent = null; -var draggedItem = null; -var startingMouse; -//Until QT-2385 is resolved we need to convert to scene coordinates manually -var xOffset; -var yOffset; - -function startDrag(mouse) -{ - xOffset = toolbox.x + toolboxPositioner.x; - yOffset = toolbox.y + toolboxPositioner.y; - startingMouse = mouse; - loadComponent(); -} - -//Creation is split into two functions due to an asyncronous wait while -//possible external files are loaded. - -function loadComponent() { - if (sunComponent != null) //Already loaded the component - createSun(); - - sunComponent = createComponent("Sun.qml"); - if(sunComponent.isLoading){ - component.statusChanged.connect(finishCreation); - }else{//Depending on the content, it can be ready or error immediately - createSun(); - } -} - -function createSun() { - if (sunComponent.isReady && draggedItem == null) { - draggedItem = sunComponent.createObject(); - draggedItem.parent = window; - draggedItem.x = startingMouse.x + xOffset; - draggedItem.y = startingMouse.y + yOffset; - draggedItem.z = 4;//On top - } else if (sunComponent.isError) { - draggedItem = null; - print("error creating component"); - print(component.errorsString()); - } -} - -function moveDrag(mouse) -{ - if(draggedItem == null) - return; - - draggedItem.x = mouse.x + xOffset; - draggedItem.y = mouse.y + yOffset; -} - -function endDrag(mouse) -{ - if(draggedItem == null) - return; - - if(draggedItem.x + draggedItem.width > toolbox.x //Don't drop it in the toolbox - || draggedItem.y > ground.y){//Don't drop it on the ground - draggedItem.destroy(); - draggedItem = null; - }else{ - draggedItem.z = 1; - draggedItem.created = true; - draggedItem = null; - } -} - |