Overriding atlas resolution
when using TexturePacker and exported json file have defined scale other than 1 in meta part of the file.
READ MORE
Preloading web font into Pixi.js
Tutorial on how to preload web font directly from Google Fonts site into your Pixi project.
Font is not displayed for the first time page is loaded?
textureUnpacker
If you are looking for online version of tool, which allows you to deconstruct texture atlases created with TexturePacker (Pixi, Phaser), you just found it!
Simply load your JSON and PNG files and textureUnpacker will do the job. Supports trimmed and rotated sprites, too...
Grab the source code on GitHub
Sharp PIXI.Text
How to make your PIXI.Text look crisp at any screen resolution ?
- listen to window resize event
- grab new browser's window size
- calculate new font size for your PIXI.Text (don't forget to take window.devicePixelRatio into account)
- redraw the text
Easy, right? For better results round new font size and text position coordinates. See it in action by clicking button below and feel free to play with browser's window size
Pixi Horizontal stack
Easiest way to align Pixi elements horizontally (sprites in this example) is to extend Pixi.Container
Right click on demo page and view source to see how it's done.
Pixi.js + CSS Star Wars scroller
How to make 3D scrolling text effect with 2D rendering engine? Well, until it will be implemented into Pixi.js we can do it with little help of CSS and 3D transform.
Click button bellow to see it in action and feel free to
grab the source code on GitHub