1 / 15

Lecture 15: Intro to Graphics

Lecture 15: Intro to Graphics Yoni Fridman 7/25/01 Outline Basics of graphics Pixels Coordinates The Graphics class Graphics contexts Drawing in Java Lines Shapes Colors The Color class RGB Pixels

liam
Download Presentation

Lecture 15: Intro to Graphics

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. Lecture 15: Intro to Graphics Yoni Fridman 7/25/01

  2. Outline • Basics of graphics • Pixels • Coordinates • The Graphics class • Graphics contexts • Drawing in Java • Lines • Shapes • Colors • The Color class • RGB

  3. Pixels • Consider a black and white monitor – everything displayed on the monitor, including text and drawings, is made up of pixels. • A pixel is a picture element – a single element of a two-dimensional image. • What does a diagonal line look like from up close?

  4. x 0 1 2 3 4 5 6 7 8 9 10 … 0 1 2 3 y 4 5 6 7 8 9 10 11 Coordinates • Like elements of a two-dimensional array, each pixel is referenced by coordinates that start in the upper left corner. • For example, the left-most pixel of the line is referenced by the coordinates (4, 9). • Unlike 2D arrays, the column comes 1st and the row comes 2nd.

  5. The Graphics Class • To display images in Java, we must use the Graphics class. • import java.awt.* • The first step is to construct a Graphics object. • An instance of the Graphics class is called a graphics context, and is usually given the identifier name g. • A graphics context is a rectangular area filled with pixels, used to store an image. • The Graphics class has a collection of instance methods that we can use to create images.

  6. Drawing in Java • The simplest instance method provided by the Graphics class is the drawLine() method. • It takes 4 arguments – drawLine(x1, y1, x2, y2), where (x1, y1) are the coordinates of one endpoint of the line and (x2, y2) are the coordinates of the other endpoint. • For example, if we’ve constructed a graphics context g, then g.drawLine(4, 9, 24, 2) will create the line shown in previous slides.

  7. 0 1 2 3 4 5 6 7 8 9 10 … 0 1 2 3 4 5 6 7 8 9 10 11 Drawing in Java • There are also methods that create shapes. • g.drawRect(x, y, width, height) creates the outline of a rectangle whose top left corner is at (x, y) and that has the specified width and height. • Example: g.drawRect(4, 3, 9, 5); • Similarly, g.fillRect() creates a filled in rectangle. 5 9

  8. 0 1 2 3 4 5 6 7 8 9 10 … 0 1 2 3 4 5 6 7 8 9 10 11 Drawing in Java • g.drawOval(x, y, width, height) creates an oval that’s enclosed in a rectangle that has the given coordinates. • Similarly, g.fillOval() creates a filled in oval. • How would you draw a circle?

  9. Drawing in Java • g.drawString(str, x, y) can be used to display text in the drawing window. • The first argument is a String – whatever you want to display. • The second and third arguments give the coordinates of the bottom left corner of the text. • Example: g.drawString(“Hello”, 100, 50);

  10. 0 1 2 3 4 5 6 7 8 9 10 12 14 16 18 20 22 24 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 Drawing in Java • How might we display a tic-tac-toe board?

  11. The Color Class • Two more methods for displaying graphics are setColor() and setBackground(). • setColor() defines the color of whatever is drawn next (it’s an instance method of the Graphics class). • setBackground() defines the background color (It’s a static method). • These methods each take one argument – that argument must be an instance of the Color class. • The Color class defines 13 constants that represent common colors. • For example, the following command will set the drawing color to red: g.setColor(Color.red);

  12. RGB – Red, Green, Blue • What if we want a color other than the 13 ones defined? • Computer monitors (and any other monitors) can display three primary colors – red, green, and blue. • All other colors are made from combinations of these three. • For example, red and green make yellow.

  13. RGB – Red, Green, Blue • Each of the three primary colors is specified on a scale of 0 to 255. • If we want our own custom color, we can use the Color constructor – Color(r, g, b); • g.setColor(new Color(255, 0, 0)); will set the drawing color to red. • g.setColor(new Color(255, 255, 0)); will set the color to yellow. • g.setColor(new Color(255, 255, 255)); will set the color to white. • g.setColor(new Color(0, 0, 0)); will set the color to black. • g.setColor(new Color(0, 0, 100)); will set the color to dark blue. • Etc. • These three values collectively give the RGB value.

  14. RGB – Red, Green, Blue • Here’s a table of the 13 defined colors and their RGB values.

  15. Homework • Read: Appendix D, to middle of page 746; and top of page 749 to middle of page 753.

More Related