<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- system.qdoc -->
<title>Qt Quick Particles Examples - System | Qt Quick 5.12.6</title>
<link rel="stylesheet" type="text/css" href="style/offline-simple.css" />
<script type="text/javascript">
document.getElementsByTagName("link").item(0).setAttribute("href", "style/offline.css");
// loading style sheet breaks anchors that were jumped to before
// so force jumping to anchor again
setTimeout(function() {
var anchor = location.hash;
// need to jump to different anchor first (e.g. none)
location.hash = "#";
setTimeout(function() {
location.hash = anchor;
}, 0);
}, 0);
</script>
</head>
<body>
<div class="header" id="qtdocheader">
<div class="main">
<div class="main-rounded">
<div class="navigationbar">
<table><tr>
<td >Qt 5.12</td><td ><a href="qtquick-index.html">Qt Quick</a></td><td >Qt Quick Particles Examples - System</td></tr></table><table class="buildversion"><tr>
<td id="buildversion" width="100%" align="right"><a href="qtquick-index.html">Qt 5.12.6 Reference Documentation</a></td>
</tr></table>
</div>
</div>
<div class="content">
<div class="line">
<div class="content mainContent">
<div class="sidebar"><div class="sidebar-content" id="sidebar-content"></div></div>
<h1 class="title">Qt Quick Particles Examples - System</h1>
<span class="subtitle"></span>
<!-- $$$particles/system-brief -->
<p>This is a collection of examples using Affectors in the QML particle system.</p>
<!-- @@@particles/system -->
<!-- $$$particles/system-description -->
<div class="descr"> <a name="details"></a>
<p class="centerAlign"><img src="images/qml-system-example.png" alt="" /></p><p>This is a collection of small QML examples relating to using Affectors in the particle system. Each example is a small QML file emphasizing a particular type or feature.</p>
<p>Dynamic comparison compares using the particle system to getting a similar effect with the following code that dynamically instantiates Image types.</p>
<pre class="qml">
Item {
id: fakeEmitter
function burst(number) {
while (number > 0) {
var item = fakeParticle.createObject(root);
item.lifeSpan = Math.random() * 5000 + 5000;
item.x = Math.random() * (root.width/2) + (root.width/2);
item.y = 0;
number--;
}
}
Component {
id: fakeParticle
Image {
id: container
property int lifeSpan: 10000
width: 32
height: 32
source: "qrc:///particleresources/glowdot.png"
y: 0
PropertyAnimation on y {from: -16; to: root.height-16; duration: container.lifeSpan; running: true}
SequentialAnimation on opacity {
running: true
NumberAnimation { from:0; to: 1; duration: 500}
PauseAnimation { duration: container.lifeSpan - 1000}
NumberAnimation { from:1; to: 0; duration: 500}
ScriptAction { script: container.destroy(); }
}
}
}
}
</pre>
<p>Note how the Image objects are not able to be randomly colorized.</p>
<p>Start and Stop simply sets the running and paused states of a <a href="qml-qtquick-particles-particlesystem.html">ParticleSystem</a>. While the system does not perform any simulation when stopped or paused, a restart restarts the simulation from the beginning, while unpausing resumes the simulation from where it was.</p>
<p>Timed group changes is an example that highlights the <a href="qml-qtquick-particles-particlegroup.html">ParticleGroup</a> type. While normally referring to groups with a string name is sufficient, additional effects can be done by setting properties on groups. The first group has a variable duration on it, but always transitions to the second group.</p>
<pre class="qml">
ParticleGroup {
name: "fire"
duration: 2000
durationVariation: 2000
to: {"splode":1}
}
</pre>
<p>The second group has a <a href="qml-qtquick-particles-trailemitter.html">TrailEmitter</a> on it, and a fixed duration for emitting into the third group. By placing the <a href="qml-qtquick-particles-trailemitter.html">TrailEmitter</a> as a direct child of the <a href="qml-qtquick-particles-particlegroup.html">ParticleGroup</a>, it automatically selects that group to follow.</p>
<pre class="qml">
ParticleGroup {
name: "splode"
duration: 400
to: {"dead":1}
TrailEmitter {
group: "works"
emitRatePerParticle: 100
lifeSpan: 1000
maximumEmitted: 1200
size: 8
velocity: AngleDirection {angle: 270; angleVariation: 45; magnitude: 20; magnitudeVariation: 20;}
acceleration: PointDirection {y:100; yVariation: 20}
}
}
</pre>
<p>The third group has an Affector as a direct child, which makes the affector automatically target this group. The affector means that as soon as particles enter this group, a burst function can be called on another emitter, using the x,y positions of this particle.</p>
<pre class="qml">
ParticleGroup {
name: "dead"
duration: 1000
Affector {
once: true
onAffected: worksEmitter.burst(400,x,y)
}
}
</pre>
<p>If <a href="qml-qtquick-particles-trailemitter.html">TrailEmitter</a> does not suit your needs for multiple emitters, you can also dynamically create Emitters while still using the same <a href="qml-qtquick-particles-particlesystem.html">ParticleSystem</a> and image particle</p>
<pre class="qml">
for (var i=0; i<8; i++) {
var obj = emitterComp.createObject(root);
obj.x = x
obj.y = y
obj.targetX = Math.random() * 240 - 120 + obj.x
obj.targetY = Math.random() * 240 - 120 + obj.y
obj.life = Math.round(Math.random() * 2400) + 200
obj.emitRate = Math.round(Math.random() * 32) + 32
obj.go();
}
</pre>
<p>Note that this effect, a flurry of flying rainbow spears, would be better served with <a href="qml-qtquick-particles-trailemitter.html">TrailEmitter</a>. It is only done with dynamic emitters in this example to show the concept more simply.</p>
<p>Multiple Painters shows how to control paint ordering of individual particles. While the paint ordering of particles within one ImagePainter is not strictly defined, <a href="qml-qtquick-particles-imageparticle.html">ImageParticle</a> objects follow the normal Z-ordering rules for <a href="qtquick-index.html">Qt Quick</a> items. This example allow you to paint the inside of the particles above the black borders using a pair of ImageParticles each painting different parts of the same logical particle.</p>
<p>Files:</p>
<ul>
<li><a href="qtquick-particles-system-content-dynamiccomparison-qml.html">particles/system/content/dynamiccomparison.qml</a></li>
<li><a href="qtquick-particles-system-content-dynamicemitters-qml.html">particles/system/content/dynamicemitters.qml</a></li>
<li><a href="qtquick-particles-system-content-multiplepainters-qml.html">particles/system/content/multiplepainters.qml</a></li>
<li><a href="qtquick-particles-system-content-startstop-qml.html">particles/system/content/startstop.qml</a></li>
<li><a href="qtquick-particles-system-content-timedgroupchanges-qml.html">particles/system/content/timedgroupchanges.qml</a></li>
<li><a href="qtquick-particles-system-main-cpp.html">particles/system/main.cpp</a></li>
<li><a href="qtquick-particles-system-system-pro.html">particles/system/system.pro</a></li>
<li><a href="qtquick-particles-system-system-qml.html">particles/system/system.qml</a></li>
<li><a href="qtquick-particles-system-system-qmlproject.html">particles/system/system.qmlproject</a></li>
<li><a href="qtquick-particles-system-system-qrc.html">particles/system/system.qrc</a></li>
</ul>
</div>
<!-- @@@particles/system -->
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<p>
<acronym title="Copyright">©</acronym> 2019 The Qt Company Ltd.
Documentation contributions included herein are the copyrights of
their respective owners.<br/> The documentation provided herein is licensed under the terms of the <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation License version 1.3</a> as published by the Free Software Foundation.<br/> Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property
of their respective owners. </p>
</div>
</body>
</html>
distrib
>
Mageia
>
7
>
i586
>
media
>
core-updates
>
by-pkgid
>
6e2327ca1c896c6d674ae53117299f21
>
files
>
1569
