1. 2D Graphics: Rendering Details
Chapter 3

2. Bird’s Eye View Overview of Computer Graphics 2D Graphics: Basics
2D Graphics: Rendering Details
Colors, paints, strokes, transformation, alpha composition, clipping path, fonts, glyphs, and other rendering details
2D Graphics: Advanced topics

3. Objectives To understand color spaces To use the Java Color class
To be able to use different types of paints in drawing visual objects
To apply stroke types
To construct affine transforms including translation, rotation, scaling, shearing, and reflection
To understand object transformations and viewing transformations
To combine basic transformations to form more complex ones
To identify the compositing rules
To use clipping path
To apply fonts and font metrics
To understand glyph, ligature, and derived font

4. Color Space CIEXYZ RGB CYMK sRGB Color Class Standard RGB
black, blue, cyan, dark_Gray, gray, green, light_Gray, magenta, orange, pink, red, white, yellow
Source

5. Paint
Generalizing the concept of color, Java 2D drawing applies an attribute called paint
Source

6. fillRect(): Fills the specified rectangle
void java.awt.Graphics.fillRect(int arg0, int arg1, int arg2, int arg3)
public abstract void fillRect(int x, int y, int width, int height)
The left and right edges of the rectangle are at x and x + width - 1.
The top and bottom edges are at y and y + height - 1.
The resulting rectangle covers an area width pixels wide by height pixels tall.
The rectangle is filled using the graphics context's current color.
Parameters:
x - the x coordinate of the rectangle to be filled.
y - the y coordinate of the rectangle to be filled.
width - the width of the rectangle to be filled.
height - the height of the rectangle to be filled.
See Also: clearRect(int, int, int, int), drawRect(int, int, int, int)

7. Strokes
Width
End style
Join style
Miter limit
Dash pattern
Source

8. Affine Transformation
Maps parallel lines to parallel lines
Common affine transforms
Translation
Rotation
Reflection
Scale
Shear

9. Transformation Matrix
Translation by (a,b)
Rotation about the origin
Scaling
Shearing along the x-axis by the factor s
Reflection about the line y=kx
Source

10. Composition of Transforms
Combining transforms
Non-commutative
Matrix product
Source

11. Alpha Compositing
α-channel
Transparency
Porter-Duff rules

12. Porter-Duff Rules Clear SrcOver SrcIn SrcOut Src SrcAtop Xor DstOver
DstIn
DstOut
Dst
DstAtop

13. A Probabilistic Model
α value as the probability of the color to be shown
Four different events:
source color occurs only
destination color occurs only
both colors occur
neither color occurs.
Source

14. Clipping Path The rendered image may be clipped by a clipping path
Source

15. Font Logical fonts Font styles Derived font Font metrics Serif
SansSerif
Monospaced
Dialog
DialogInput
Font styles
PLAIN
ITALIC
BOLD
Derived font
Font metrics
Source

16. Ligature
A glyph may contain multiple letters
A common ligature:

17. Glyph Geometry of a text string with a font Obtain a glyph Source
Font font = new Font("Serif", Font.BOLD, 144);
FontRenderContext frc = g2.getFontRenderContext();
GlyphVector gv = font.createGlyphVector(frc, "Java");
Shape glyph = gv.getOutline(100,200);
Source