Using sprite sort points

Sort sprites according to an offset rather than using the center coordinates

Sometimes you want to sort sprites in a standard manner (for example using bottomToTop) sorting, but rather than comparing the center positions of the objects, you may want to compare positions that are offset from the center. The most common scenario is comparing the position of the feet of different characters. You can achieve this by setting sort points for the sprites. In this examples, we are setting a sort point for both sprites that is half their heights (which is where feet of humanoid characters would be).
App = function() { this.load = function() { wade.loadImage('/snippets/samples/dragon.png'); wade.loadImage('/snippets/samples/cc_logo.png'); }; this.init = function() { // create two objects on layer 5 var dragonSprite = new Sprite('/snippets/samples/dragon.png', 5); var dragon = new SceneObject(dragonSprite, 0, 0, -200); wade.addSceneObject(dragon); var logoSprite = new Sprite('/snippets/samples/cc_logo.png', 5); var logo = new SceneObject(logoSprite); wade.addSceneObject(logo); // set sort points dragonSprite.setSortPoint(0, 0.5); logoSprite.setSortPoint(0, 0.5); // set layer sorting to 'bottomToTop' for layer 5 wade.setLayerSorting(5, 'bottomToTop'); // move the dragon up and down dragon.moveTo(0, 200, 100); dragon.onMoveComplete = function() { var pos = this.getPosition(); this.moveTo(pos.x, -pos.y, 100); } }; };
Your code was executed successfully!