Programming for Art:
Arrays – 2D
ART 315
Dr. J. R. Parker
Art/Digital Media Lab
Lec 16 Fall 2010
Arrays
We’ve looked at arrays, but all so far have
contained integers.
Of course, and array can hold any type that
can be declared.
Can have arrays of float, short, byte,
boolean, etc etc.
What about char? Sure, that too.
Arrays of arrays
An interesting idea is ‘what about an
array of arrays?
It could look like this:
A
Each element of
The array is –
an array!
Arrays of arrays
Each element of A is itself an array.
I.E. A[i] is an array
A
Arrays of arrays
For integers:
int [] []A = new int[8][3];
A
Arrays of arrays
We can think of this as 8 columns of 3
rows each.
Column
0
1
2
3
4
5 6
7
A
Row 0
Row 1
Row 2
Arrays of arrays
Can access elements as A[i][j] for i=0..7
and j = 0..2.
Column
0
1
2
3
4
5 6
7
A
Row 0
Row 1
Row 2
Arrays of arrays
Here’s a simpler way to see it.
Column
0
A
1
2
3
4
5 6
7
Row 0
Row 1
Row 2
Arrays of arrays
A[1][2] = 12
In math this could be called a matrix
Column
0
1
A
12
2
3
4
5 6
7
Row 0
Row 1
Row 2
Arrays of arrays
This is a 2D array. How is it done?
Memory, after all, is one dimensional.
We do it by mapping 2D indices onto 1D
ones.
Column
0
1
A
12
2
3
4
5 6
7
Row 0
Row 1
Row 2
Arrays of arrays
Advanced material:
Array element A[i][j] is accessed as
A + (i*Nrows)+j
Column
0
1
A
12
2
3
4
5 6
7
Row 0
Row 1
Row 2
Advanced Material
0
1
2
3
4
5
6
7
A + (i*Nrows)+j
Row 0
Row 1
Row 2
A
12
A
Col 0
Col 1
A[1][2] = A+(1*Nrows)+2
= A+3+2 = A+5
12
Col 2
What Use are 2D Arrays?
An obvious item is that they can represent
the screen. Each element could be a pixel
Battleship
aircraft carrier 5
battleship 4
cruiser 3
submarine 3
destroyer 2
(Game)
Battleship
Guess a square – B2 - if a ship is there, it is called a ‘hit’
and the space is marked.. Otherwise it is a ‘miss’.
Normally there would be
two players, but this is
just an example…
15
First stage:draw the board;
clicks check the square
// Battleships
// J Parker 2010
int row=0, col=0;
int k=0;
int [][]board = new int[10][10];
void setup ()
{
size (300, 300, P2D);
background(90,90,0);
rectMode (CENTER);
}
void draw ()
{
int i,j;
// Draw the Board
for (i=0; i<width; i+=30)
line (i, 0, i, width);
for (j=0; j<height; j+=30)
line (0, j, height, j);
}
void mousePressed()
{
row = mouseY/30;
col = mouseX/30;
rect(col*30+15, row*30+15, 30, 30);
}
16
Convert from screen coordinates to board indices:
The board is 10x10, the screen is 300x300
Each squares 30x30
The first square is 0-29 in x and 0-9 in y
The second square in any row is from 30-59:
screen x/30 =1
Third square is from 60-89, or x/30 = 2
… and so on.
17
What Use are 2D Arrays?
We need to set-up the board and record
the moves.
When a square is clicked on, check it. Is
there a ship there?
Connect the mouse clicks to a 2D array
that stores the ships.
18
Random setup is difficult
We need to:
1. Select a row and column coordinate
to start.
2. Select a direction (horizontal or vertical)
3. Check the array elements that would be
occupied by the ship (N elements, x or y)
to ensure they are empty. If not, goto 1
4. Place the number of the ship in each
occupied array location. Empty locations
are 0, ship #1 is carrier, etc.
19
Random Setup
20
Random Setup
void setup ()
{
size (300, 300, P2D);
background(90,90,0);
rectMode (CENTER);
for (int i=0; i<10; i++)
for (int j=0; j<10; j++)
board[i][j] = 0;
setupN (5, 5);
setupN (4, 4);
setupN (3, 3);
setupN (3, 2);
setupN (2, 1);
}
The nested FOR loops set all elements
Of the array that represents the board to 0.
setupN (a, b) finds a place for a ship on
the board; the ship has a elements and
is numbered b. So, setupN(5,5) sets up
the carrier.
We only do this at the beginning of the
Game, so it is in the initialization
Routine setup().
21
setupN
void setupN (int N, int label)
{
int is, js, f=0;
boolean again=true;
while(again)
{
if (random(100) < 60)
{
is = (int)random(10);
js = (int)random(10-N);
f = 1;
for (int i=0; i<N; i++)
if(board[is][js+i] != 0)
{
f = 0;
break;
}
if (f==0) continue;
again = false;
for (int i=0; i<N; i++)
board[is][js+i] = label;
} else
{
is = (int)random(10-N);
js = (int)random(10);
f = 1;
for (int i=0; i<N; i++)
if(board[is+i][js] != 0)
{
f = 0;
break;
}
if (f==0) continue;
again=false;
for (int i=0; i<N; i++)
board[is+i][js] = label;
}
}
}
22
Game Play
The player clicks on a square and it acts like
a button.
If there is a ship there, it turns red
If no ship, it turns white.
When all squares of a ship are hit, ship sinks
When all ships are sunk, game over.
Game Play
// 17 hits in the entire game
int k=0, total=17;
// The 10x10 board
int [][]board = new int[10][10];
// Each ship, # possible hits
int []ships = {0, 2, 3, 3, 4, 5};
We will subtract 1 from the
possible hits when a ship it hit,
When it reaches 0, ship is sunk.
We also subtract 1 from total. For a
hit. When total=0, game is over.
Game Play
void mousePressed()
{
int k = 0;
fill (90,90,0);
// Background color
text ("Sunk", 100, 10); // Erase
row = mouseY/30;
col = mouseX/30;
// Selected cell
fill (255,255,255);
// Set to white
if (board[row][col] == 0) // … if empty
rect(col*30+15, row*30+15, 30, 30);
else // A ship is here!
{
fill (255, 0, 0); // Set to red
rect(col*30+15, row*30+15, 30, 30);
Game Play
k = board[row][col]; // Which ship #??
if (k < 0) return;
// Empty
ships[k] -= 1;
// A hit takes away 1
total -= 1;
// From the total too
board[row][col] = -1; // -1 is not a legal
color, so will stay.
// No more hits left = sunk
if (ships[k] == 0) text ("Sunk!", 100, 10);
// All ships sunk = game over
if (total <= 0) println ("Game over.");
}
}
Here’s a trial
More Use of 2D Arrays?
tic-tac-toe ...
X
What Use are 2D Arrays?
tic-tac-toe ...
O
X
200
010
000
Minesweeper
© Copyright 2026 Paperzz