Problem with mask of image

Phaser 3
1

Hello, dear community! I need your help with making a mask of an image. Finally, I want to achieve mask animation like that

And I made it

this.rewardImage = scene.add.image(0, 0, image);
this.rewardImageCover = scene.add.image(0, 0, image).setTint(0xff0000);
this.maskRect = scene.add
	.rectangle(0, 0, 880, 256, 0x000000)
	.setVisible(false);
this.add([this.rewardImage, this.rewardImageCover, this.maskRect]);

let mask = this.maskRect.createGeometryMask();

this.rewardImageCover.setMask(mask);

scene.add.existing(this);

but the problem is that I made it in a container. The container was animated, and its position was changed. So, the mask does not cover the image

Any suggestions on how to fix this?

2
1 Like
3

As always, thank you!