Yora Posted May 10, 2014 Share Posted May 10, 2014 I'm trying to create a scrolling texture visibly limited to a square area. I'm trying to get it to work by following this example: http://www.goodboydigital.com/pixijs/examples/14/ but I'm wondering if I might be working with some outdated code here as I can only get this masking example working with the pixi.dev.js version used here. Trying to get any masking interaction with the version of Pixi being used in Phaser keeps running me into problems, though it could be entirely my own fault using things incorrectly. The example code will work on its own, but when also loading the phaser.js script in the document I've ran into problems. At the moment, I'll get this error: Uncaught TypeError: undefined is not a function at the third line of code that is ran in my preloader: this.loaderEmpty = this.add.sprite(this.game.world.centerX, 285, 'loaderEmpty'); this.preloadBar = this.add.sprite(this.loaderEmpty.x - this.loaderEmpty.width/2, 285, 'loaderFull'); this.loaderEmpty.anchor.setTo(0.5, 0); // This line gives the erroror other problems when I was trying to get this to work earlier. I'd appreciate any help in understanding what's going wrong here, thanks! Link to comment Share on other sites More sharing options...
Pedro Alpera Posted May 10, 2014 Share Posted May 10, 2014 Have you seen this example in "Phaser Examples" about masking?: http://examples.phaser.io/_site/view_full.html?d=display&f=alpha+mask.js&t=alpha%20mask Yora 1 Link to comment Share on other sites More sharing options...
Yora Posted May 10, 2014 Author Share Posted May 10, 2014 Have you seen this example in "Phaser Examples" about masking?: http://examples.phaser.io/_site/view_full.html?d=display&f=alpha+mask.js&t=alpha%20mask I had given this a try too, but got the impression that I couldn't use it for the scrolling background I'm going for. It seems to create a brand new texture according to the mask rather than allow me to pan an object around behind a mask. Unless I should be calling 'bmd.alphaMask('pic', 'mask')' in the update along with the scrolling of my image to create the new texture every update? My #1 concern with something like that would be whether or not it weighs on performance. Link to comment Share on other sites More sharing options...
Pedro Alpera Posted May 10, 2014 Share Posted May 10, 2014 For a scrolling background I think it could be better to use tile sprite http://examples.phaser.io/_site/view_full.html?d=tile%20sprites&f=animated+tiling+sprite.js&t=animated%20tiling%20sprite Link to comment Share on other sites More sharing options...
valueerror Posted May 10, 2014 Share Posted May 10, 2014 i needed to place a circle mask over my whole game stage and scale it down over the exact player position when a level was finished.. after an hour trying to create a rendertexture out of the current camera view (which works - even in the update loop without noticable performance loss) and then create an alpha mask out of it (which doesnt because this function eats only "real" images) i gave up, created a black png with a transparent hole in the middle and now when i need the mask i add this as a new sprite, position it over the player and scale it down smoothly in the update function..it seems blunt but maybe this would be the easiest way to go for you too? you can test it here.. http://test.xapient.net/phaser/ALL/ finish a level Link to comment Share on other sites More sharing options...
Recommended Posts