Kĩ thuật lập trình - Chương 16: Graphics

GraphicsCopyright © 2011 by Maria Litvin, Gary Litvin, and Skylight Publishing. All rights reserved.Java MethodsObject-Oriented Programmingand Data StructuresMaria Litvin ● Gary Litvin2nd AP edition  with GridWorld1Objectives:Understand computer graphics basicsLearn about paint, paintComponent, and repaint methodsLearn about coordinates and colorsReview shape drawing methodsLearn to use fonts and draw graphics text2Computer Graphics BasicsThere are two types of graphics devices: vector and raster.A vector device has some kind of pen that can move and draw lines directly on the surface.A raster device creates a picture by setting colors to individual pixels (picture elements) on a rectangular “raster.”3Basics (cont’d)A graphics adapter in your computer is a raster device.VRAM (video RAM) contains the information about the colors of all pixels.The screen displays the contents of VRAM.To draw a shape, you need to set the exactly right set of pixels to the required colors.The number of pixels in the raster vertically and horizontally is called the device resolution.4Basics (cont’d)A graphics software package provides functions for:setting drawing attributes: color, line width and style, fill texture and pattern, fontdrawing lines, circles, rectangles, polygons, and other basic shapes.In other words, a graphics package turns a raster device into a “logical” vector device.5Graphics in JavaJava library offers a graphics class Graphics and a graphics package Graphics2D.Graphics provides only most basic capabilities.Graphics2D and related classes in java.awt support better graphics with color gradients, line styles, etc.Here we only deal with Graphics.6Graphics in WindowsIn a windowing environment, a picture must be repainted every time we move, reopen or reshape the window.The program must have one “central” place or method where all the drawing happens.The operating system sends a “message” to the program to repaint its window when necessary.7paint and paintComponentThe javax.swing.JFrame class (which represents application windows) has one method, called paint, where all the drawing takes place.In Swing, paint calls paintComponent for each of the GUI components in the window.A programmer creates a picture by overriding the default paintComponent method (or the paint method).8paint and paintComponent (cont’d)paint method takes one argument of the type Graphics:import java.awt.*;import javax.swing.*;public class MyWindow extends JFrame{ ... public void paint(Graphics g) { super.paint(g); ... }}Defines the graphics “context” (location, size, coordinates, etc.)9paint and paintComponent (cont’d)The same for paintComponent:import java.awt.*;import javax.swing.*;public class MyCanvas extends JPanel{ ... public void paintComponent(Graphics g) { super.paintComponent(g); ... }}Or another Swing GUI component10paint and paintComponent (cont’d)A programmer never calls paint or paintComponent directly. repaint is called instead whenever you need to refresh the picture (after adding, moving, or changing some elements, etc.): public class MyCanvas extends JPanel { ... balloon.move(dx, dy); repaint(); ...repaint takes no parameters: the graphics context is restored and sent to paintComponent automatically11Coordinatesxyy-axis points down, as in many other graphics packagesUnits: pixels(0, 0)Origin: the upper-left corner of the component12Coordinates (cont’d)A GUI component provides getWidth and getHeight methods that return its respective dimension.These methods can be used to produce scalable graphics.getWidth and getHeight only work after the component has been placed (do not call them from a component’s constructor).13Coordinates (cont’d)The position of a rectangle, oval, and even an arc is defined by using its “bounding rectangle,” described by x, y, width, height:x, y14Coordinates (cont’d)(x, y) g.drawOval(x - r, y - r, 2*r, 2*r);r(x-r, y-r)2r2r15ColorsThe color attribute is set by calling g.setColor and stays in effect until changed:You can form a color with specified red, green, and blue (RGB) values: g.setColor(Color.BLUE); g.draw... g.draw... g.setColor(Color.LIGHT_GRAY); ...int rVal = 5, gVal = 255, bVal = 40;Color yourEyes = new Color (rVal, gVal, bVal);16Colors (cont’d)javax.swing.JColorChooser lets you choose a color in a GUI application:17Drawing Basic Shapes g.drawLine (x1, y1, x2, y2); g.clearRect (x, y, w, h); g.drawRect (x, y, w, h); g.fillRect (x, y, w, h); g.drawRoundRect (x, y, w, h, horzD, vertD); g.fillRoundRect (x, y, w, h, horzD, vertD); g.drawOval (x, y, w, h); g.fillOval (x, y, w, h); g.drawArc (x, y, w, h, fromDegr, measureDegrs);18Basic Shapes (cont’d) g.drawPolygon (xCoords, yCoords, nPoints); g.fillPolygon (xCoords, yCoords, nPoints); g.drawPolyline (xCoords, yCoords, nPoints); g.drawString (str, x, y); g.drawImage (img, x, y, this);abcImageObserver, often thisx, y19Fonts Font font = new Font (name, style, size); g.setFont (font);abc "Serif" abc "SansSerif" abc "Monospaced"Font.PLAINFont.BOLDFont.ITALICint (pixels)20Review:Explain the difference between vector and raster graphics.In what units are the coordinates measured in Graphics?Where is the origin of the coordinate system?How is the position and size of a rectangle or an oval is defined?How do you set a drawing color?Name a few drawing methods.21