Sign in to follow this  
Bonsaiheldin

[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?

dontRotatePlease.png

Share this post


Link to post
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.

Share this post


Link to post
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.

    update()
    {
        // Movement
        app.player.body.velocity.set(0);

        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.
    preRender()
    {
        // Fix the tank's healthbar's position
        this.tanks.forEachAlive(function(tank)
        {
            let healthbar = tank.data.healthbar;
            if (healthbar.visible)
            {
                healthbar.x = tank.x + healthbar.data.x;
                healthbar.y = tank.y + healthbar.data.y;

                //healthbar.position.copyFrom(tank);
                //healthbar.y += healthbar.data.y;
            }
        }, this);
    }

 

Share this post


Link to post
Share on other sites
On 5/5/2018 at 9:59 PM, samme said:

I think you need 


this.tanks.updateTransform();

at the end of preRender().

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

healthbar.updateTransform();

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.

Share this post


Link to post
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 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.