ALL CODE FILES (ZIPPED) Click here
for the zipped file that contains all four guides found below. You will need to unzip the file before
being able to open the code in Processing. |
GRID GUIDE 01 – A
SIMPLE GRID In this program, we have created a simple Grid object that
is created based on location, size and number of rows and columns. |
GRID GUIDE 02 – COLOURS
IN CELLS (TILES) In this program, we have used the Grid class from the
previous example and also added a Tile class the holds the content of
individual cells. The complexity of
this program is a fair bit higher than the previous one because we now have
to work with a 2D array. |
GRID GUIDE 03 – IMAGES
IN TILES In this program, we updated the Tile class to optionally
include an image in the tile. The jump
in complexity from the previous guide to this one is actually a small one. Note that if the images have a transparent background, you
would see the tile’s background colour.
Note 2: The tiles are 64 by 64 in the example below to
match the images that are also 64 by 64 pixels. |
GRID GUIDE 04 –
CLICKABLE TILES In this program, we added new methods in both Grid and
Tile to deal with clicks. With this
extra functionality, we can now alter the Grid’s content by clicking on
it. |
GRID GUIDE 04B – MAP
BUILDER This program is a minor tweak from Guide 04. We simply changed the started colour for
the tiles to be blue and made clicked tiles become green. This creates an application similar to a
map building program. |
GRID GUIDE 05 –
SELECTED TILE (CLICK) In this program, we added a selected tile image to the
grid that shows which tile it selected.
We can change the selected tile by clicking on a different tile. |
GRID GUIDE 06 –
SELECTED TILE (ARROW KEYS) In this program, we added the ability to move the selector
square around the grid using the keyboard’s arrow keys. |