1 / 93

Universidad Nacional de Colombia Facultad de Ingeniería Departamento de Sistemas

C. ertificación en. J. AVA. Universidad Nacional de Colombia Facultad de Ingeniería Departamento de Sistemas. The paint() method and the Graphics Context The Visual Components The Container Components The Menu Components. 12. PAINTING. Objectives.

axelle
Download Presentation

Universidad Nacional de Colombia Facultad de Ingeniería Departamento de Sistemas

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. C ertificación en J AVA Universidad Nacional de Colombia Facultad de Ingeniería Departamento de Sistemas

  2. The paint() method and the Graphics Context • The Visual Components • The Container Components • The Menu Components 12. PAINTING

  3. Objectives • Many types of AWT components (buttons and scroll • bars, for example) have their appearance dictated • by the underlying window system. Other component • types, notably applets, frames, panels, and canvases, • have no intrinsic appearance. If you use any of these • classes and want your component to look at all useful, • you will have to provide the code that implements the • component's appearance • Java's painting mechanism provides the way for you • to render your components. The mechanism is robust, • and if you use it correctly you can create good, • scaleable, reusable code. The best approach is to • understand how Java's painting really works.

  4. Objectives • The fundamental concepts of painting are • The paint() method and the graphics context • The GUI thread and the repaint() method • Spontaneous painting • Painting to images • This chapter will take you through the steps • necessary to understand and apply these concepts. • And while the topics covered here are not explicitly • mentioned many exam objectives, you may well • find this information useful or essential

  5. import java.applet.Applet; • import java.awt.*; • public class SimplePaint extends Applet { • public void paint( Graphics g ) { • g.setColor( Color.black ); • g.fillRect( 0, 0, 300, 300 ); • g.setColor( Color.white ); • g.fillOval( 30, 30, 50, 50 ); • } • } The paint() method and the Graphics Context example of the paint() method:

  6. Applet Viewer: SimplePaint.class Applet started. A very simple painting applet

  7.  One interesting point about this applet is that no calls are made to the paint() method. The method is simply provided The environment seems to do a good job of calling paint() at the right moment Exactly when the environment chooses to call paint() is the subject of "Spontaneous Painting," later in this chapter

  8. Painting on a component is accomplished by making calls to a graphics context, which is an instance of the Graphics class A graphics context knows how to render onto a single target The three media a graphics context can render onto are: • Components • Images • Printers

  9. Any kind of component can be associated with a graphics context The association is permanent; a context cannot be reassigned to a new component Although you can use graphics contexts to paint onto any kind of component, it is unusual to do so with components that already have an appearance

  10. Buttons, choices, check boxes, labels, scroll bars, text fields, and text areas do not often require programmer-level rendering Most often, these components just use the version of paint() that they inherit from the Component superclass. This version does nothing; the components are rendered by the underlying window system

  11. However, there are four classes of "blank" components that have no default appearance and will show up as empty rectangles, unless they are subclassed and given paint() methods These four component classes are: • Applet • Canvas • Frame • Panel

  12. The four major operations provided by the Graphics class are: • Selectinga color • Selectinga font • Drawing and filling • Clipping

  13. Selecting a Color Colors are selected by calling the setColor() method The argument is an instance of the Color class There are 13 predefined colors, accessible as static final variables of the Color class The variables are themselves instances of the Color class, which makes some people uneasy, but java has no trouble with such things

  14. Predefined colors • Color.yellow • Color.blue • Color.green • Color.orange • Color.magenta • Color.cyan • Color.pink • Color.lightGray • Color.darkGray • Color.gray • Color.white • Color.black • Color.red 

  15. If you want a color that is not on this list, you can construct your own There are several versions of the Color constructor; the simplest is Color( int redLevel, int greenLevel, int blueLevel )

  16. public void paint( Graphics g ) { • Color c = new Color( 170, 255, 170 ); • g.setColor( c ); • . . .

  17. Selecting a Font Setting the font of a graphics context is like setting the color: subsequent string-drawing operations will use the new font, while previously drawn strings are not affected

  18. Before you can set a font, you have to create one Font( String fontname, int style, int size ) The first parameter is the name of the font Font availability is platform dependent

  19. String fontnames[] = Toolkit.getDefaultToolkit().getFontList() You can get a list of available font names, returned as an array of strings, by calling the getFontList() method on your toolkit

  20. There are three font names that you can always count on, no matter what platform you are running on: • "Serif" • "SansSerif" • "Monospaced" On releases of the JDK before 1.1, these were called, respectively, "TimesRoman", "Helvetica", and "Courier“

  21. Font f = new Font( "SansSerif", Font.BOLD, 24 ); • gc.setFont( f ) The style parameter of the Font constructor should be one of the following three ints: • Font.PLAIN • Font.BOLD • Font.ITALIC You can specify a bold italic font by passing Font.BOLD+Font.ITALIC as the style parameter to the Font constructor

  22. Drawing and Filling All the rendering methods of the Graphics class specify pixel coordinate positions for the shapes they render Every component has its own coordinate space, with the origin in the component's upper-left corner, x increasing to the right, and y increasing downward

  23. (0,0) X Y Every component has its own coordinate space, with the origin in the component's upper-left corner, x increasing to the right, and y increasing downward

  24. Graphics contexts do not have an extensive repertoire of painting methods Sophisticated rendering is handled by extended APIs such as 2D, 3D, and Animation • drawLine() • drawRect() and fillRect() • drawOvalQ and fillOval() • drawArc() and fillArc() • drawPolygon() and fillPolygon() • drawPolyline() • drawString()

  25. drawLine() The drawLine() method draws a line from point (x0, y0) to point (x1, y1) public void drawLine( int x0, int y0, int x1, int y1 );

  26. g.drawLine( 20, 120, 100, 50 ); Applet Viewer: ... Applet started.

  27. drawRect() and fillRect() The drawRect() and fillRect() methods respectively draw and fill rectangles public void drawRect( int x, int y, int width, int height ); public void fillRect( int x, int y, int width, int height ); The x and y parameters are the coordinates of the upper-left corner of the rectangle Width and height must be positive numbers, or nothing will be drawn

  28. g.drawRect( 20, 20, 100, 80 ); Applet Viewer: ... Applet started.

  29. g.fillRect( 20, 20, 100, 80 ); Applet Viewer: ... Applet started.

  30. drawOval() and fillOval() The drawOval() and fillOval() methods respectively draw and fill ovals An oval is specified by a rectangular bounding box To draw a circle, use a square bounding box

  31. 90 180 0 270 The oval lies inside the bounding box and is tangent to each of the box's sides at the midpoint

  32. The two oval-drawing methods require you to specify a bounding box in exactly the same way that you specified a rectangle in the drawRect() and fillRect() methods: public void drawOval( int x, int y, int width, int height ); public void fillOval( int x, int y, int width, int height );

  33. g.drawOval( 10, 10, 150, 100 ); Applet Viewer: ... Applet started.

  34. g.fillOval( 10, 10, 150, 100 ); Applet Viewer: ... Applet started.

  35. drawArc() and fillArc() An arc is a segment of an oval To specify an arc, you first specify the oval's bounding box, just as you do with drawOval() and fillOval() You also need to specify the starting and ending points of the arc, which you do by specifying a starting angle and the angle swept out by the arc

  36. Angles are measured in degrees. For the starting angle, 0 degrees is to the right, 90 degrees is upward, and so on, increasing counterclockwise A filled arc is the region bounded by the arc itself and the two radii from the center of the oval to the endpoints of the arc • public void drawArc( int x, int y, int width, int height, • int startDegrees, int arcDegrees ); • public void fillArc( int x, int y, int width, int height, • int startDegrees, int arcDegrees );

  37. g.drawArc( 10, 10, 150, 100, 45, 180); Applet Viewer: ... Applet started.

  38. g.fillArc( 10, 10, 150, 100, 45, 180); Applet Viewer: ... Applet started.

  39. drawPolygon() and fillPolygon() A polygon is a closed figure with an arbitrary number of vertices The vertices are passed to the drawPolygon() and fillPolygon() methods as two int arrays

  40. The first array contains the x coordinates of the vertices • the second array contains the y coordinates • A third parameter specifies the number ofvertices public void drawPolygon( int[] xs, int[] ys, int numPoints ); public void fill Polygon( int[] xs, int[] ys, int numPoints );

  41. int[] polyXs = { 20, 150, 150 }; • int[] polyYs = { 20, 20, 120 }; • g.drawPolygon( polyXs, polyYs, 3 ); Applet Viewer: ... Applet started.

  42. int[] polyXs = { 20, 150, 150 }; • int[] polyYs = { 20, 20, 120 }; • g.fillPolygon( polyXs, polyYs, 3 ); Applet Viewer: ... Applet started.

  43. drawPolyline() A polyline is similar to a polygon, but it is open rather than closed: there is no line segment connecting the last vertex to the first There is nofillPolyline() method, since fillPolygon() achieves the same result

  44. The parameters to drawPolyline() are the same as those to drawPolygon(): • a pair of int arrays representing vertices and • an int that tells how many vertices there are public void drawPolyline( int[] xs, int[] ys, int numPoints );

  45. int[] polyXs = { 20, 150, 150 }; • int[] polyYs = { 20, 20, 120 }; • g.drawPolyline( polyXs, polyYs, 3 ); Applet Viewer: ... Applet started.

  46. drawString() The drawString() method paints a string of text public void drawString( String s, int x, int y ); The x and y parameters specify the left edge of the baseline of the string Characters with descenders (g, j, p, q, and y in most fonts) extend below the baseline

  47. By default, a graphics context uses the font of the associated component However, you can set a different font by calling the graphics context's setFont() method 

  48. Font font = new Font( "Serif", Font.PLAIN, 24 ); • g.setFont( font ); • g.drawString( "juggle quickly", 20, 50 ); • g.setColor( Color.gray ); • g.drawLine( 20, 50, 150, 50 ); Applet Viewer: ... juggle quickly

  49. drawImage() An Image is an off-screen representation of a rectangular collection of pixel values Java's image support is complicated The section "Images" discusses what you need to know about creating and manipulating images For now, assume that you have somehow obtained an image (that is, an instance of class java.awt.Image) that you want to render to the screen using a certain graphics context

  50. call the graphics context's drawlmage() method void drawlmage( Image im, int x, int y, ImageObserver observer ); • im is the image to be rendered, and • x and y are the coordinates within the destination component of the upper-left corner of the image • There are other versions of the method, but this is the most common form

More Related