Jump to content

[SOLVED] Preventing child sprites from changing their position with their parents rotation?


Recommended Posts

Hello there. ?

I have a sprite which rotates. And i have a healthbar added to that sprite as a child.

My problem is: The healthbar does what children are supposed to do! But i don't want that! ?

How to keep child sprites from rotating with their parent? I want it to always stay at the same position relative to the parents anchor.

I'm not talking about fixing its angle - that can be done by simply setting it to the negative angle of its parent each time it rotates (at least i don't know any other way).

I'm talking about its position. Is there a fixedToCamera equivalent for sprites?

If not, some math would be cool, too.

EDIT: I guess this could work with groups. But is there another way?


Link to comment
Share on other sites

39 minutes ago, samme said:

You can use transformCallback but I think that's even more complicated.

I would either use a Group or else no containers at all (and update the healthbar's position manually).

I see, thanks. For a quick fix i'm setting the healthbar's position manually for now, not having them as children of the players.
It's not so beautiful as the healthbar's position using player.update is done some time after the player''s movement (using velocity), meaning one can see how it is always 1 - 2 frames behind.

Gonna look into how a group would work here as i only have three groups yet, for the players, the bullets and the pickups.

Link to comment
Share on other sites

On 5/3/2018 at 10:33 PM, samme said:

See the preRender method in https://codepen.io/samme/pen/EwjMbG?editors=0010.

Nice, i didn't know about that handy method! ?

Unfortunately, even though it works in your example, for some reason it doesn't change the behaviour at my game. I copy the necessary parts involved in movements.

I don't know what is wrong here. I'm using Phaser-CE 2.10.3. Using position.copyFrom/To doesn't change it.

        // Movement

        if (this.keyboard.isDown(Phaser.Keyboard.A)
         || this.keyboard.isDown(Phaser.Keyboard.LEFT))
            app.player.body.velocity.x = -app.data.tanks[app.player.data.type].speed;

        if (this.keyboard.isDown(Phaser.Keyboard.D)
         || this.keyboard.isDown(Phaser.Keyboard.RIGHT))
            app.player.body.velocity.x = app.data.tanks[app.player.data.type].speed;

        if (this.keyboard.isDown(Phaser.Keyboard.W)
         || this.keyboard.isDown(Phaser.Keyboard.UP))
            app.player.body.velocity.y = -app.data.tanks[app.player.data.type].speed;

        if (this.keyboard.isDown(Phaser.Keyboard.S)
         || this.keyboard.isDown(Phaser.Keyboard.DOWN))
            app.player.body.velocity.y = app.data.tanks[app.player.data.type].speed;

        // Collision
        this.physics.arcade.overlap(this.tanks, this.bullets, app.bulletHit, null, this);
        this.physics.arcade.overlap(this.tanks, this.expBubbles, app.expBubbleCollect, null, this);

    // The preRender method is called after all Game Objects have been updated,
    // but before any rendering takes place.
        // Fix the tank's healthbar's position
            let healthbar = tank.data.healthbar;
            if (healthbar.visible)
                healthbar.x = tank.x + healthbar.data.x;
                healthbar.y = tank.y + healthbar.data.y;

                //healthbar.y += healthbar.data.y;
        }, this);


Link to comment
Share on other sites

On 5/5/2018 at 9:59 PM, samme said:

I think you need 


at the end of preRender().

Yes, almost. I tried that without success and ended up using


It seems you have to updateTransform the sprites, or group respectively, you want to change.

That stuff is not really straight forward. I would never have thought about using such a function. ?

Thanks for your help!  It now works as intended.

Link to comment
Share on other sites

2 hours ago, Bonsaiheldin said:

It seems you have to updateTransform the sprites, or group respectively, you want to change.

It's because preRender is quite late, and the transformation for the current frame has already been calculated.

Probably states need a postUpdate method for these things.

There's also 


Link to comment
Share on other sites


  • Recently Browsing   0 members

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