Programming for Art: Arrays – 2D

1. Programming for Art:Arrays – 2D ART 315 Dr. J. R. Parker Art/Digital Media Lab Lec 16 Fall 2010

2. 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.

3. Arrays of arrays An interesting idea is ‘what about an array of arrays? It could look like this: Each element of The array is – an array! A

4. Arrays of arrays Each element of A is itself an array. I.E. A[i] is an array A

5. Arrays of arrays For integers: int [] []A = new int[8][3]; A

6. 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

7. 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

8. Arrays of arrays Here’s a simpler way to see it. Column 0 1 2 3 4 5 6 7 Row 0 Row 1 Row 2 A

9. Arrays of arrays A[1][2] = 12 In math this could be called a matrix Column 0 1 2 3 4 5 6 7 Row 0 Row 1 Row 2 A 12

10. 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 2 3 4 5 6 7 Row 0 Row 1 Row 2 A 12

11. Arrays of arrays Advanced material: Array element A[i][j] is accessed as A + (i*Nrows)+j Column 0 1 2 3 4 5 6 7 Row 0 Row 1 Row 2 A 12

12. Advanced Material 0 1 2 3 4 5 6 7 A + (i*Nrows)+j Row 0 Row 1 Row 2 A A Col 0 Col 1 Col 2 12 A[1][2] = A+(1*Nrows)+2 = A+3+2 = A+5 12

13. What Use are 2D Arrays? An obvious item is that they can represent the screen. Each element could be a pixel

14. 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 be two 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 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.

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: • 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.

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 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().

22. setupN 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; } } } 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; }

23. 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.

24. 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.

25. 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);

26. 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."); } }

27. Here’s a trial

28. More Use of 2D Arrays? tic-tac-toe ... X

29. What Use are 2D Arrays? tic-tac-toe ... O X 2 0 0 0 1 0 0 0 0

30. Minesweeper