Drawing line on particular sprite

[Allen]

Hey guys,

I just start to phaser. I tried to develop a game that allow user using their fingers to draw/paint on some particular area of the mobile screen. So my solution is to create two layers, one is the background tile sprite, and the other one is sprite that allow user to draw on it. Here is my code:

 background = game.add.tileSprite(0, 0, 1080, 1920, 'background');
game.add.sprite(x/2, y/2, 'tree');
    bmd = game.add.bitmapData(game.width, game.height);
	bmd.addToWorld();
 game.input.addMoveCallback(paint, this);

However, when I tried to draw. I cannot particularly draw on the area of sprite.

So, is there any ways that can make the bitmapdata only apear on the sprite instead of the whole background?

[symof]

13 hours ago, Allen said:

Hey guys,

I just start to phaser. I tried to develop a game that allow user using their fingers to draw/paint on some particular area of the mobile screen. So my solution is to create two layers, one is the background tile sprite, and the other one is sprite that allow user to draw on it. Here is my code:

 background = game.add.tileSprite(0, 0, 1080, 1920, 'background');
game.add.sprite(x/2, y/2, 'tree');
    bmd = game.add.bitmapData(game.width, game.height);
	bmd.addToWorld();
 game.input.addMoveCallback(paint, this);

However, when I tried to draw. I cannot particularly draw on the area of sprite.

So, is there any ways that can make the bitmapdata only apear on the sprite instead of the whole background?

http://phaser.io/examples/v2/bitmapdata/alpha-mask is the way to approach it. You make an alpha mask off the tree and use it on the bmd so that you don't see the drawing outside it.