For the original Super Mario Bros. lead developer, Shigeru Miyamoto, and level designer, Takashi Tezuka, used graph paper to plot out the levels and then had their team of programmers type the coordinates of every sprite in the game. That's a lot of work!
Fortunately for you, in p5play the
Tiles constructor can make
sprites on a grid based on the
positions of characters in a string!
The first input parameter is a string or array of strings, each line or string in the array representing a row of tiles.
The second and third input parameters are the x and y coordinates of the top left (first) tile in the tiles grid.
The fourth and fifth input parameters are the width and height respectively of each tile and any spacing you might want to add between tiles.
Try it out!
Try editing the "P5" brick layout.
Note that spaces " " or periods "." are used to indicate that no sprites should be made at that position on
grid. In this example, the "=" character is used for
You can change the pixel value of coordinate values for all sprites by setting
For example, the tile size is 8, then an x/y position of 1
represents 8 pixels, 2 represents 16 pixels, 3 represents
24 pixels, etc. Note this setting affects how animation coordinates are specified too.
In this mini-example grid lines are drawn purely for visual reference.
Also note that simply using the
move function with
the heading "up" causes the player to move up a
distance of 1 tile.
With just two collision rules the player can push around the blocks and blocks can push each other too. They snap to the grid after moving.
What's really nice is that you can set
tileSize on a
per sprite basis. If set for a group then all
sprites in that group will use that tile size!