Skip to content

Instantly share code, notes, and snippets.

@agmcleod
Created December 30, 2013 06:04
Show Gist options
  • Save agmcleod/8178372 to your computer and use it in GitHub Desktop.
Save agmcleod/8178372 to your computer and use it in GitHub Desktop.

Notes on using PIXI Renderer

Assets

  • PIXI loads various image & json data only. Image data for both sprites and fonts. JSON data utilized with Texture packer for texture atlas.
  • Due to the way PIXI Sprite work, I think it would be wise to hook into the PIXI Textures similar to how phaser does it: https://github.com/photonstorm/phaser/blob/master/src/loader/Cache.js#L303. It will take some experimenting to see how to hook it properly into the loader callback. This also goes for things like tileset images, TPS, etc.

The container

We can potentially keep the container as we have it, but I'm not sure if that would really be ideal, giving the fact PIXI uses its own. This would handle various optimizations for us. But to keep entity pooling the same, we'll need to write a wrapper for it. addChild and removeChild luckily exist. For an index though, it has a separate method addChildAt as supposed to an optional parameter. Again a wrapper could handle that. me.ObjectContainer could simply become that wrapper.

The canvas API

This would be essentially gone. With the renderer object, one can access its context object, but working with it in the same way we do now might be difficult, and require more use of save & restore. Requires more experimentation to determine level of implementation that can be done. One can draw to a separate canvas and utilize that as a texture with PIXI. Such changes here would likely break anyone's game that depends on calling the context directly.

PIXI implements a graphics module, which provides a similar API. It does not provide fancy things like arc(). Scale, alpha and rotation work in the same way as being a set property.

Tilemaps

Change to use PIXI Textures for things like image layer & tilesets.

Video/Camera

Both initialization and camera API will need to use PIXI's. The camera will be its own PIXI.DisplayObjectContainer, that can be translated by changing its position property.

For auto scaling, the renderer instance has a resize function.

Animation

This one I am not sure on. Phaser seems to use a spritesheet (TPS) to determine whether something is an animation or not. We can potentially do the same, so long as we still support use of something free like shoebox.

Spine support

PIXI supports it directly, but supposedly does have some issues when bone names are the same. So keep that in mind. Will probably want to implement a wrapper.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment