Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved. 0-13-148952-6 1 Chapter 13 Graphics.

Slides:



Advertisements
Similar presentations
Chapter 13 Graphics.
Advertisements

2D Graphics Drawing Things. Graphics In your GUI, you might want to draw graphics E.g. draw lines, circles, shapes, draw strings etc The Graphics class.
Graphics You draw on a Graphics object The Graphics object cannot directly be created by your code, instead one is generated when the method paintComponent.
Graphics Chapter 16.  If you want to draw shapes such as a bar chart, a clock, or a stop sign, how do you do it?
Graphics CSCI 201L Jeffrey Miller, Ph.D. HTTP :// WWW - SCF. USC. EDU /~ CSCI 201 USC CSCI 201L.
1 Drawing C Sc 335 Object-Oriented Programming and Design Rick Mercer.
Java Graphics Section 1 - Multi-File Graphics Programs Section 2 - The Coordinate System and Graphics Context g Section 3 - The Java Drawing and Painting.
GUI and Swing, part 2 The illustrated edition. Scroll bars As we have previously seen, a JTextArea has a fixed size, but the amount of text that can be.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved What is Multimedia? Multimedia.
1 L36 Graphics and Java 2D™ (1). 2 OBJECTIVES  To understand graphics contexts and graphics objects.  To understand and be able to manipulate colors.
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved Chapter 14 Graphics.
Graphics Programming. In this class, we will cover: The difference between AWT and Swing Creating a frame Frame positioning Displaying information in.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 16 Applets.
1 Applets Chapter 1 To understand:  why applets are used to extend the capabilities of Web pages  how an applet is executed and know about the restrictions.
Liang, Introduction to Java Programming, Sixth Edition, (c) 2007 Pearson Education, Inc. All rights reserved L01 (Chapter 13) Graphics.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 14 Applets, Images,
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved. 1 Chapter 2 2D Graphics: Basics F The architecture.
CS 112 GUI 06 May 2008 Bilkent. Java GUI API Containers: ◦ contain other GUI components. E.g, Window, Panel, Applet, Frame Dialog. Components: ◦ Buttons,
Chapter 10 Getting Started with GUI Programming F GUI Class Hierarchy F Frames –Creating frames, centering frames, adding components to frames F Layout.
Liang, Introduction to Java Programming, Sixth Edition, (c) 2007 Pearson Education, Inc. All rights reserved L02 (Chapter 13) Graphics.
Java Review Structure of a graphics program. Computer Graphics and User Interfaces Java is Object-Oriented A program uses objects to model the solution.
Liang, Introduction to Java Programming, Sixth Edition, (c) 2007 Pearson Education, Inc. All rights reserved L05 (Chapter 16) Applets.
Web Design & Development Lecture 18. Java Graphics.
Chapter 16: Graphics. Objectives Learn about the paint() and repaint() methods Use the drawString() method to draw String s using various fonts and colors.
Draw Shapes Introduction to simple graphics. What is a Component? A class that resides in the java.awt package Examples include: –Button, java.awt.Button.
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Standard Graphics in Java,
1 Graphical User Components (II) Outline JTextArea Creating a Customized Subclass of JPanel JPanel Subclass that Handles Its Own Events Windows: Additional.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 13 Creating User.
CSE 219 Computer Science III Images. HW1 Has been posted on Blackboard Making a Game of Life with limited options.
Chapter 15 Graphics and Java 2D™ Java How to Program, 8/e (C) 2010 Pearson Education, Inc. All rights reserved.
 Pearson Education, Inc. All rights reserved. 1 Ch 12 Graphics and Java 2D In this chapter you will learn:  To understand graphics contexts.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 11 Getting Started.
Liang, Introduction to Java Programming, Ninth Edition, (c) 2013 Pearson Education, Inc. All rights reserved. 1 Chapter 12 GUI Basics.
Chapter 10 Getting Started with GUI Programming F GUI Class Hierarchy F Frames –Creating frames, centering frames, adding components to frames F Layout.
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved COS240 O-O Languages AUBG,
Liang,Introduction to Java Programming,revised by Dai-kaiyu 1 Chapter 11 Getting Started with GUI Programming 百闻不如一见.
Chapter 8: Getting Started with Graphics Programming Graphics Class Hierarchy Graphics Class Hierarchy Frames Frames The relationship between frame and.
Abstract Window Toolkit (AWT) The Abstract Window Toolkit (AWT) supports Graphical User Interface (GUI) programming. AWT features include:  A rich set.
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved COS240 Object-Oriented Languages.
J McQuillan SE204: 2004/2005: Lecture 4slide 1 The Graphics Class Used when we need to draw to the screen Two graphics classes –Graphics –Graphics2D.
-Sai Phalgun Tatavarthy. Outline What is a “Graphing Calculator”? Graphics, Graphics2D classes Methods of Graphics object Custom Painting The paintComponent()
Introduction to Java Simple Graphics. Objects and Methods Recall that a method is an action which can be performed by an object. –The action takes place.
Liang, Introduction to Java Programming, Sixth Edition, (c) 2007 Pearson Education, Inc. All rights reserved Chapter 16 Applets and Multimedia.
Creating Your Own Widgets CompSci 230 S Software Construction.
Agenda Java Coordinate Systems. Graphics Class. Drawing on Panels. Drawing Shapes.
(C) 2010 Pearson Education, Inc. All rights reserved.  Class Graphics (from package java.awt) provides various methods for drawing text and shapes onto.
Merete S COLLEGEFACULTY OF ENGINEERING & SCIENCE Graphics ikt403 – Object-Oriented Software Development.
1 GUIs, Layout, Drawing Rick Mercer. 2 Event-Driven Programming with Graphical user Interfaces  Most applications have graphical user interfaces (GUIs)
Graphics basic 1. 2 Objectives Understand Java coordinate systems. Draw things using the methods in the Graphics class. Override the paintComponent method.
Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved Chapter 14 Abstract Classes.
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved COS240 O-O Languages AUBG,
Review_6 AWT, Swing, ActionListener, and Graphics.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Tutorial 2 – Welcome Application Introduction to Graphical.
Basics of GUI Programming Chapter 11 and Chapter 22.
1 Chapter 2 Getting Started with GUI Programming.
CSI 3125, Preliminaries, page 1 AWT. CSI 3125, Preliminaries, page 2 AWT Java AWT (Abstract Windowing Toolkit) is an API to develop GUI or window-based.
Liang, Introduction to Java Programming, Tenth Edition, (c) 2015 Pearson Education, Inc. All rights reserved. 1 Chapter 14 JavaFX Basics.
Getting Started with GUI Programming Chapter 10 CSCI 1302.
AWT Java AWT (Abstract Windowing Toolkit) is an API to develop GUI or window-based application in java. Java AWT components are platform-dependent i.e.
Getting Started with GUI Programming Chapter 10 CSCI 1302.
Basic Graphics 03/03/16 & 03/07/16 Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010.
CPCS 391 Computer Graphics Lab One. Computer Graphics Using Java What is Computer Graphics: Computer graphics are graphics created using computers and,
Graphics JavaMethods An Introduction to Object-Oriented Programming Maria Litvin Gary Litvin Copyright © 2003 by Maria Litvin, Gary Litvin, and Skylight.
Chapter 5 Introduction to Defining Classes Fundamentals of Java.
Fundamental of Java Programming
Basic Graphics Chapter 5 3/19/15 Thursday Section Only
4.14 GUI and Graphics Case Study: Creating Simple Drawings (Cont.)
Chapter 13 Graphics.
Chapter 13 Graphics.
Presentation transcript:

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 13 Graphics

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Objectives F To understand Java coordinate systems (§13.2). F To draw things using the methods in the Graphics class (§13.3). F To obtain a graphics context using the getGraphics() method (§13.3). F To override the paintComponent method to draw things on a graphical context (§13.4). F To use a panel as a canvas to draw things (§13.5). F To draw strings, lines, rectangles, ovals, arcs, and polygons (§§13.6, ). F To obtain font properties using FontMetrics and know how to center a message (§13.10). F To display image in a GUI component (§13.13). F To develop reusable GUI components FigurePanel, MessagePanel, StillClock, and ImageViewer (§§13.7, 13.11, 13.12, 13.14).

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Java Coordinate System

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Each GUI Component Has its Own Coordinate System

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved The Graphics Class You can draw strings, lines, rectangles, ovals, arcs, polygons, and polylines, using the methods in the Graphics class.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Obtaining Graphics Object The Graphics class is an abstract class that provides a device-independent graphics interface for displaying figures and images on the screen on different platforms. Whenever a component (e.g., a button, a label, a panel) is displayed, a Graphics object is created for the component on the native platform. This object can be obtained using the getGraphics() method. For example, the graphics context for a label object jlblBanner can be obtained using Graphics graphics = jlblBanner.getGraphics(); You can then apply the methods in the Graphics class to draw things on the label’s graphics context.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved A Drawing Example Draw a line and a text (0, 0) (50, 50) TestGetGraphicsRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Two Problems With the Preceding Example F If you resize the frame, the line is gone. F It is awkward to program because you have to make sure that the component to be displayed before obtaining its graphics context using the getGraphics() method. For this reason, Lines 20 and 21 are placed after the frame is displayed in Line 17. To fix the first problem, you need to know its cause. When you resize the frame, the JVM invokes the paintComponent method of a Swing component (e.g., a label) to redisplay the graphics on the component. Since you did not draw a line in the paintComponent method, the line is gone when the frame is resized. To permanently display the line, you need to draw the line in the paintComponent method.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved The paintComponent Method The paintComponent method is defined in JComponent, and its header is as follows: protected void paintComponent(Graphics g) This method, defined in the JComponent class, is invoked whenever the component is first displayed or redisplayed. The Graphics object g is created automatically by the JVM for every visible GUI component. The JVM obtains the Graphics object and passes it to invoke paintComponent.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved paintComponent Example In order to draw things on a component (e.g., a JLabel), you need to declare a class that extends a Swing GUI component class and overrides its paintComponent method to specify what to draw. The first program in this chapter can be rewritten using paintComponent. TestPaintComponentRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing on Panels F JPanel can be used to draw graphics (including text) and enable user interaction.  To draw in a panel, you create a new class that extends JPanel and override the paintComponent method to tell the panel how to draw things. You can then display strings, draw geometric shapes, and view images on the panel. TestPanelDrawingRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Geometric Figures F Drawing Strings F Drawing Lines F Drawing Rectangles F Drawing Ovals F Drawing Arcs F Drawing Polygons

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Strings drawLine(int x1, int y1, int x2, int y2);drawString(String s, int x, int y);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Rectangles drawRect(int x, int y, int w, int h); fillRect(int x, int y, int w, int h);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Rounded Rectangles drawRoundRect(int x, int y, int w, int h, int aw, int ah); fillRoundRect(int x, int y, int w, int h, int aw, int ah);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Ovals drawOval(int x, int y, int w, int h); fillOval(int x, int y, int w, int h);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Case Study: The FigurePanel Class This example develops a useful class for displaying various figures. The class enables the user to set the figure type and specify whether the figure is filled, and displays the figure on a panel. FigurePanel

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Test FigurePanel This example develops a useful class for displaying various figures. The class enables the user to set the figure type and specify whether the figure is filled, and displays the figure on a panel. TestFigurePanelRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Arcs drawArc(int x, int y, int w, int h, int angle1, int angle2); fillArc(int x, int y, int w, int h, int angle1, int angle2); Angles are in degree

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Arcs Example DrawArcs Run

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Polygons and Polylines int[] x = {40, 70, 60, 45, 20}; int[] y = {20, 40, 80, 45, 60}; g.drawPolygon(x, y, x.length); g.drawPolyline(x, y, x.length);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Polygons Using the Polygon Class Polygon polygon = new Polygon(); polygon.addPoint(40, 59); polygon.addPoint(40, 100); polygon.addPoint(10, 100); g.drawPolygon(polygon);

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Polygons Example DrawPolygon RunRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Centering Display Using the FontMetrics Class You can display a string at any location in a panel. Can you display it centered? To do so, you need to use the FontMetrics class to measure the exact width and height of the string for a particular font. A FontMetrics can measure the following attributes: F public int getAscent() F public int getDescent() F public int getLeading() getAscent() getLeading() getDescent() getHeight() F public int getHeight() F public int stringWidth(String str)

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved The FontMetrics Class FontMetrics is an abstract class. To get a FontMetrics object for a specific font, use the following getFontMetrics methods defined in the Graphics class: · public FontMetrics getFontMetrics(Font f) Returns the font metrics of the specified font. · public FontMetrics getFontMetrics() Returns the font metrics of the current font.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved TestCenterMessageRun

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Case Study: MessagePanel MessagePanel Run This case study develops a useful class that displays a message in a panel. The class enables the user to set the location of the message, center the message, and move the message with the specified interval. TestMessagePanel

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Case Study: StillClock DisplayClockRunStillClock

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Clock xEnd = xCenter + handLength  sin(  ) yEnd = yCenter - handLength  cos(  ) Since there are sixty seconds in one minute, the angle for the second hand is second  (2  /60)

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Clock, cont. xEnd = xCenter + handLength  sin(  ) yEnd = yCenter - handLength  cos(  ) The position of the minute hand is determined by the minute and second. The exact minute value combined with seconds is minute + second/60. For example, if the time is 3 minutes and 30 seconds. The total minutes are 3.5. Since there are sixty minutes in one hour, the angle for the minute hand is (minute + second/60)  (2  /60)

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Drawing Clock, cont. xEnd = xCenter + handLength  sin(  ) yEnd = yCenter - handLength  cos(  ) Since one circle is divided into twelve hours, the angle for the hour hand is (hour + minute/60 + second/(60  60)))  (2  /12)

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Displaying Image Icons You learned how to create image icons and display image icons in labels and buttons. For example, the following statements create an image icon and display it in a label: ImageIcon icon = new ImageIcon("image/us.gif"); JLabel jlblImage = new JLabel(imageIcon); An image icon displays a fixed-size image. To display an image in a flexible size, you need to use the java.awt.Image class. An image can be created from an image icon using the getImage() method as follows: Image image = imageIcon.getImage();

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Displaying Images Using a label as an area for displaying images is simple and convenient, but you don't have much control over how the image is displayed. A more flexible way to display images is to use the drawImage method of the Graphics class on a panel. Four versions of the drawImage method are shown here.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Displaying Images Example This example gives the code that displays an image from image/us.gif. The file image/us.gif is under the class directory. The Image from the file is created in the program. The drawImage method displays the image to fill in the whole panel, as shown in the figure. RunDisplayImage

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Case Study: ImageViewer Class Displaying an image is a common task in Java programming. This case study develops a reusable component named ImageViewer that displays an image in a panel. The ImageViewer class contains the properties image, imageFilename, stretched, xCoordinate, and yCoordinate.

Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved ImageView Example This example gives an example that creates six images using the ImageViewer class. RunSixFlags