Programming for Art:Programming for Art:

Arrays – 2DArrays – 2D

ART 315ART 315

Dr. J. R. ParkerDr. J. R. Parker

Art/Digital Media LabArt/Digital Media Lab

Lec 16 Fall 2010Lec 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: Each element ofThe array is – an array!A

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.

A

Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

Arrays of arrays

Can access elements as A[i][j] for i=0..7 and j = 0..2.

A

Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

Arrays of arrays

Here’s a simpler way to see it.

A Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

Arrays of arrays

A[1][2] = 12

In math this could be called a matrix

12

A Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

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.

12

A Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

Arrays of arrays

Advanced material: Array element A[i][j] is accessed as

A + (i*Nrows)+j

12

A Row 0Row 1Row 2

Column 0 1 2 3 4 5 6 7

Advanced Material

A + (i*Nrows)+j

12

A Row 0Row 1Row 2

0 1 2 3 4 5 6 7

12

Col 0

Col 1

Col 2

A[1][2] = A+(1*Nrows)+2 = A+3+2 = A+5

A

What Use are 2D Arrays?

An obvious item is that they can represent the screen. Each element could be a pixel

Battleship (Game)

aircraft carrier 5 battleship 4 cruiser 3 submarine 3 destroyer 2

15

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 betwo players, but this is just an example…

16

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);}

17

Convert from screen coordinates to board indices:

The board is 10x10, the screen is 300x300Each squares 30x30The first square is 0-29 in x and 0-9 in yThe second square in any row is from 30-59: screen x/30 =1Third square is from 60-89, or x/30 = 2

… and so on.

18

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.

19

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 14. Place the number of the ship in each occupied array location. Empty locations are 0, ship #1 is carrier, etc.

20

Random Setup

21

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 elementsOf 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 theGame, so it is in the initializationRoutine setup().

22

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; } }}

Game Play

The player clicks on a square and it acts like a button.

If there is a ship there, it turns redIf no ship, it turns white.When all squares of a ship are hit, ship sinksWhen all ships are sunk, game over.

Game Play

// 17 hits in the entire gameint k=0, total=17;// The 10x10 boardint [][]board = new int[10][10];// Each ship, # possible hitsint []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 Playvoid 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?

X

tic-tac-toe ...

What Use are 2D Arrays?

O X

tic-tac-toe ...

2 0 00 1 00 0 0

Minesweeper