improve connections example.

5 files changed, 32 insertions, 22 deletions

diff --git a/examples/declarative/connections/Button.qml b/examples/declarative/connections/Button.qml
new file mode 100644
index 0000000..1d46acc
--- /dev/null
+++ b/examples/declarative/connections/Button.qml
@@ -0,0 +1,12 @@
+import Qt 4.6
+
+Item {
+    id: button
+    width: 48; height: 48
+
+    property alias image: icon.source
+    signal clicked
+
+    Image { id: icon }
+    MouseRegion { anchors.fill: icon; onClicked: button.clicked() }
+}
diff --git a/examples/declarative/connections/bg1.jpg b/examples/declarative/connections/bg1.jpg
new file mode 100644
index 0000000..dfc7cee
--- /dev/null
+++ b/examples/declarative/connections/bg1.jpg
diff --git a/examples/declarative/connections/connections.qml b/examples/declarative/connections/connections.qml
index b693b7e..5dc211e 100644
--- a/examples/declarative/connections/connections.qml
+++ b/examples/declarative/connections/connections.qml
@@ -1,32 +1,30 @@
 import Qt 4.6
 
 Rectangle {
-    id: rect
-    color: "blue"
-    width: 40
-    height: 30
+    id: window; color: "#343434"
+    width: 640; height: 480
 
-    Rectangle {
-        id: dot
-        color: "red"
-        width: 3
-        height: 3
-        x: rect.width/2
-        y: rect.height/2
+    function turnLeft() {
+        image.rotation -= 90
+    }
+    function turnRight() {
+        image.rotation += 90
     }
 
-    MouseRegion {
-        id: mr
-        anchors.fill: rect
+    Image {
+        id: image; source: "bg1.jpg"; anchors.centerIn: parent; transformOrigin: Item.Center
+        rotation: Behavior { NumberAnimation { easing: "easeOutCubic"; duration: 300 } }
     }
 
-    Connection {
-        sender: mr
-        signal: "clicked(mouse)"
-        script: { 
-            color = "green";
-            dot.x = mouse.x-1;
-            dot.y = mouse.y-1;
-        }
+    Button {
+        id: leftButton; image: "rotate-left.png"
+        anchors { left: parent.left; bottom: parent.bottom; leftMargin: 10; bottomMargin: 10 }
+    }
+    Button {
+        id: rightButton; image: "rotate-right.png"
+        anchors { right: parent.right; bottom: parent.bottom; rightMargin: 10; bottomMargin: 10 }
     }
+
+    Connection { sender: leftButton; signal: "clicked()"; script: window.turnLeft() }
+    Connection { sender: rightButton; signal: "clicked()"; script: window.turnRight() }
 }
diff --git a/examples/declarative/connections/rotate-left.png b/examples/declarative/connections/rotate-left.png
new file mode 100644
index 0000000..c30387e
--- /dev/null
+++ b/examples/declarative/connections/rotate-left.png
diff --git a/examples/declarative/connections/rotate-right.png b/examples/declarative/connections/rotate-right.png
new file mode 100644
index 0000000..1b05674
--- /dev/null
+++ b/examples/declarative/connections/rotate-right.png