Qt Quick Particles Exemples - Système

Voici une série d’exemples d’utilisation des Affecteurs dans le système de particules QML.

Particules circulaires aux contours noirs sur fond bleu, illustrant plusieurs peintres

Il s'agit d'une collection de petits exemples QML relatifs à l'utilisation des Affectors dans le système de particules. Chaque exemple est un petit fichier QML mettant en avant un type ou une fonctionnalité particulière.

La comparaison dynamique met en parallèle l'utilisation du système de particules et l'obtention d'un effet similaire avec le code suivant, qui instancie dynamiquement des types Image.

Item {
    id: fakeEmitter
    function burst(number) {
        while (number > 0) {
            let 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"
            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(); }
            }
        }
    }
}

Notez que les objets `Image` ne peuvent pas être colorés de manière aléatoire.

« Start » et « Stop » définissent simplement les états « en cours d’exécution » et « en pause » d’une « ParticleSystem ». Bien que le système n’effectue aucune simulation lorsqu’il est arrêté ou en pause, un redémarrage relance la simulation depuis le début, tandis que la reprise de la simulation reprend là où elle s’était arrêtée.

Les changements de groupe temporisés sont un exemple qui met en avant le type « ParticleGroup ». Bien qu’il suffise généralement de faire référence à des groupes par leur nom sous forme de chaîne de caractères, il est possible d’obtenir des effets supplémentaires en définissant des propriétés sur les groupes. Le premier groupe est doté d’une durée variable, mais effectue toujours une transition vers le deuxième groupe.

ParticleGroup {
    name: "fire"
    duration: 2000
    durationVariation: 2000
    to: {"splode":1}
}

Le deuxième groupe est doté d’un « TrailEmitter » et d’une durée fixe pour l’émission vers le troisième groupe. En plaçant l’« TrailEmitter » comme enfant direct de l’« ParticleGroup », celui-ci sélectionne automatiquement ce groupe à suivre.

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}
    }
}

Le troisième groupe a un « Affector » comme enfant direct, ce qui fait que l’affector cible automatiquement ce groupe. L’affector permet, dès que des particules entrent dans ce groupe, d’appeler une fonction « burst » sur un autre émetteur, en utilisant les positions x et y de cette particule.

ParticleGroup {
    name: "dead"
    duration: 1000
    Affector {
        once: true
        onAffected: (x, y)=> worksEmitter.burst(400,x,y)
    }
}

Si TrailEmitter ne répond pas à vos besoins en matière d’émetteurs multiples, vous pouvez également créer dynamiquement des émetteurs tout en continuant à utiliser la même ParticleSystem et la même particule d’image

for (var i = 0; i < 8; i++) {
    let 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()
}

Notez que cet effet, une rafale de lances arc-en-ciel volantes, serait mieux rendu avec « TrailEmitter ». Il est uniquement réalisé avec des émetteurs dynamiques dans cet exemple afin d’illustrer le concept plus simplement.

La section « Multiple Painters » explique comment contrôler l’ordre de peinture des particules individuelles. Alors que l’ordre de peinture des particules au sein d’un même « ImagePainter » n’est pas strictement défini, les objets « ImageParticle » suivent les règles habituelles d’ordre Z pour les Qt Quick éléments. Cet exemple vous permet de peindre l’intérieur des particules au-dessus des bordures noires à l’aide d’une paire d’ImageParticles, chacune peignant des parties différentes d’une même particule logique.

Exemple de projet @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. 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.