Lab 6: Shapes & Picture Extended Ellipse & Rectangle Classes Stand-Alone GUI Applications.

Lab 6: Shapes & Picture Extended

Ellipse & Rectangle Classes

Stand-Alone GUI Applications

Agenda• Create more shape classes

– Ellipse– Rectangle

• Change applet to stand alone GUI application

Created by Emily Hill & Jerry Alan Fails

GUI Components• A GUI component is an object that represents a

screen element such as a button or a text field

• GUI-related classes are defined primarily in the java.awt and the javax.swing packages

• The Abstract Windowing Toolkit (AWT) was the original Java GUI package

• The Swing package provides additional and more versatile components

• Both packages are needed to create a Java GUI-based program

Copyright © 2012 Pearson Education, Inc.

GUI Containers• A GUI container is a component that is used to hold

and organize other components

• A frame– Container displayed as a separate window with a title bar

– Can be repositioned and resized on the screen as needed

• A panel– Container that cannot be displayed on its own but is used

to organize other components

– Must be added to another container (like a frame or another panel) to be displayed

Copyright © 2012 Pearson Education, Inc.

Convert Picture from Applet to Stand-Alone GUI

• Download and import the Picture.Extended starter code from the Course Materials of Canvas.– Rename the project to PictureExtended_netID– You can copy pieces from your previous CircleApplet or

Picture project to PictureApp_netid

• Create a copy of the Picture class – Call one PictureApp, the other PictureApplet

• Change Picture class– Change so it extends JPanel not JApplet– Change init method to be a default constructor– Change paint method name to paintComponent– Add a main method (see General Template on next slide)

Created by Emily Hill & Jerry Alan Fails

General Template for Stand-Alone GUI

public static void main(String[] args)

{

JFrame frame = new JFrame(”Picture Test");

frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

JPanel panel = new PictureApp();

panel.setPreferredSize(new Dimension(500,500));

frame.getContentPane().add(panel);

frame.pack();

frame.setVisible(true);

}

Created by Emily Hill & Jerry Alan Fails

Create Rectangle and Ellipse Classes

• Create a Rectangle and an Ellipse class with:– Create fields for x & y positions, width, height, fillColor, and

outlineColor– Create default constructor & constructor with parameters– Add getter & setter methods– Add a paintComponent method– Add get area & get perimeter methods

• Area of ellipse:

• Perimeter (circumference) of ellipse:

• Add rectangle and ellipse objects to your picture (to test your new classes) Created by Emily Hill & Jerry Alan Fails

Circle getArea

public double getArea()

{

return Math.PI * radius * radius;

}

•Don’t forget to test your getArea & getPerimeter methods in a main inside each shape class

Created by Emily Hill & Jerry Alan Fails

Recap• Created more classes

– Ellipse & Rectangle– Just specified: fields, constructors, methods

• Change applet to stand alone GUI application– Note didn’t have to change Circle, Square, Ellipse,

Rectangle, just a few changes to Picture

• Also briefly mentioned type promotion– Math.pow(double, double) can receive integer values

because no information is lost e.g. Math.pow(3, 4)

Created by Emily Hill & Jerry Alan Fails

Homework• Finish lab exercise

– Next lab: we will use these classes to create other classes

• Read Chapter 4• CodingBat

Created by Emily Hill & Jerry Alan Fails