Scaling a group with sprites where some have masks breaks the masks

Recommended Posts

I'm working on a "fake zoom" function that looks like this:

class Zoomer extends Phaser.Group {
  zoom = (amount = { x: 1.5, y: 1.5 }) => {
    this.x = -((amount.x * ( / 2)) - ( / 2));
    this.y = - (amount.x * ( * 1.15));
    this.scale.setTo(amount.x, amount.y);

The zooming itself works and goes where I want it to but all the masks in the group stay where they are and don't scale at all.

This is how I usually create masks on a Phaser.Sprite:

  createMask() {
    const graphics =, this.y);
    graphics.drawRect(0, 0, this.width, this.height);
    this.mask = graphics;


How can I make the group scaling/repositioning include the group's sprites' masks as well?

Edited by JesperJohansson
removed tweens for less code

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

  • Recently Browsing   0 members

    No registered users viewing this page.