lecture 15 intro to graphics
Download
Skip this Video
Download Presentation
Lecture 15: Intro to Graphics

Loading in 2 Seconds...

play fullscreen
1 / 15

Lecture 15: Intro to Graphics - PowerPoint PPT Presentation


  • 360 Views
  • Uploaded on

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

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Lecture 15: Intro to Graphics' - liam


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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
outline
Outline
  • Basics of graphics
    • Pixels
    • Coordinates
  • The Graphics class
    • Graphics contexts
  • Drawing in Java
    • Lines
    • Shapes
  • Colors
    • The Color class
    • RGB
pixels
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?
coordinates
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.
the graphics class
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.
drawing in java
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.
drawing in java7
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

drawing in java8
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?
drawing in java9
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);
drawing in java10
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?
the color class
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);

rgb red green blue
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.
rgb red green blue13
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.
rgb red green blue14
RGB – Red, Green, Blue
  • Here’s a table of the 13 defined colors and their RGB values.
homework
Homework
  • Read: Appendix D, to middle of page 746; and top of page 749 to middle of page 753.
ad