group.setDepthEach()

Set the depth of all the sprites in a group.

Sprites are drawn, when drawSprites() is executed, in order from lowest depth to highest depth. The sprites drawn later will overlay sprites drawn earlier.

If you assign a sprite to a depth that is already the depth of another sprite, that other sprite, and all other larger depth sprites, have their depths increased by one.

Examples

// Red over yellow until left mouse button is clicked.
var group1 = createGroup();
for (var i = 0; i < 5; i++) {
  group1.add(createSprite(randomNumber(0, 400), randomNumber(0, 400), 100, 100));
}
group1.setColorEach("yellow");

var group2 = createGroup();
for (var i = 0; i < 5; i++) {
  group2.add(createSprite(randomNumber(0, 400), randomNumber(0, 400), 100, 100));
}
group2.setColorEach("red");
function draw() {
  background("white");
  drawSprites();
  if (mouseDown("leftButton")  ) {
    group2.setDepthEach(0);
  }  
}

Syntax

group.setDepthEach(depth)

Returns

No return value. Changes output in the display after drawSprites() is called.

Tips

• Groups of sprites all have the same functions and you use the dot notation (combining the name of the group, followed by a dot, with the function name) to call the function for that group of sprites.
• Any changes to the properties of a sprite will not be seen until after drawSprites() is called.

Found a bug in the documentation? Let us know at documentation@code.org