Jump to content

define a Z-Index for specific sprite/elements.


Recommended Posts

Panda tiles the sprites in order of appearance. Last sprite comes on top of the stack. I have had this problem also and was able to solve it with different containers.

Basically you create 2 (or more) main containers and add them to the main.scene.stage. Now you can add your buttons to the top container and the other sprites to another container. (This way you create all the layers that you need).





Link to comment
Share on other sites

Here is a working code example. (You can also see it live at panda fiddler: http://vermeire.home.xs4all.nl/panda/fiddler.html

game.module(	'game.main').require(	'engine.core').body(function(){	game.addAsset('box.png');	game.addAsset('target.png');	game.createScene('Main', {			init: function() {			//Add sprite			var sprite1 = new game.Sprite('target.png', 250, 200);			this.stage.addChild(sprite1);						//Add another sprite. 			//It will be on front of the first sprite because it's the last one added to the container.  			var sprite2 = new game.Sprite('box.png', 270, 250);			this.stage.addChild(sprite2);			//Now lets rock and z-order them!			sprite1.zIndex=2;			sprite2.zIndex=1;			this.sort();		},				depthCompare: function (a,  {			if (a.zIndex < b.zIndex) return -1;			if (a.zIndex > b.zIndex) return 1;			return 0;		},				sort: function() {			//All sprites have been added to game.scene.stage.			//In order to update the zIndex, you have to sort the following list			game.scene.stage.children.sort(this.depthCompare);		}			});});
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...