Graphics -- Introduction

1. Graphics -- Introduction • The use of graphics is common among modern software systems • Java has strong API support for graphics in the java.awt (abstract windowing toolkit) package • This lesson focuses on: • the coordinate system for Java graphics • the use of color • drawing shapes such as lines, ovals, rectangles, etc. • the use of fonts • basic animation techniques

2. The Graphics Class • An object of the Graphics class represents a particular drawing surface • It defines a graphicscontext in which drawn shapes will be rendered • The Graphics class contains methods for drawing various shapes and controlling visual aspects like font and color • An applet has a graphics context, which is automatically passed to the paint method when it is called

3. The Coordinate System • A simple two-dimensional coordinate system exists for each graphics context (or drawing surface) • Each point on the coordinate system represents a single pixel • The top left corner of the area is coordinate <0, 0> • A drawing surface has a particular width and height • Anything drawn outside of that area will not be visible • See Coordinates.javashow

4. X <0, 0> x y <x, y> <width-1, height-1> Y The Coordinate System

5. Color • The Color class is used to define and manage the color in which shapes are drawn • Colors are defined by their RGB value, which defines the relative contribution of the primary colors red, green, and blue • Each drawing surface has a foreground color and a background color • The setColor method of the Graphics class defines the foreground color, and the setBackground method of the component (the applet) sets the background color

6. Color • The Color class contains several predefined colors, defined as public, static constants • See Nature.javashow it • Many other colors can be defined using the constructor of the Color class • Over 16 million colors can be defined, but humans cannot distinguish between many similar colors • Furthermore, the hardware of most systems has limitations to the color options available

7. XOR Mode • Drawing in normal mode causes shapes of the same color to blend together • Drawing in XORmode causes the overlapping portions of the shapes to be rendered in a contrasting color • This effect can be used to "erase" a shape by redrawing it in the same color in the same spot while in XOR mode • See XOR_Demo.javashow it

8. Drawing Shapes • The Graphics class contains methods for drawing several specific shapes: lines, ovals, rectangles, arcs, polygons, and polylines • Most shapes can be drawn filled or unfilled • A line, drawn with the drawLine method, is always one pixel wide and cannot be filled

9. Ovals • An oval is defined by its boundingrectangle: • The methods that draw an oval take four parameters, all integers: drawOval (x, y, width, height) fillOval (x, y, width, height) width height

10. Ovals • The first two parameters are the <x, y> coordinate of the top-left corner of the bounding rectangle • The third and fourth parameters specify the width and height of the bounding rectangle • The drawOval method draws an unfilled oval and the fillOval method draws a filled (opaque) oval • See Ovals.javaand Rotating_Disk.java show itshow it

11. Rectangles • Rectangles can be drawn • filled or unfilled • with squared or rounded corners • with a slight three-dimensional effect or not • The primary parameters for all rectangle drawing methods define the upper left corner of the rectangle and its width and height • The shape of the rounded corner of a rounded rectangle are defined by an arc width and height

12. Rectangles • A three dimensional rectangle is shown using a small highlight on two sides of the rectangle • The highlight appears on the bottom and right or the top and left as specified by a boolean parameter to the 3D drawing methods • See Rectangles.java, show it Rounded_Rectangles.java, show it and Three_D_Rectangles.javashow it

13. Arcs • An arc is defined as a segment of an oval • The first four parameters to the arc drawing methods define the bounding rectangle of the oval (top left corner, width, and height) • The other two parameters define the startangle and the arcangle • The start angle indicates where the arc begins and the arc angle determines how far the arc sweeps across its defining oval • See Arc.javashow it

14. 90 -270 45 -315 0 360 -360 180 -180 270 -90 Arcs • The start angle can be specified using both positive and negative values:

15. Arcs • An arc angle can also be positive or negative • A positive arc angle sweeps counterclockwise, and a negative arc angle sweeps clockwise • Therefore, the same arc can be specified using four different combinations of start and arc angles • Arcs can also be filled or unfilled • See Arcs.javashow it

16. Polygons • A polygon is a multisided figure defined by a series of ordered points • Line segments connecting the points form the polygon • The points are defined by corresponding arrays of x and y coordinate values, and can already be incorporated into an object of the Polygon class • Polygons are closed, forming a line segment from the last point back to the first • See Polygons.javashow it

17. Polylines • A polyline is similar to a polygon except that it is not closed • That is, there is no line segment from the last point back to the first unless explicitly specified • They are convenient for specifying certain kinds of complex shapes • Polylines cannot be filled • See Polylines.javashow

18. Fonts • A font defines the look of each character when it is printed or drawn • The Font class provides methods for specifying fonts in a Java program • Each computer system supports a specific set of fonts • See Font_Lister.java • The setFont method defines the current font for a program

19. Fonts • A font is defined using the Font class constructor and a combination of: • font name • font style: plain, bold, italic, or bold+italic • font size, in points • Constants are defined in the Font class to specify the font style • See Entropy.java

20. Animations • Simple animations can be accomplished by drawing a shape, then erasing it, then drawing it again in a slightly altered position • Erasing can be accomplished through careful use of XOR mode • Timing must be controlled so that the animation does not move too fast • See Bouncing_Ball.javashow it