[Caeser]

The ParticleVPlay seems not to be starting. it throws this output

“CustomParticle: Too few particles…”

How can i create a particle effect around or in the rectangle

 

Here is the QML code

import QtQuick 2.0
import Felgo 3.0

Item {

    anchors.fill: gameWindowAnchorItem

    Rectangle {
        id: rectangle1
        color: "#ffffff"
        width: 250
        height: 250
        radius: 6
        anchors.centerIn: parent

        ParticleVPlay {
            id: fireParticle
            // Particle location properties
            x: parent.width/2
            y: parent.height/2
            rotation: 90

            // particle file
            fileName: "../particles/fireParticle.json"
            // start when finished loading
            autoStart: true
        }

        MouseArea {
            anchors.fill: parent

            onClicked: {

                // position the fire particle emitter (=origin) to the position of the mouse
                fireParticle.x = mouseX
                fireParticle.y = mouseY

                // this rotates the fire particle direction 45 degrees clockwise with every click
                fireParticle.rotation += 45

            }

            onPositionChanged: {
                // while the mouse is pressed (=dragged), also change the position
                fireParticle.x = mouseX
                fireParticle.y = mouseY
            }
        }
    }





}

 

Here is the particle json file

 

{ "FireParticle" : { "angle" : 0.0, "angleVariance" : 0.0, "duration" : 0.0, "emitterType" : 0.0, "finishColor" : "#000000", "finishColorAlpha" : 0.0, "finishColorVariance" : "#000000", "finishColorVarianceAlpha" : 0.0, "finishParticleSize" : 45.0, "finishParticleSizeVariance" : 10.0, "gravity" : "0.0, 0.0", "maxParticles" : 42.0, "maxRadius" : 0.0, "maxRadiusVariance" : 0.0, "minRadius" : 0.0, "minRadiusVariance" : 0.0, "particleLifespan" : 0.9000000000000000222, "particleLifespanVariance" : 0.2000000000000000111, "positionType" : 0.0, "radialAccelVariance" : 0.0, "radialAcceleration" : 0.0, "rotatePerSecond" : 0.0, "rotatePerSecondVariance" : 0.0, "rotationEnd" : 0.0, "rotationEndVariance" : 0.0, "rotationStart" : 0.0, "rotationStartVariance" : 0.0, "sourcePositionVariance" : "0.0, 0.0", "speed" : 85.0, "speedVariance" : 2.0, "startColor" : "#fae6e0", "startColorAlpha" : 0.6000000000000000222, "startColorVariance" : "#000000", "startColorVarianceAlpha" : 0.2000000000000000111, "startParticleSize" : 7.0, "startParticleSizeVariance" : 2.0, "tangentialAccelVariance" : 0.0, "tangentialAcceleration" : 0.0, "textureFileName" : "particleFire.png", "visible" : true, "x" : 0.0, "y" : 0.0 } }

 

 

 

 

[GüntherFelgo Team]

Hi Caeser!

Based on the error message and your code, I guess that the particle definition (json + png) is not found.

Is your particles folder maybe located in the root directory besides the qml and assets folder?
By default, only the qml and assets folder are packaged along with the application. This setting is configured in the *.pro configuration of your project, e.g. for the assets folder:

assetsFolder.source = assets
DEPLOYMENTFOLDERS += assetsFolder

Please try putting your particle definition files within the assets or qml folder, or add

particlesFolder.source = particles
DEPLOYMENTFOLDERS += particlesFolder

to the pro file of your project to make sure they are included when compiling the application.

 

Best,
Günther

 

[Caeser]

Hi Günther,

I tried adding the particles folder into the root directory then changing the .pro file adding the particle folder. It works now. Cool

But what do you normally recommend! adding the particle folder to the root or adding it within the assests or qml folder.

If I add them in the assests or qml folder,  is this file name location correct for the ParticleVPlay

” fileName: “../particles/fireParticle.json””

 

Thanks

 

[Caeser]

Günther,

For now I will use the particle folder outside will change it when publishing the game.

How can I make the particle to surround a rectangle  like a glow. how can a particle glow all around a Qml rectangle or image?

 

[GüntherFelgo Team]

The fileName location is always relative to the QML file you are currently editing.

So if you are in qml/Main.qml, you can access the assets folder with ../assets/<file-location>. If you have your QML files organized with sub-folders (e.g. qml/entities/ParticleEntity.qml) you would need to specify ../../assets/<file-location> in the ParticleEntity.qml, and so on.
If your particles folder is in your qml folder, you are able to access it just with particles/<particle-file-location> in the Main.qml.

I would recommend to place the particles either in the qml or assets folder, as this is the default folder structure for Felgo projects and no additional .pro setup is required.

Best,
Günther

 

[Caeser]

Meanwhile there is another issue. the Particle effect is only working on the desktop build.  When I run the game on my Android device its not working, it does not throw an error output.

 

[GüntherFelgo Team]

Hi Caeser,

please simply put the particle files in the assets folder for now to avoid any troubles with a custom particles DEPLOYMENTFOLDER.

Then try to create a fresh and clean build:
– Delete the build directory
– Right click on the project in Qt Creator and select Clean
– Right click again and select “Run qmake”
– Deinstall the previous version of the app on your device
– Build and Run the project
Does the effect work now? I successfully used the particle effect of your post on both iOS and Android (also with a custom DEPLOYMENTFOLDER).

[Caeser]

Hi,

I have performed all the steps above, even managed to add the particles to the assets folder. but unfortunately it fails to run my Android device and only runs on Desktop

 

[GüntherFelgo Team]

Which device are you using for testing?
Also, please send your project to support@felgo.com so we can have a look at the source code.

Best,
Günther

[Caeser]

I have sent the email to the support team.

[GüntherFelgo Team]

Hi Caeser!

I received your project and found the problem: In contrast to your desktop environment, the Android FileSystem is case sensitive. The particle JSON file is named FireParticle.json, while you refer to it as fireParticle.json (lowercase first letter) in your QML, which results in Android not finding the file.

Please either rename the file or set the correct fileName in the QML, then you should also see the particle on Android.

Best,
Günther

[Caeser]

Awesome works like a charm after renaming the file.  Thanks

Just as a hit, how can I make the particle start moving around a shape for example the rectangle?

 

 

[GüntherFelgo Team]

You can use QML Animations to animate the particle position any way you want, in the same way you can animate the properties of other QML items.