From dbe4d2010816f1f22f48f3f5bce0d15d3ad7a7e2 Mon Sep 17 00:00:00 2001 From: Alan Alpert Date: Tue, 17 Jul 2012 18:32:16 +1000 Subject: [PATCH] Particle example restyling For self-contained particle systems, placing them inside the ParticleSystem element is encouraged. Change-Id: Iafc5a94bb07c4c0dac0daec300d01e0fde165146 Reviewed-by: Yann Bodson Reviewed-by: Alan Alpert --- examples/demos/maroon/content/GameOverScreen.qml | 70 +++--- examples/demos/maroon/maroon.qml | 53 ++--- examples/particles/affectors/content/attractor.qml | 257 ++++++++++----------- .../particles/affectors/content/customaffector.qml | 215 +++++++++-------- examples/particles/affectors/content/friction.qml | 111 +++++---- .../particles/affectors/content/turbulence.qml | 146 ++++++------ .../particles/emitters/content/maximumemitted.qml | 53 ++--- .../emitters/content/shapeanddirection.qml | 100 ++++---- .../particles/emitters/content/trailemitter.qml | 239 +++++++++---------- 9 files changed, 604 insertions(+), 640 deletions(-) diff --git a/examples/demos/maroon/content/GameOverScreen.qml b/examples/demos/maroon/content/GameOverScreen.qml index d4a67a2..343bd7a 100644 --- a/examples/demos/maroon/content/GameOverScreen.qml +++ b/examples/demos/maroon/content/GameOverScreen.qml @@ -55,50 +55,44 @@ Item { } ParticleSystem { - id: particles - } - - ImageParticle { - id: cloud anchors.fill: parent - system: particles - source: "gfx/cloud.png" - alphaVariation: 0.25 - opacity: 0.25 - smooth: true - } + ImageParticle { + id: cloud + source: "gfx/cloud.png" + alphaVariation: 0.25 + opacity: 0.25 + smooth: true + } - Wander { - system: particles - anchors.fill: parent - xVariance: 100; - pace: 1; - } + Wander { + xVariance: 100; + pace: 1; + } - Emitter { - id: cloudLeft - system: particles - width: 160 - height: 160 - anchors.right: parent.left - emitRate: 0.5 - lifeSpan: 12000 - velocity: PointDirection{ x: 64; xVariation: 2; yVariation: 2 } - size: 160 - } + Emitter { + id: cloudLeft + width: 160 + height: 160 + anchors.right: parent.left + emitRate: 0.5 + lifeSpan: 12000 + velocity: PointDirection{ x: 64; xVariation: 2; yVariation: 2 } + size: 160 + } - Emitter { - id: cloudRight - system: particles - width: 160 - height: 160 - anchors.left: parent.right - emitRate: 0.5 - lifeSpan: 12000 - velocity: PointDirection{ x: -64; xVariation: 2; yVariation: 2 } - size: 160 + Emitter { + id: cloudRight + width: 160 + height: 160 + anchors.left: parent.right + emitRate: 0.5 + lifeSpan: 12000 + velocity: PointDirection{ x: -64; xVariation: 2; yVariation: 2 } + size: 160 + } } + Text { visible: gameCanvas != undefined text: "You saved " + gameCanvas.score + " fishes!" diff --git a/examples/demos/maroon/maroon.qml b/examples/demos/maroon/maroon.qml index c3b736b..9511a0f 100644 --- a/examples/demos/maroon/maroon.qml +++ b/examples/demos/maroon/maroon.qml @@ -56,42 +56,37 @@ Item { ParticleSystem { id: particles - } - - ImageParticle { - id: bubble - anchors.fill: parent - system: particles - source: "content/gfx/catch.png" - opacity: 0.25 - smooth: true - } - Wander { - system: particles anchors.fill: parent - xVariance: 25; - pace: 25; - } - Emitter { - id: fire - system: particles + ImageParticle { + id: bubble + anchors.fill: parent + source: "content/gfx/catch.png" + opacity: 0.25 + smooth: true + } - width: parent.width - height: 150 - anchors.bottom: parent.bottom - anchors.bottomMargin: 3 - startTime: 15000 + Wander { + xVariance: 25; + pace: 25; + } - emitRate: 2 - lifeSpan: 15000 + Emitter { + width: parent.width + height: 150 + anchors.bottom: parent.bottom + anchors.bottomMargin: 3 + startTime: 15000 - acceleration: PointDirection{ y: -6; xVariation: 2; yVariation: 2 } + emitRate: 2 + lifeSpan: 15000 - size: 24 - sizeVariation: 16 - } + acceleration: PointDirection{ y: -6; xVariation: 2; yVariation: 2 } + size: 24 + sizeVariation: 16 + } + } } Column { diff --git a/examples/particles/affectors/content/attractor.qml b/examples/particles/affectors/content/attractor.qml index 71e66a0..797270f 100644 --- a/examples/particles/affectors/content/attractor.qml +++ b/examples/particles/affectors/content/attractor.qml @@ -50,150 +50,141 @@ Rectangle { source: "../../images/finalfrontier.png" anchors.centerIn:parent } - Emitter { - group: "stars" - system: particles - emitRate: 40 - lifeSpan: 4000 - enabled: true - size: 30 - sizeVariation: 10 - velocity: PointDirection { x: 220; xVariation: 40 } - height: parent.height - } - Emitter { - group: "roids" - system: particles - emitRate: 10 - lifeSpan: 4000 - enabled: true - size: 30 - sizeVariation: 10 - velocity: PointDirection { x: 220; xVariation: 40 } - height: parent.height - } ParticleSystem { id: particles anchors.fill: parent - } - ImageParticle { - id: stars - groups: ["stars"] - system: particles - source: "../../images/star.png" - color: "white" - colorVariation: 0.1 - alpha: 0 - } - ImageParticle { - id: roids - groups: ["roids"] - system: particles - sprites: Sprite { - id: spinState - name: "spinning" - source: "../../images/meteor.png" - frameCount: 35 - frameDuration: 60 + + Emitter { + group: "stars" + emitRate: 40 + lifeSpan: 4000 + enabled: true + size: 30 + sizeVariation: 10 + velocity: PointDirection { x: 220; xVariation: 40 } + height: parent.height } - } - ImageParticle { - id: shot - groups: ["shot"] - system: particles - source: "../../images/star.png" + Emitter { + group: "roids" + emitRate: 10 + lifeSpan: 4000 + enabled: true + size: 30 + sizeVariation: 10 + velocity: PointDirection { x: 220; xVariation: 40 } + height: parent.height + } + ImageParticle { + id: stars + groups: ["stars"] + source: "../../images/star.png" + color: "white" + colorVariation: 0.1 + alpha: 0 + } + ImageParticle { + id: roids + groups: ["roids"] + sprites: Sprite { + id: spinState + name: "spinning" + source: "../../images/meteor.png" + frameCount: 35 + frameDuration: 60 + } + } + ImageParticle { + id: shot + groups: ["shot"] + source: "../../images/star.png" - color: "#0FF06600" - colorVariation: 0.3 - } - ImageParticle { - id: engine - groups: ["engine"] - system: particles - source: "../../images/particle4.png" + color: "#0FF06600" + colorVariation: 0.3 + } + ImageParticle { + id: engine + groups: ["engine"] + source: "../../images/particle4.png" - color: "orange" - SequentialAnimation on color { - loops: Animation.Infinite - ColorAnimation { - from: "red" - to: "cyan" - duration: 1000 - } - ColorAnimation { - from: "cyan" - to: "red" - duration: 1000 + color: "orange" + SequentialAnimation on color { + loops: Animation.Infinite + ColorAnimation { + from: "red" + to: "cyan" + duration: 1000 + } + ColorAnimation { + from: "cyan" + to: "red" + duration: 1000 + } } - } - colorVariation: 0.2 - } - //! [0] - Attractor { - id: gs; pointX: root.width/2; pointY: root.height/2; strength: 4000000; - system: particles - affectedParameter: Attractor.Acceleration - proportionalToDistance: Attractor.InverseQuadratic - } - //! [0] - Age { - system: particles - x: gs.pointX - 8; - y: gs.pointY - 8; - width: 16 - height: 16 - } - Rectangle { - color: "black" - width: 8 - height: 8 - radius: 4 - x: gs.pointX - 4 - y: gs.pointY - 4 - } + colorVariation: 0.2 + } + //! [0] + Attractor { + id: gs; pointX: root.width/2; pointY: root.height/2; strength: 4000000; + affectedParameter: Attractor.Acceleration + proportionalToDistance: Attractor.InverseQuadratic + } + //! [0] + Age { + x: gs.pointX - 8; + y: gs.pointY - 8; + width: 16 + height: 16 + } + Rectangle { + color: "black" + width: 8 + height: 8 + radius: 4 + x: gs.pointX - 4 + y: gs.pointY - 4 + } - Image { - source:"../../images/rocket2.png" - id: ship - width: 45 - height: 22 - //Automatic movement - SequentialAnimation on x { - loops: -1 - NumberAnimation{to: root.width-45; easing.type: Easing.InOutQuad; duration: 2000} - NumberAnimation{to: 0; easing.type: Easing.OutInQuad; duration: 6000} + Image { + source:"../../images/rocket2.png" + id: ship + width: 45 + height: 22 + //Automatic movement + SequentialAnimation on x { + loops: -1 + NumberAnimation{to: root.width-45; easing.type: Easing.InOutQuad; duration: 2000} + NumberAnimation{to: 0; easing.type: Easing.OutInQuad; duration: 6000} + } + SequentialAnimation on y { + loops: -1 + NumberAnimation{to: root.height-22; easing.type: Easing.OutInQuad; duration: 6000} + NumberAnimation{to: 0; easing.type: Easing.InOutQuad; duration: 2000} + } } - SequentialAnimation on y { - loops: -1 - NumberAnimation{to: root.height-22; easing.type: Easing.OutInQuad; duration: 6000} - NumberAnimation{to: 0; easing.type: Easing.InOutQuad; duration: 2000} + Emitter { + group: "engine" + emitRate: 200 + lifeSpan: 1000 + size: 10 + endSize: 4 + sizeVariation: 4 + velocity: PointDirection { x: -128; xVariation: 32 } + height: ship.height + y: ship.y + x: ship.x + width: 20 + } + Emitter { + group: "shot" + emitRate: 32 + lifeSpan: 1000 + enabled: true + size: 40 + velocity: PointDirection { x: 256; } + x: ship.x + ship.width + y: ship.y + ship.height/2 } - } - Emitter { - group: "engine" - system: particles - emitRate: 200 - lifeSpan: 1000 - size: 10 - endSize: 4 - sizeVariation: 4 - velocity: PointDirection { x: -128; xVariation: 32 } - height: ship.height - y: ship.y - x: ship.x - width: 20 - } - Emitter { - group: "shot" - system: particles - emitRate: 32 - lifeSpan: 1000 - enabled: true - size: 40 - velocity: PointDirection { x: 256; } - x: ship.x + ship.width - y: ship.y + ship.height/2 } } diff --git a/examples/particles/affectors/content/customaffector.qml b/examples/particles/affectors/content/customaffector.qml index 8f634fb..4ddfc48 100644 --- a/examples/particles/affectors/content/customaffector.qml +++ b/examples/particles/affectors/content/customaffector.qml @@ -50,127 +50,118 @@ Item { anchors.fill: parent } ParticleSystem { - id: sys - } - Emitter { - system: sys - width: parent.width - emitRate: 4 - lifeSpan: 14000 - size: 80 - velocity: PointDirection { y: 60 } - } - Wander { - system: sys anchors.fill: parent - anchors.bottomMargin: 100 - xVariance: 60 - pace: 60 - } + Emitter { + width: parent.width + emitRate: 4 + lifeSpan: 14000 + size: 80 + velocity: PointDirection { y: 60 } + } + Wander { + anchors.fill: parent + anchors.bottomMargin: 100 + xVariance: 60 + pace: 60 + } - //! [0] - Affector { - system: sys - property real coefficient: 0.1 - property real velocity: 1.5 - width: parent.width - height: parent.height - 100 - onAffectParticles: { - /* //Linear movement - if (particle.r == 0) { - particle.r = Math.random() > 0.5 ? -1 : 1; - }else if (particle.r == 1) { - particle.rotation += velocity * dt; - if(particle.rotation >= maxAngle) - particle.r = -1; - }else if (particle.r == -1) { - particle.rotation -= velocity * dt; - if(particle.rotation <= -1 * maxAngle) - particle.r = 1; - } - */ - //Wobbly movement - for (var i=0; i 0.5 ? -1 : 1; + } else if (particle.r == 1) { + particle.rotation += velocity * dt; + if (particle.rotation >= maxAngle) + particle.r = -1; + } else if (particle.r == -1) { + particle.rotation -= velocity * dt; + if (particle.rotation <= -1 * maxAngle) + particle.r = 1; + } + */ + //Wobbly movement + for (var i=0; i