Added multi-touch support to ParticleDemo

Change-Id: I77b769dcf0f9d7f005be3ff10980a985ce2f2cde
Reviewed-by: Kimmo Ollila <kimmo.ollila@digia.com>

2 files changed, 62 insertions, 34 deletions

diff --git a/QtDemo/qml/QtDemo/demos/particledemo/ParticleSysComponent.qml b/QtDemo/qml/QtDemo/demos/particledemo/ParticleSysComponent.qml
new file mode 100644
index 0000000..3c7d5ff
--- /dev/null
+++ b/QtDemo/qml/QtDemo/demos/particledemo/ParticleSysComponent.qml
@@ -0,0 +1,37 @@
+import QtQuick 2.0
+import QtQuick.Particles 2.0
+
+/**
+ * ParticleSystem component draw particles with the given color. The
+ * location of the particles depends on the given TouchPoint 'point'.
+ */
+ParticleSystem {
+    id: root
+    anchors.fill: parent
+    running: true
+
+    property color particleColor: "#ff0000"
+    property TouchPoint point: null;
+
+    Emitter {
+        id: emitter
+        lifeSpan: 500
+        emitRate: 80
+        x: root.point.x
+        y: root.point.y
+        enabled: root.point.pressed
+        size: 15
+        endSize: 25
+        sizeVariation: .5
+        velocity: AngleDirection{angle:0; angleVariation: 360; magnitude:50}
+        acceleration: AngleDirection{angle:0; angleVariation: 360; magnitude: 50}
+        shape: EllipseShape{fill:true}
+    }
+
+    ImageParticle {
+        id: imageParticle
+        source: "particle.png"
+        color: root.particleColor
+        alpha: 0.0
+    }
+}
diff --git a/QtDemo/qml/QtDemo/demos/particledemo/particledemo.qml b/QtDemo/qml/QtDemo/demos/particledemo/particledemo.qml
index c397f5b..587ca0b 100644
--- a/QtDemo/qml/QtDemo/demos/particledemo/particledemo.qml
+++ b/QtDemo/qml/QtDemo/demos/particledemo/particledemo.qml
@@ -4,42 +4,33 @@ import QtQuick.Particles 2.0
 Rectangle {
     color: "#000022"
     anchors.fill: parent
-    ParticleSystem {
-        id: system
-        anchors.fill: parent
-        running: true
-
-        Emitter {
-            id: emitter
-            lifeSpan: 500
-            emitRate: 20
-            size: 12
-            endSize: 30
-            sizeVariation: .5
-            enabled: mouseArea.pressed
-            velocity: AngleDirection{angle:0; angleVariation: 360; magnitude:100}
-            acceleration: AngleDirection{angle:0; angleVariation: 360; magnitude: 100}
-            shape: EllipseShape{fill:true}
-        }
 
-        ImageParticle {
-            source: "particle.png"
-            alpha: 0.0
-        }
-    }
+    /**
+     * Create six ParticleSysComponents for drawing particles
+     * in the place of multitouch points with the given color.
+     */
+    ParticleSysComponent{ point: point1; particleColor: "#ff0000" }
+    ParticleSysComponent{ point: point2; particleColor: "#00ff00" }
+    ParticleSysComponent{ point: point3; particleColor: "#0000ff" }
+    ParticleSysComponent{ point: point4; particleColor: "#ffffff" }
+    ParticleSysComponent{ point: point5; particleColor: "#ff00ff" }
+    ParticleSysComponent{ point: point6; particleColor: "#00ffff" }
 
-    MouseArea {
-        id: mouseArea
+    /**
+     * In this demo we only support six touch point at the same time.
+     */
+    MultiPointTouchArea {
+        id: multiPointTouchArea
         anchors.fill: parent
-        onPositionChanged: {
-            emitter.x=mouse.x
-            emitter.y=mouse.y
-        }
-
-        onPressed: {
-            emitter.x=mouse.x
-            emitter.y=mouse.y
-            emitter.burst(10)
-        }
+        minimumTouchPoints: 1
+        maximumTouchPoints: 6
+        touchPoints: [
+            TouchPoint { id: point1 },
+            TouchPoint { id: point2 },
+            TouchPoint { id: point3 },
+            TouchPoint { id: point4 },
+            TouchPoint { id: point5 },
+            TouchPoint { id: point6 }
+        ]
     }
 }