- This article is about layering of sprites in the stage. For layers in the Paint Editor, see Paint Editor#Layers.
A sprite's layer is the justification of sprites being shown in front or behind each other. A sprite with a lower layer value is shown behind a sprite with a higher layer value, so a sprite with a layer of "1" appears behind all other sprites.[1] Layering also has the effect that sprites with higher layer values will execute code first on a given frame.[2] The stage has a layer value of 0. When a sprite is created, it appears at the front, as well as when it is dragged in the project editor.
When there are a lot of sprites in a project, correct layering may become difficult due to the large number of layers.
The only way to actually view the layer value of a sprite is to analyze the JSON of a project. It has been suggested to have a block that reports a sprite's layer value.[3][4]
Monitors' Layers
A Stage Monitor always appears in front of any sprites, but may be overlapped by other monitors.[5] The layering of monitors depends on the order in which they were created and cannot be changed without editing the project JSON.
In previous versions of Scratch, monitors had a layer number like sprites and sprites could be shown in front of them using the go to front
block.
Stage's Layer
The stage always appears behind any sprites. To bypass this, some users create a sprite that fills the entire screen to act as a pseudo-stage for the project.[citation needed] That way, they can control if the "stage" appears in front of or behind certain sprites. If the stage does not contain transparent areas, the same thing can be replicated by making sprites hide.
Related Blocks
The following blocks can be used to affect this value:
go to [front v] layer
— this block sets the layer to the front or back layer.go [forward v] () layers
— this block moves the sprite backwards or forwards, allowing the sprite to fine-tune its layer value.
There are no blocks to set the layer directly, nor to report it.
Viewing the Specific Layer Value
Though not available through the Scratch user interface, the specific value of a sprite's layer can be seen through a short process.
- In the project editor, select File > Save to your computer
- At the end of the project file name, change
.sb3
to.zip
to be able to open it as a zipped folder. You might need to enable an option to show file extensions in your file manager. - After saving the zipped project, extract the files
- Open up the
project.json
file in the folder in any text editor (e.g. Notepad++) - Within the arranged codes are the layer values for each sprite and the stage. The value can be changed directly within the text editor and saved before compressing the zipped file again.
Sending a Sprite to a Specific Layer
Even though there is no block available to send a sprite to a specific layer, there is a process that can accomplish this task.
go to [back v] layer go [forward v] (1) layers
This will send the sprite to layer 2. The go to [back v] layer
block sends it to layer 1, and the go [forward v] (1) layers
block will send it forward as many layers as needed.
This can also be made into a custom block, as shown below:
define go to layer (layer number) go to [back v] layer go [forward v] ((layer number) - (1)) layers
Example Uses
As this value tells sprites where to go, it has many uses. Some example uses:
- Layering sprites in a scene.
- Creating 3D scenes.
- Displaying the terrain of a scrolling project in the background.
- Displaying menu items in front of the menu.
References
- ↑ https://github.com/scratchfoundation/scratch-vm/blob/eae24e6/src/serialization/sb3.js#L1260-L1266
- ↑ https://github.com/scratchfoundation/scratch-vm/blob/eae24e6/src/engine/runtime.js#L189-L193
- ↑ Sonickyle. (3/12/2013). "Sprite layer reporter[title]" topic:21959
- ↑ StevenTheSquare. (21/2/2020). "new sensing blocks [...] (layer)[title]" topic:387084
- ↑ https://github.com/scratchfoundation/scratch-gui/blob/04114e6/src/css/z-index.css#L12