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

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.

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.


  • Recently Browsing   0 members

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