Back to Lecture index

15-111
Classwork 2 - More Fun With JPanels

Due: Friday, April 24, 2009

Introduction to This Lab

Today you'll do a lab that involves learning to use JComponents. Tic-Tac-Toe is a simple game for demonstrating JComponents and has fairly simple game logic. Some classes that extend the JComponent class are JPanel, JButton, and JLabel. Those are the only three you need to worry about for this lab. A JPanel is, on the surface, a box that you can put other JComponents in. In other words, it is a canvas where you can add other JPanels, JButtons, and JLabels. So you can have a JPanel that has two JPanels in it, both of which have JButtons and JLabels in them. There are several similiarities between the methodology for applets and the methodology for using JPanels. For example, the following class extends a JPanel and contains two JPanels inside it:
	public class GamePanel extends JPanel{
	
		JPanel leftPanel =  new JPanel();
		JPanel rightPanel = new JPanel();

		add(leftPanel);
		add(rightPanel);
	}
JPanels, like applets, can have Layouts. The syntax is the same as for applets. When you are done, it should look somewhat like this:

Getting Help

We don't expect you to do this without help. In fact, we want to help you -- a lot. That's why we're here. Please ask.

Getting Started

To help you get started, we took our TicTacToe game and deleted some of the code. We left some of the instance variables in place. Additionally, we used comments to indicate where you need to write code.

Right click TicTacToe zip file to save the files.

Suggested Approach

Driver.java sets up the JFrame that will be the game. It controls the game logic. HumanPlayer.java is the Human Player and DumbPlayer.java is the Computer Player. TicTacToe.java holds the board (matrix of int's) and has methods for manipulating this board.

In GamePanel.java, implement the constructor GamePanel (TicTacToe board). It should set up two panels, one on the left, and one on the right. The panel on the left should have two buttons and a label. The two buttons should be reset and quit. The label should be a label that will update with the game messages. The reset and quit buttons should have their own ActionListeners, so that the game can react appropriately when the user clicks the button. The panel on the right should contain 9 buttons arranged in a tic-tac-toe fashion. Hint: think GridLayout. Give them a non-white background and foreground colors. You will want a matrix of buttons (the declaration has been provided for you). Each button will need its own ActionListener, but realize that the actionPerformed method of the listener will be the same for each button. Think about what private variables you can give each ActionListener to make it "unique." Remember that you have access to the board.

When you're done and you want to try to play, here is how the game works. You are always X and you always go first. Once you click a square to play, pause and wait for the computer player to make a move. If you don't let the computer player make a move, strange game logic might occur.