Grid game

A project!

You will need

  1. Some understanding of 2D arrays

  2. A brief introduction to Java’s GUI framework, Swing

  3. A smidgen of understanding of inheritance in advance of Unit 9

The goal

Build game with graphical user interface (GUI) that is played on a grid.

Some game ideas

  • Tic Tac Toe

  • Concentration

  • Boggle

  • Minesweeper

  • Chess

  • Super Tic Tac Toe

  • ???

2D arrays

We just talked about them.

You will build some sort of game that stores its state in a 2D array.

Swing

Swing is a GUI framework built around “components”.

A UI is made up of components which can contain other components.

Your game, at least to start with, will probably be just one componenent and I will give the beginnings of the code for it.

If you end up wanting to make a more elaborate UI, talk to me and I can teach you more about Swing.

Inheritance

We will cover this properly in Unit 9 but Swing is built on it.

Basically, a class can “extend” another, called its “parent class”. This has a few consequences:

  • An instance of the new class can be used anywhere the parent class is called for.

  • The child class “inherits” methods and instance variables from its parent.

Inheritance in the starter code

The class GridGame extends JPanel which is a class that is part of the Swing framework.

This allows a GridGame to be added to a Swing app as a component.

The class Demo extends GridGame.

Thus Demo is also a Swing component.

It also inherits some useful behavior from GridGame which makes it a lot simpler.

The starter code

GUI — the class with the main method. Creates a window (JFrame) and adds a Demo component to it.

Demo — the main class you need to copy or modify. (If you copy it you’ll need to change GUI to instantiate your new class instead of Demo.)

GridGame — the workhorse. You do not need to look inside this class if you don’t want to.

What you get from GridGame

The GridGame class extends the right class to be usable in the Swing framework and provides an abstraction that lets you write code in terms of a grid of cells where each cell can be painted independently and can respond to mouse clicks.

The GridGame methods

paintCell(int row, int col, Graphics2D)

A method that you will implement to draw one cell in the grid.

Will be called when needed and the graphics object will be set up so 0,0 is at the top left of the cell and you can only draw in the cell.

cellClicked(int row, int col)

A method you will implement that will be called when the user clicks a cell in the grid.

This will also be called at the appropriate times. Your job is to make it do the appropriate thing.

after(int millis, Runnable r)

A method you can call to schedule some code to run after a certain number of milliseconds.

This one you call. See the example in Demo.

Demo

public class Demo extends GridGame {

  private Color[][] grid;

  public Demo(int rows, int columns) {
    super(rows, columns, 10);
    grid = new Color[rows][columns];
    randomizeColors();
  }

  // …
}

paintCell

public void paintCell(int row, int column, Graphics2D g) {
  g.setColor(grid[row][column]);
  g.fillRect(0, 0, cellWidth(), cellHeight());
}

The graphic object g is set up to just draw in the cell.

cellWidth and cellHeight are inherited from GridGame

cellClicked

public void cellClicked(int row, int col) {
  Color old = grid[row][col];
  grid[row][col] = randomColor();
  repaint();

  after(500, () -> {
    grid[row][col] = old; repaint();
  });
}

repaint is part of the Swing framework.

after is inherited from GridGame