Qt Quick パーティクルの例 - システム

QMLのパーティクルシステムでアフェクタを使用する例を集めたものです。

これは、パーティクルシステムでアフェクタを使うことに関連した、小さなQMLの例を集めたものです。それぞれの例は、特定のタイプや機能を強調した小さなQMLファイルです。

動的比較では、パーティクルシステムを使用する場合と、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(); }
            }
        }
    }
}

Imageオブジェクトがランダムに色付けされないことに注意してください。

Start（開始）とStop（停止）は、ParticleSystem の実行中と一時停止の状態を設定するだけです。停止中や一時停止中のシステムはシミュレーションを行いませんが、再起動はシミュレーションを最初から再開し、一時停止解除はシミュレーションを元の状態から再開します。

時限的なグループ変更は、ParticleGroup のタイプを強調する例です。通常は文字列名でグループを参照するだけで十分ですが、グループにプロパティを設定することで、さらに効果を加えることができます。最初のグループには可変期間が設定されているが、常に2番目のグループに遷移する。

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

2つ目のグループにはTrailEmitter 、3つ目のグループへの発光時間は固定です。TrailEmitter をParticleGroup の直接の子として配置することで、そのグループを自動的に選択してフォローする。

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

3番目のグループには、直接の子としてアフェクターがあり、アフェクターは自動的にこのグループをターゲットにします。アフェクタは、パーティクルがこのグループに入るとすぐに、このパーティクルの x,y 位置を使用して、別のエミッタでバースト関数を呼び出すことができることを意味します。

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

TrailEmitter が複数のエミッタのニーズに合わない場合は、同じParticleSystem とイメージパーティクルを使用しながら、動的にエミッタを作成することもできます。

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

虹の槍が飛び交うようなこのエフェクトは、TrailEmitter を使ったほうがよいことに注意してください。この例では、コンセプトをより簡単に示すために、動的なエミッタを使用しています。

Multiple Painters は、個々のパーティクルのペイント順序を制御する方法を示しています。1つの ImagePainter 内でのパーティクルのペイント順序は厳密に定義されていませんが、ImageParticle オブジェクトはアイテムの通常の Z 順序ルールに従います。 Qt Quickアイテムの通常の Z 順序ルールに従います。この例では、同じ論理パーティクルの異なる部分をそれぞれペイントする ImageParticles のペアを使用して、黒枠の上にあるパーティクルの内側をペイントできます。

プロジェクト例 @ code.qt.io

© 2025 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.