Fall 2007ACS-1903 BlueJ Ron McFadyen Lab 1: Using BlueJ at UofW The purpose of this lab is to give you some experience with BlueJ. Over the course of the term, in classes and in labs, you will be given more instruction. In this lab you will see how to: Start BlueJ Open a BlueJ project (a Java program) Save the BlueJ project using a new name Compile and run a Java program Interact with an object system by sending messages Modify a Java program and compile a Java class 1903 Fall 2007

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Lab 1, details: We discuss a particular example that comes with the BlueJ installation called shapes. The example deals with objects that are squares, triangles and circles. As you will see, we design object-oriented systems so objects have specific responsibilities and will respond to specific commands or messages. We examine some Java program instructions in the Triangle class in detail. You are asked to review the Circle and Square classes on your own. We will not discuss the Canvas class. Its responsibilities are to draw or repaint the images we see on the screen. You will compile the shapes classes and interact with Java classes and objects. As shapes is an interactive program, you will be asked to send specific messages. Lastly, you are asked to make a change to the Triangle class to experience modifying a program and verifying your changes.

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Student Identification Student number Last name First name Workstation user id address ______________________ Include this slide with your answers to lab questions

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Starting BlueJ Logon to a workstation in 3D03 or 3C13 (you may need specific logon information from your lab demonstrator). Click Start, then click on Programs, then click on BlueJ, and then click the BlueJ program Start >> Programs >> BlueJ >> BlueJ

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Open the shapes project that can be found in a folder named blueJExamples on the H drive. The diagram shown on the right illustrates the classes that comprise the Java program. We will pay special attention to the Triangle, Square and Circle classes in this tutorial. Opening a Java Project/Program Project>>Open Project>>

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Click the Project menu, and select Save As. Choose a new name and location to save your work and your work will not affect the original copy of shapes Saving as a Different a Java Project/Program Project>>Save As >>

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW What drive have you used for your copy of shapes? Answer: What directory or folder have you used? Answer: What name did you give your copy of shapes? Answer: Saving as a Different a Java Project/Program

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Double-click on the orange rectangle named Triangle. This action opens the class editor. Reviewing the Java Program Double-click You can view the Java classes by double-clicking on each of the four classes shown in the class pane.

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Examine the code on your workstation, and note the following : You should see coloured text in use: some red, some blue, etc. BlueJ uses colour to denote special aspects of the code. The first line is a Java import statement. import java.awt.*; In this case the program is stating that it will use a Java library known as awt. The editor shows the word import is in red because it is keyword (this keyword informs the Java compiler of the Java library that is needed). Reviewing the Triangle class

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW The blue-coloured text is used for comments. Comments are not executed by the computer. Comments are used to guide humans when they read the program code. As such, comments should be explanatory. Reviewing the Triangle class /** * A triangle that can be manipulated and that draws itself on a canvas. * Kolling and David J. Barnes 1.0 (15 July 2000) */

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Following the comments we have just discussed, you will see the beginning of the Triangle class. A class always begins with the key words public class followed by its name; in this case the class is named Triangle. The above partial listing shows the attributes in Triangle. These attributes will hold values that describe a particular triangle (its height, width, position, etc). Reviewing the Triangle class public class Triangle { private int height; private int width; private int xPosition; private int yPosition; private String color; private boolean isVisible;

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Following the lines giving the name of the class and its attributes, we see a method that is used whenever we ask for an instance of the Triangle to be created. Reviewing the Triangle class /** * Create a new triangle at default position with default color. */ public Triangle() { height = 30; width = 40; xPosition = 50; yPosition = 15; color = "green"; isVisible = false; } Later on we will ask for a triangle to be instantiated… when we do, it is the above Java code that will execute. From the above you know the height, width, and positioning co- ordinates, amongst other things for the triangle that is created.

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Where do new triangles position themselves when they are instantiated? Answer: What colour is given to a newly instantiated triangle? Answer: How high is a newly instantiated triangle? Answer: How wide is a newly instantiated triangle? Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Following the “constructor” method just described, we have several methods which in this example begin with the words public void followed by the name of the method. Each method defines a responsibility that an object has, or a capability it has. In this example you will see that a triangle can make itself visible make itself invisible move to the right move to the left … The programmer that designed shapes decided that triangles should be responsible for making themselves visible and invisible, moving themselves right, left, up, or down on the screen. As you will see, we can ask a triangle to do these things. Reviewing the Triangle class

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW What things can we ask a triangle to do? (The answer is the names of its methods) Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW At this time it is only important that you realize a class may have many methods and that each is designed for a specific purpose: to become visible, to become invisible, to move up, etc. Do not be concerned with exactly how each of those is done… that will come later on in the course. There is a concept called anthropomorphism that is important for object programming. (Consult a dictionary if needed, or wikipedia.) Java programmers will design systems with classes where each method is some responsibility that an object of that class is responsible for.dictionary wikipedia Consider an ordinary office where people are employed and each person is given specific responsibilities. When asked, a person will perform a particular duty such as completing an invoice, issuing a cheque and so on. The same principle is applied to object-oriented computing systems. After exploring the Triangle class, we know that triangles can be asked to do very specific things. We’ll look at that now… Reviewing the Triangle class

Fall 2007ACS-1903 BlueJ Ron McFadyen Fall 2007 Lab 1: Using BlueJ at UofW Before we can run a Java program we must compile it. This is a process that creates an execuable form of a program. At the BlueJ screen where we see the four classes, we need to select Compile from the Tools menu item. Compiling a Java Program Tools >> Compile When the compile is done you will see the message

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Let’s create a triangle …. Remember the constructor method – the triangle will initially be invisible and so we will ask it make itself visible. The next few slides show the screens discussed below. Begin by right-clicking the Triangle class and choose newTriangle(). You will be asked to name the triangle (or you can go with the default name of triangle1.) When you click OK for naming the triangle you will see a red object appear on your screen indicating that you have instantiated an object. Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Interacting with the shapes program Right-clicking on a class presents a selection of possibilities … choose newTriangle()

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW The result of creating a triangle. Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Right-click on an object and the messages it can respond to are shown. Choose makeVisible(). Interacting with the shapes program After selecting makeVisible() look at the bottom of your screen. You should see a new button, click it and you will see how Canvas is displaying your program results. See the next slide.

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Interacting with the shapes program After selecting makeVisible() look at the bottom of your screen. You should see a new button, Click it and you will see how Canvas is displaying your program results. See the next slide.

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW A triangle was created, it was made visible, and the output becomes viewable by clicking on Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW What happens when you instantiate a second triangle and make it visible? Answer: If two triangles occupy the same space (and so it appears as though only one is there), how can you make the two triangles both visible? Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW So far we have only considered the Triangle class. Examine the Square and Circle classes. To do this you must double-click the Square and Circle classes. Find the “constructor” methods named Square() and Circle(). Where do new squares position themselves when they are instantiated? Answer: Where do new circles position themselves when they are instantiated? Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW What things can a square do? (look for the other methods – those sections of code beginning public void …. Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW What things can a circle do? (look for the other methods – those sections of code beginning public void …. Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Now… make a square. Make it visible. Can you align it directly under the triangle? You may need to use the moveHorizontal() message and give it a specific distance to move. Don’t hesitate to experiment. Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW To instantiate a square and have it align directly under the triangle, you needed to send various messages asking for certain things to be done. What were these messages? Answer: Interacting with the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW As you progress in this course you will modify programs and you will create programs. Let’s start with something easy. Let’s modify the code for Triangle so that a triangle is yellow instead of green when a triangle is instantiated. We begin by opening the class editor for the Triangle class by double-clicking the orange rectangle with the name Triangle. Modifying the shapes program Double-click

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Below is the code relating to the construction of a new triangle. Look at the second last Java line. We must modify that line and then recompile the Triangle class. Then we can test our change and determine if we have made the change correctly or not. /** * Create a new triangle at default position with default color. */ public Triangle() { height = 30; width = 40; xPosition = 50; yPosition = 15; color = “green"; isVisible = false; } We need to change the word green to yellow. Note that it is only by chance the word green is shown in green-coloured text. Modifying the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Once the change has been made you must choose the /** * Create a new triangle at default position with default color. */ public Triangle() { height = 30; width = 40; xPosition = 50; yPosition = 15; color = “yellow"; isVisible = false; } We need to change the word green to yellow Modifying the shapes program

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Once the change has been made you must Compile the class. Modifying the shapes program After clicking Compile you should see the message “Class compiled – no syntax errors” at the bottom of the screen. You test your changes by instantiating triangles and seeing the new colour! See next slide.

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Modifying the shapes program Two triangles, one circle, one square. Note that one triangle was moved as both were positioned at the same coordinates.

Fall 2007ACS-1903 BlueJ Ron McFadyen 1903 Fall 2007 Lab 1: Using BlueJ at UofW Lab 1,the shapes program Lastly: When you have produced results similar to the previous slide you can copy them by using the Ctl-PrintScreen keys together, and then pasting the captured image into a Word document or a PowerPoint slide. Your lab demonstrator can show you how to do this. On previous slides you have answered various questions. Hand these in, along with the Ctl-PrintScreen image, to your instructor. Be sure to staple these pages together, and include the student identification slide.