1. Board: Objects, Arrays and Pedagogy
Troy Vasiga
Lecturer, University of Waterloo
Associate Director (Computing), CEMC
October 18, 2006

2. Introduction Outline of Board Using the Board Using a Coordinate
The Board and arrays
The Board pedagogy
October 18, 2006
IBM CASCON 2006 Talk

3. Outline of the Board
The Board is an object that displays a graphical, rectangular game board which can be interacted with and manipulated.
put pegs and lines on it
remove pegs and lines from it
display text messages
interact by way of clicking
October 18, 2006
IBM CASCON 2006 Talk

4. What can you do with a Board?
Simple games
checkers, chess, go, tic-tac-toe, minesweeper, ...
Patterns and simple graphics
Elementary animation
October 18, 2006
IBM CASCON 2006 Talk

5. Why Board and not something else?
Strings are terrible objects
immutable
not much fun
Robots are good, but not very general (hard to play games or make pretty pictures)
Board provide a very general template to implement graphical interactive objects
October 18, 2006
IBM CASCON 2006 Talk

6. A first picture
October 18, 2006
IBM CASCON 2006 Talk

7. Creating a Board Just like any other real object in Java
Board b1D = new Board(10); or
Board b2D = new Board(3,5);
October 18, 2006
IBM CASCON 2006 Talk

8. Constructor Benefits You may notice that the constructor is:
simple (Have you ever tried to make a GUI from scratch in Java? Don't.)
overloaded (allows discussion of what overloaded means)
standard (all other real Java objects are created this way)
October 18, 2006
IBM CASCON 2006 Talk

9. Pegs We can place pegs on the Board by using the putPeg method:
b1D.putPeg("black", 3); or
b2D.putPeg("blue", 2,5);
October 18, 2006
IBM CASCON 2006 Talk

10. Pegs (continued) Pegs are specified by a colour and a row and column
Colours are one of:
black, white, red, orange, yellow, green, cyan, pink, blue
Row and column must be valid for the particular board
October 18, 2006
IBM CASCON 2006 Talk

11. Simple Exercise
Read in the number of rows and columns and produce the following picture (the example uses 5 rows and 6 columns):
October 18, 2006
IBM CASCON 2006 Talk

12. Solution import java.util.Scanner; public class Corners {
public static void main(String[] args)
Scanner myScanner = new Scanner(System.in);
int row=myScanner.nextInt();
int col=myScanner.nextInt();
Board b = new Board(row, col);
b.putPeg("white", 0, 0);
b.putPeg("red", 0, col-1);
b.putPeg("orange", row-1, 0);
b.putPeg("green", row-1,col-1); }
October 18, 2006
IBM CASCON 2006 Talk

13. Methods
Notice that calling methods and passing parameters is covered by the putPeg method
October 18, 2006
IBM CASCON 2006 Talk

14. Removing Pegs Pegs can be removed from the board using
b1D.removePeg(2); or
b2D.removePeg(4,2);
October 18, 2006
IBM CASCON 2006 Talk

15. Lines Lines can be drawn on the board using b2D.drawLine(0,1,3,2);
and removed using
b2D.removeLine(0,1,3,2);
October 18, 2006
IBM CASCON 2006 Talk

16. Other Board benefits Easy to make assignments!
Example: Read in the size of a square board and make the following picture:
October 18, 2006
IBM CASCON 2006 Talk

17. Loops and if statements
import java.util.Scanner;
public class SecondBoard {
public static void main(String[] args)
Scanner myScanner = new Scanner(System.in);
int size = myScanner.nextInt();
Board b = new Board(size, size);
for (int i = 0; i < size; i++)
for (int j = 0; j <= i; j++)
if (i % 2 == 0)
b.putPeg("yellow", i, j);
} else
b.putPeg("black", i, j); }
October 18, 2006
IBM CASCON 2006 Talk

18. Coordinates and Clicks
So far, we have just manipulated a Board by directly putting/removing pegs and lines
We can use the following method:
public Coordinate getClick()
A Coordinate is an object which has methods:
getRows()
getColumns()
October 18, 2006
IBM CASCON 2006 Talk

19. Exercise
Starting with a white peg in the top left corner of a 4x4 board, move the peg back and forth down each row, reversing direction when the end of the row is reached, moving one position each time the mouse is clicked.
October 18, 2006
IBM CASCON 2006 Talk

20. Solution October 18, 2006 IBM CASCON 2006 Talk public class PegMover {
public static void main(String[] args)
{ final int size = 4;
Board b2D = new Board(size,size);
int row=0, col=0, direction = 1; // will have value +1 if right, -1 if left
Coordinate c;
while (row < size && col < size && col >= 0)
b2D.putPeg("white", row, col);
c = b2D.getClick();
col = col + direction;
b2D.removePeg(row, col-direction);
if (col == size)
direction = -1;
row++; col--; }
if (col == -1)
direction = 1;
row++; col++;
October 18, 2006
IBM CASCON 2006 Talk

21. getRows(), getColumns()
Arrays
Arrays are difficult to visualize
Numerical data is not interesting to students
The Board is an array!!!
In particular, the state of the Board is known only internally to the Board. Moreover, the only accessor methods are:
getRows(), getColumns()
October 18, 2006
IBM CASCON 2006 Talk

22. Remembering state is the job of the user
One dimensional arrays correspond exactly to one dimensional board.
The colour of a peg can be stored using an integer value (or an integer value in a String array of colours)
October 18, 2006
IBM CASCON 2006 Talk

23. Exercise
Create a one-dimensional board of size 3, and each click on a cell changes the colour of the cell from white to red to black to white again. The program stops when all pegs are black.
October 18, 2006
IBM CASCON 2006 Talk

24. Solution October 18, 2006 IBM CASCON 2006 Talk public class OneD {
public static void main(String[] args)
{ Board b1D = new Board(3);
String[] colours = new String[3];
colours[0] = "white";
colours[1] = "red";
colours[2] = "black";
int[] markers = new int[3];
markers[0] = 0;
markers[1] = 0;
markers[2] = 0;
b1D.putPeg("white", 0);
b1D.putPeg("white", 1);
b1D.putPeg("white", 2);
while (markers[0] % 3 != 2 || markers[1] % 3!= 2 || markers[2] % 3 != 2)
int position = b1D.getClick().getCol();
markers[position]++;
b1D.putPeg(colours[markers[position]%3], position); }
October 18, 2006
IBM CASCON 2006 Talk

25. Pedagogical Decisions
FUN!
General
Interactive
Expandable
Capture key object-oriented ideas
Allow use of non object-oriented ideas
Method choice
October 18, 2006
IBM CASCON 2006 Talk

26. Capture key object-oriented ideas
instance variables
accessor methods
mutator methods
overloading
passing parameters (of both primitive and class type)
returning values (objects and primitive types)
parameters
October 18, 2006
IBM CASCON 2006 Talk

27. Allow use of non object-oriented ideas
conditions
repetitions
data structures
October 18, 2006
IBM CASCON 2006 Talk

28. Method choice Trade-off between user-side and implementation side
Who does the record keeping?
If all information about the Board is known, then the problem becomes algorithmic
If no information about the Board is known, then the problem becomes data structural
Algorithms+Data Structures = Programs (Dijkstra)
October 18, 2006
IBM CASCON 2006 Talk

29. Summary Board class is easy to use graphical fun pedagogically sound
free
October 18, 2006
IBM CASCON 2006 Talk