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

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

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

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

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

A first picture October 18, 2006 IBM CASCON 2006 Talk

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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