Allen Posted June 22, 2016 Share Posted June 22, 2016 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? Link to comment Share on other sites More sharing options...
symof Posted June 23, 2016 Share Posted June 23, 2016 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. drhayes 1 Link to comment Share on other sites More sharing options...
Recommended Posts