1. Basic Graphics Chapter 5 3/19/15 Thursday Section Only
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

2. This Week's Topics Creating a Window The Class Graphics
Getting Ready to Draw
A Sample Drawing Panel
Displaying a Panel
The Class Graphics
The Coordinate System
Drawing Lines, Shapes, and Text
Painting Shapes
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

3. Objectives After studying this chapter, you should be able to:
Write a program that creates a window with graphics
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

4. Objectives Display in a window Lines Rectangles Ovals Arcs Strings
Use color in Graphics
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

5. Creating a Window A rectangular area Figure 5-1 An empty frame
Part of a user interface
Called a frame
Contains title bar
Figure 5-1 An empty frame
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

6. Creating a Window Construct object of class JFrame
From package javax.swing
JFrame aWindow = new JFrame();
Specify size
aWindow.setSize(400, 600);
Window must be made visible.
aWindow.setVisible(true);
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

7. Creating a Window setTitle() puts a title in the title bar:
aWindow.setTitle(“Bronco Window”);
View sample program, EmptyWindow
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

8. Creating a Window
If the user closes the window with the control button, the window closes. The program keeps running.
aWindow.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE);
Exits program when window closes.
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

9. Preparing to Draw Cannot draw directly on JFrame object
This is a container
Contains other objects
Can create a JPanel object and add it to the JFrame, but it would be blank.
The JPanel class is in javax.swing
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

10. Preparing to Draw Create a class of panels upon which to draw.
DrawingPanel inherits JPanel.
Graphics g parameter allows it to draw.
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

11. Simple Drawing Panel Some basic shapes.
Now we create a window and add an instance of class DrawingPanel to the window.
Example in WindowWithDrawing
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

12. Class Graphics Java runtime environment instantiates a Graphics object
The graphics context
Made available to method paintComponent
Use methods of Graphics object to display shapes
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

13. Coordinate System
Figure 5-2 The axes and some points on the coordinate system used for graphics
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

14. Lines, Shapes, Text Methods:
g.drawline (x1, y1, x2, y2);
g.drawRect(x, y, width, height);
Note pixels on edges of 5 x 4 rectangle Figure 5-3
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

15. Lines, Shapes, Text Ovals, Circles
g.drawOval(x, y, width, height); ( for circle, height = width)
Imaginary rectangle encloses oval Figure 5-4
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

16. Example I will: Create a java class displays a JFrame.
Create JPanel that has a drawing of a circle with a rectangle in it.
Make it look like a DO NOT ENTER sign
Add the JPanel to the JFrame to display the sign

17. Questions Study questions 1-4 in Chapter 5.
Study exercises 1-6 on page 130.

18. Lines, Shapes, Text Arc – a portion of an oval Figure 5-5
Additional specification of beginning and ending angle
g.drawArc(x, y, width, height, startAngle, extentAngle)
Figure 5-5
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

19. Lines, Shapes, Text Strings – text “drawn” onto the panel
g.drawString ("Square", 50, 90);
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

20. Lines, Shapes, Text Filled rectangles and squares
Specify position, dimensions g.fillRect(x, y, width, height);
Pixels in 5 x 4 rectangle painted by fillRect Figure 5-6
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

21. Lines, Shapes, Text Filled ovals, circles, arcs
Similar to use of drawOval, drawArc
g.fillOval (250, 100, 40, 20);
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

22. Participation #16 on page 131 Create a Jframe (window)
Create a Panel and add it to the JFrame
Use the paintComponent to draw basic shapes.
Start with the largest rectangle of the house
Add windows, doors and roof

23. import javax.swing.JFrame;
public class WindowWithDrawing {
public static void main(String[] args) {
//set up a JFrame window
JFrame bWindow = new JFrame();
bWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
bWindow.setSize(400,300);
bWindow.setTitle("Shapes");
//Put a DrawingPanel in the Window
//Make the window visible
bWindow.setVisible(true); }

24. import javax.swing.JPanel;
import java.awt.Graphics;
public class DrawingPanel extends JPanel {
//A panel to draw on.
public void paintComponent(Graphics pen){
//Statements that draw go here }

25. Problem: Display Temperature*
Program that draws a thermometer
Display temp in analog, digital
Note Figure 5-7
*See text for this example
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

26. Problem: Display Temperature
Discussion
Rectangles
Filled rectangle
Text
Locate in panel
Figure 5-8 Schematic of Thermometer
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

27. Problem: Display Temperature
A panel that draws the thermometer Listing 5-4
Now we create a program that displays the panel specified above Listing 5-5
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

28. Class Font-Skip Specify a Font object to set for the drawString method
Font aFont = new Font(name, style, size);
Physical name
Name of an actual font
Logical name
Name of a font family
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

29. Class Font
Figure 5-9 Names of fonts and families written in the fonts they represent
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

30. Class Color In java.awt.Color Create a color by specifying RGB values
Each primary color given by integer 0 – 255
Predefined color constants from Color Figure 5-10
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

31. Class Color A demonstration of the use of color Listing 5-6
A program that displays the panel defined in previous listing, Listing 5-7
Resulting output
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

32. Problem Solved: Happy Face See text for this example
We desire a program to display a happy face as shown in Figure 5-11
Must decide shape, size, color, positions of
Face
Eyes
Mouth
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

33. Problem Solved: Happy Face
Positions to be specified
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

34. Problem Solved: Happy Face
View source code for happy-face panel Figure 5-8
The program which would display this panel is left as an exercise.
Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010

35. Imagine! Java: Programming Concepts in Context by Frank M. Carrano
Basic Graphics
Chapter 5
Imagine! Java: Programming Concepts in Context by Frank M. Carrano