Using custom layer sorting

You can sort sprites on a layer according to a custom sort function

Sometimes you may need to determine the draw order of sprites that are on the same layer using your own sort function. With WADE you can do that quite easily, just define a function that takes two parameters (two sprites a and b to compare), and returns a negative number if you want a to be behind b and a positive number otherwise. In this example, we are sorting according to the myOwnProperty property of the sprites.
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); wade.addSceneObject(dragon); var logoSprite = new Sprite('/snippets/samples/cc_logo.png', 5); var logo = new SceneObject(logoSprite); wade.addSceneObject(logo); // set a custom property for both sprites dragonSprite.myOwnProperty = 1; // try changing this to 3 logoSprite.myOwnProperty = 2; // set a custom sorting function for layer 5 wade.setLayerSorting(5, function(a, b) { return a.myOwnProperty - b.myOwnProperty; }); }; };
Your code was executed successfully!