Lab 5

Introduction

So, it's often times that we are brainstorming for these lab assignments at the last minute. For this assignment, everything started with this doodle:

You're going to build a program that looks like the doodle. Read on for more information about what this doodle means.

Objectives

We will concentrate on the following ideas that were discussed in class:

• Instance Variables
• Composition Relationship
• Association Relationship
• Graphics Programming
• User-interactive components

Lab Functionality Description

You will create a program that looks like the doodle. The functionality of the doodle is as follows discussing the images in the doodle from left to right:

The first column of buttons with colors scribbled on them are color buttons. When the user clicks on a button, that color becomes the "current color" for the left hand side.

The first box with a blob drawn in it is a drawing canvas that contains a shape of your choice. When the user clicks on this shape, it takes on the "current color", that is, the last color that was selected from the buttons on the left.

The column of buttons with the words swap written on them is as set of buttons with the ability to swap the two shapes' colors, dimensions, and locations - one button for each type of swap.

The second box with a blob drawn in it is also a drawing canvas that contains a shape of your choice (different from the other canvas). When the user clicks on this shape, it takes on the "current color", that is, the last color that was selected from the buttons on the right. These colors can be the same or different from the colors on the first set of buttons.

The last column of buttons with colors scribbled on them are more color buttons. When the user clicks on a button, that color becomes the "current color" for the right hand side.

Lab Tasks

Check out the lab skeleton.

Run the skeleton to see what functionality the program has so far.

Open the App class in the editor. Note that no changes need to be made to this class to finish this assignment. You should however, note the functionality that this class has.

Following the code, you can see that App creates an instance of TopLevel. Open that file in the editor. Note that the constructor of this class is filled with comments about what code you need to write in the constructor. More appropriately, the comments give you an indication of the method calls you need to make in the constructor of TopLevel (except for the first comment, which is literally a comment about a single line of code).

But, you should notice that there are no methods in TopLevel. That is correct. You need to write those methods - all five of them. Start by writing those methods with empty method bodies and calling them from the constructor. After doing that, all of your code should compile and when you run it, you should see no changes to the progam.

Then, you can begin filling in the method bodies for the methods you just wrote. However, you should not try to complete all of the functionality at this point either. Simply focus on the look and feel of the frame that appears. Don't worry at all about functionality. Code one method at a time and run the program at least after you have completed each method to see what you have on the screen. Note that you can change the background color of a JButton and it will show up that color. Also note that you can have a shape respond to mouse events by adding a MouseListener to it. See the documentation for both of these classes for more information.

Begin coding functionality. Start with either the color button functionality or the shape functionality. Each button obviously needs an action listener. The action listeners for both of these sets of elements deal with the "current color", The color buttons set the current color and the shapes use the current color information to change their own color. This is where the ColorHolder comes in. Open it to see its functionality. The ColorHolder is an object that is a repository for a color. You can set the color in it or get information about what color is being stored - that is it. You can make your buttons and your shape talk to the color holder and they can all share the information about the current color.

Then, begin coding for the swapping functionality. For swapping, you will need action listeners for those buttons as well. Those action listeners should probably call methods from TopLevel to perform the action, just like how the buttons in Lab 4 called methods on the drawing to do their work. You will need to write the appropriate methods - one for each type of swapping.

Extra Credit

You can implement some additional functionality for extra credit. However, because this is extra credit, the TAs will not be discussing how to do this in recitation - it is for those who want to further investigate ON THEIR OWN and go beyond the basic requirements.

Add another swap button that swaps the shapes on the two canvases. All other properties of the shapes should remain the same (color, dimension, location).

Instead of picking static colors for the color choices for the shapes, implement the user of a javax.swing.JColorDialog. You would still have a button for the left canvas and a button for the right canvas, but those buttons would cause a JColorDialog to appear and the user would be able to choose any color they were interested in from the dialog.

Due dates

You will submit your Lab 5 assignment using the Web-CAT submission plugin from Eclipse. Lab 5 is due on Sunday, March 21st at 11:00pm for all students.