Jump to content

Scaling particle emitters / adding them to a container


kollehel
 Share

Recommended Posts

Hi,

I tried to scale up and down the particle emitter using it's setScale (or setScaleX, setScaleY), but it's not really working. Calling the setScale(1) makes the particles being huge. I have also tried updating it's scaleX and scaleY properties, but also without any success.

Could you please show me how should it be done?

Also, I thought to add it to a container, and scale that down or up, but as I see the particle emitters can not be added to containers. Any chance for this to be implemented in the future?

Thanks,
Lehel Kolumban

Link to comment
Share on other sites

I have tried adding both the emitter and emitterManager to the container using it's add method, but both of them threw an error. Then I tried setting the emitterManager's parentContainer to an existing container, but also without any success.

Link to comment
Share on other sites

Scaling an emitter works fine, you can either scale using setScale or using a config object (which allows for more control and things like random scales, eased scales, etc)

Using setScale:

var particles = this.add.particles('crate');

var emitter = particles.createEmitter();

emitter.setPosition(400, 300);
emitter.setSpeed(200);
emitter.setScale(0.5);

Particles will be 0.5 of their texture size.

If your particles appear 'huge' at scale 1 then that is because that's the un-scaled size of their texture.

Containers cannot include emitters at the moment. We will consider adding it in a future version, however, it's not going to solve your scaling problem.

Link to comment
Share on other sites

@rich thank you for your answer. I have tried the setScale function, but it isn't exactly scaling it down as I thought it would. This is how my emitter looks like without any scale:

scale_none.JPG.5aa72889f254a9b92f2703ececa04969.JPG

This is how it looks like after setScale(0.5):

scale_05.JPG.b00df2a03fccfaa33d32bf7c41ff6af5.JPG

This is how it looks like after setScale(1):

scale_1.JPG.0e0930327272221b2aaf32e4b9667596.JPG

I have used the fireball example from lab.phaser:io:
http://labs.phaser.io/view.html?src=src\game objects\particle emitter\fireballs.js
with some small modifications:
var fireBallConfig = {
        frame: 'yellow',
        radial: false,
        x: 1200,
        y: 250,
        lifespan: 500,
        speedX: { min: -50, max: 50 },
        speedY: { min: -50, max: 50 },
        quantity: 4,
        scale: { start: 0.6, end: 0, ease: 'Power3' },
        blendMode: 'ADD', 
        on: false
    };
and moving the emitter from right to left using a tween.

What is strange is the particles seem not getting scaled down anymore after calling the setScale function of the emitter, as they should be based on the fireBallConfig.

Link to comment
Share on other sites

Yes, at the moment you'd need to calculate the scale into the values used in the config, or use one of the events (like the onEmit callback) to set a base scale in there.

Probably worth opening a feature request on GitHub to let an emitter have a baseScale, which all particles derive from.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...