Sprites

The following information should be considered additional information to that already provided by Microsoft as part of their MakeCode Arcade Blocks Sprites Reference.

Sprite properties

The following tables provide an overview of the properties that sprites can have, grouped by the type of property.

Position properties

Property	Category	Description
x	position	The x position of the centre of the sprite on the screen.
left	position	The left most x position of the sprite on the screen.
right	position	The right most x position of the sprite on the screen.
y	position	The y position of the centre of the sprite on the screen.
top	position	The top most y position of the sprite on the screen.
bottom	position	The bottom most y position of the sprite on the screen.
stay in screen	position	When set to true, the sprite will not be allowed outside the bounds of the screen.
relative to screen	position	The sprite is drawn relative to the camera, not the world. The sprite never overlaps with other sprites or collides with obstacles. Useful for drawing static elements on the screen.
z	depth	The relative depth of the sprite. Larger z values are "higher".

Physics properties

Property	Name	Description
vx	velocity	The horizontal speed in pixels per second.
vy	velocity	The vertical speed in pixels per second.
ax	acceleration	The horizontal acceleration in pixels per second, per second.
ay	acceleration	The vertical acceleration in pixels per second, per second.
fx	friction	The friction opposing horizontal motion in pixels per second, per second. Stops applying once speed equals zero.
fy	friction	The friction opposing vertical motion in pixels per second, per second. Stops applying once speed equals zero.
bounce on wall	motion	When set to true, a sprite will bounce off of wall tiles and the edge of the tile map.

Size properties

Property	Name	Description
width	size	The width of the sprite in pixels.
height	size	The height of the sprite in pixels.
sx	size	The horizontal scaling factor of the sprite. A value of 2 is double the width.
sy	size	The vertical scaling factor of the sprite. A value of 2 is double the height.
scale	size	The scaling factor of the sprite. A value of 2 is double the size.

Ghosting

Property	Name	Description
ghost	ghost	The sprite never overlaps with other sprites, goes through walls, tile overlaps are ignored and wall hits are not detected.
ghost through sprites	ghost	The sprite will pass through other sprites and not trigger overlap events.
ghost through tiles	ghost	The sprite will not trigger events when passing over tiles.
ghost through walls	ghost	The sprite will pass through walls and not trigger wall hits.

Image and lifetime

Property	Name	Description
image	image	The sprites current image.
invisible	image	Whether the sprite is invisible or not.
lifespan	lifetime	If set, the lifespan of the sprite in milliseconds. When the life expires, the sprite is automatically destroyed.
auto destroy	lifetime	The sprite is automatically destroyed when it leaves the screen.
destroy on wall	lifetime	The sprite is automatically destroyed when colliding with wall tiles.

Examples

These mini-apps explore the sprite properties with examples. Each example is interactive and first shows the code as blocks. The buttons along the top of each example can be used to switch between the code and simulator so you can see each example work. If you want to go into the full screen editor and experiment with the code snippets, click the expand button.

Position examples

Relative to screen

In this example we have 3 sprites. The hero sprite can be moved around the playfield. The camera is set to follow the hero. The heart sprite stays in the same place. The star sprite is placed close to the hero and has the relative to screen property set. Move the player around and see how the star sprite behaves. Notice that when the player goes to the edges of the playfield (try the top-left hand side) the star sprite stays in the same place in the screen but changes relative to the hero. Download.

Physics examples

Velocity

This example demonstrates how velocity is directional by moving two sprites at the same speed but one from left to right and the other from right to left. Notice how heart has a positive x velocity whilst the bubble has a negative x velocity. The game resets every 5 seconds. Download.

This example is equivalent to the example above but demonstrates the y axis rather than the x axis. Notice how a positive y value is used to move from the top of the screen to the bottom and a negative y velocity is used to go from the bottom of the screen to the top. This is because the origin (0,0) is in the top left corner of the screen. Download.

Acceleration

This example accelerates a stationary sprite from the left hand side of the screen. Notice how the sprites sets faster and faster. The game resets every 5 seconds. Download.

This example "simulates" a dropping sprite from the top of the screen. Notice how the sprite drops faster and faster. The game resets every 5 seconds. Download.

Jumping

Example of how acceleration and velocity together can be used to make a sprite jump. This example only works with a sprite that is setup to stay within the screen. Use the Left and Right buttons to move the sprite and press A to make it jump. Download.

Friction

This example illustrates friction with a comparison to acceleration. This example only demonstrates friction in the x axis but the y axis works in exactly the same way. There are two sprites, heart and bubble, that both start with the same velocity in the x axis. The heart sprite has friction set and the bubble has acceleration set. Notice how acceleration is "directional" and continues to apply to the sprite even after it has become stationary (making it move backwards) whereas friction is not directional and stops the sprite but does not make it move backwards. Download.

Bounce on wall

This example demonstrates how the bounce on wall property interacts with velocity. The bubble sprite starts off in the middle of the screen with a velocity that takes it down and to the right. As the bubble sprite touches the edge of the screen, it automatically changes direction. Download.