The particle system in Qt quick

This is your ticket. Pro: Blog star selection, click Vote I vote, thank you . If you have voted, you can also point oh, every day can cast a vote.

Qt Quick provides a particle system that provides four main types of QML:

• Particlesystem, particle system, which maintains a particle system related to emitters, painters, affectors, emitters, painters, affectors to play together, you have to specify the same particle System. Particlesystem
• Painters, it is responsible for rendering a particle. Particlepainter is the base class, Customparticle, Imageparticle, itemparticle are three kinds of particles that are built into Qt Quick, and are derived classes of particlepainter.
• Emitters, a launcher that can emit logic particles in a given area by Dodo posseses. The specific class is Emitter.
• Affectors, the effect device, creates effects by altering the properties of the emitted logic particles. Qt Quick has built-in effects such as age, Gravity, friction, attractor, and more.

Blowing Bubbles

Children like blowing bubbles, there are manual, take a shape like a magnifying glass in the bubble liquid dip, toot small mouth a blow, colorful bubble on the sky flying. There is also a bubble machine, automatic, shape with a gun-like, there is a switch, press on, it will not stop the launch of bubbles. Our example simulates the effect of blowing bubbles.

To use a particle system, you have to introduce a particle module:

Import Qtquick.particles 2.0

Particlesystem, Emitter, imageparticle, itemparticle, etc. are all in the particles module.

Well, create a Qt Quick App project and add a bubble picture, such as:

And then it's MAIN.QML:

Import QtQuick 2.2import Qtquick.window 2.1import qtquick.particles 2.0Window {visible:true;    width:600;    height:400;    Color: "LightBlue";    Id:root;        Rectangle {id:target;        Color: "Transparent";        WIDTH:PARENT.WIDTH/2;        height:100;        Anchors.top:parent.top;        Anchors.right:parent.right;    Anchors.margins:4;    } particlesystem {Id:particlesystem;        } Emitter {id:emitter;        System:particlesystem;        Anchors.left:parent.left;        Anchors.bottom:parent.bottom;        width:80;        height:80;        size:20;        endsize:80;        Sizevariation:10;        emitrate:20;        lifespan:4000;        lifespanvariation:200;            velocity:targetdirection {targetitem:target;            TARGETX:TARGET.WIDTH/2;            targety:0;            TARGETVARIATION:TARGET.WIDTH/2;        MAGNITUDE:ROOT.HEIGHT/3; }} imageparticle {System:partiClesystem;    Source: "Qrc:///bubble_1.png"; }}

50 lines of code, using the Particlesystem, Imageparticle, Emitter, targetdirection four classes.

The example works as follows:

I put the launcher in the lower left corner, the bubbles emitted to the top right, the edge of the side of the big, a few seconds to disappear.

Now let's explain some of the classes used.

Particlesystem

Particlesystem represents a particle system that maintains a common timeline for managing transmitters, logical particles and renderers, and effects. It provides some properties:

• Empty, Boolean value, which is set to true when the logical particles in the particle system are dead. This property can also be used to pause the particle system, but the system's timeline will still be updated.
• Paused, Boolean value, set to true, particle system paused, set to false, particle system resumes from pause point
• Running, Boolean, set to False to stop the particle system. When set to true again, those logical particles that were originally generated will be destroyed.
• Particlestates, the sprite list, the name of each sprite in the list, corresponds to the name of a particle group (particlegroup) in the particle system. A Sprite is used to define the effect applied to particle state transformations in particle groupings.
  

Particlesystem also has some methods, such as pause (), resume (), which basically correspond to attributes, to see what help means.

Emitter

Emitter is used to emit logical particles, and before launch, Emitter will define properties such as size, longevity, and so on, which can subsequently be changed by the effect device (affector). The logic particles emitted by Emitter must be linked to a specific particlepainter before they are rendered, and we can see them. Emitter, Painter, Affector have a system property that specifies their associated particlesystem, and if the system property of the three points to the same Particlesystem instance, then they are automatically associated. There is meat for everyone to eat, there is soup for everyone to drink.

Emitter similar to an ordinary Item, its width, height property can specify the size of the launch area, anchors can complete the layout. I set the 80x80 square in the example, and use the anchor layout to place the Emitter in the lower-left corner of the window.

In addition to the common Item property, Emitter has some properties related to particle emission:

• Size, the start of the particle to be emitted (in pixels), the default value is 16.
• Endsize, the size at which the particle life ends. During the lifetime of a particle, its size changes linearly from size to endsize. If the endsize is-1, the particle size is fixed and is always a size. The default value is-1.
• Sizevariation, a variable that sets the maximum range of particle size and endsize up and down, the particle system randomly generates a variable based on this value, added to the size and Endsize properties, and is used to produce particles of random size variation.
• Lifespan, lifespan, unit is milliseconds. The default is 1000 milliseconds.
• Lifespanvariation, a variable that sets the random variable range of life. The default is 0.
• Emitrate, the emission frequency, meaning how many per second. The default value is 10.
• Velocity, velocity, type is stochasticdirection, which can be one of angledirection, Pointdirection, Targetdirection, and Cumulativedirection. I understand that velocity defines the direction in which the particles are moving. I used the targetdirection in the example to let the particles run toward the top right. If you do not specify the velocity attribute, the particles are born, changed, and died in situ.

Emitter also has many other properties, please refer to Qt help to understand it.

Targetdirection

Targetdirection is a derived class of Direction, and its instance can be assigned to the velocity property of Emitter, which specifies the target location of the particles emitted by the Emitter.

Targetdirection attributes do not elaborate, see Qt help can understand the meaning, here only mention Targetitem. The Targetitem is used to specify the target location associated with the Item. In the example, I define a Rectangle object, place it at the top right of the root window, and point the Targetdirection Targetitem property to the Rectangle. When Targetitem points to a specific Item, the Targetx, targety properties are relative to the targetitem.

Imageparticle

Imageparticle is a picture particle class provided by Qt Quick, used to render images. It has a lot of properties, and in the example I use System to specify its associated particle system, using source to specify the picture it uses.

You can change the color of the picture particles (alpha, alphavariation, Redvariation, Bluevariation, greenvariation), the angle of rotation (rotation, rotationvariation, Rotationvelocity, Rotationvelocityvariation).

The EntryEffect property provides an easy way to set the entry and exit effects of a particle. The default value is Imageparticle.fade, and fade fades, that is, the transparency changes from 0 to 1 when it appears, and the opacity changes from 1 to 0 when it disappears. Our example is this kind of effect. It can also take a value of imageparticle.none (no effect) or Imageparticle.scale (from 0 to 1 when it appears, shrinking from 1 to 0 when it disappears). If you want to get better entry and exit effects, you can use Sizetable and opacitytable.

Imageparticle also has many properties that you can use to understand the Qt help.

This is your ticket. Pro: Blog star selection, click Vote I vote, thank you .

Look back at my QT Quick Series articles:

• About Qt Quick
• QML Language Basics
• Qt Quick's Hello World text
• Qt Quick Simple Tutorial
• The signal and slot of Qt Quick event processing
• Qt Quick Event Processing mouse, keyboard, timer
• Pinch scaling and rotation of Qt Quick event processing
  
• Qt Quick component and Object dynamic creation
  
• Introduction to Qt Quick layout
• Qt Quick's QML and C + + mixed programming
• Qt Quick Image Processing example of beauty 美图秀秀 (with source download)
• Qt Quick's Pathview detailed
• Qt Quick Example Digging avatar
• A file viewer for the Qt quick Synthesis instance
• QT Quick Debug Display code line number
• Qt Quick implementation of graffiti program
• Qt Quick Play GIF animation
• Drag and drop in Qt Quick (drag and drop)
• The use of Animatedsprite in Qt quick

The particle system in Qt quick