Graphics CSCI 201L Jeffrey Miller, Ph.D. HTTP :// WWW - SCF. USC. EDU /~ CSCI 201 USC CSCI 201L.

Slides:



Advertisements
Similar presentations
Chapter 13 Graphics.
Advertisements

Custom Painting Gestione della Grafica customizzata Vedi anche:
Applets and Graphics.
Chapter 15 Graphics. To paint, you need to specify where to paint. Each component has its own coordinate system with the origin (0, 0) at the upper-left.
2D Graphics Drawing Things. Graphics In your GUI, you might want to draw graphics E.g. draw lines, circles, shapes, draw strings etc The Graphics class.
CE203 - Application Programming Autumn 2013CE203 Part 61 Part 6.
Graphical User Interfaces
Web Design & Development Lecture 19. Java Graphics 2.
Frame Windows A frame object is used to create a graphical frame window. This frame is used to show information in a graphical application. The JFrame.
CSE 1341 Honors Professor Mark Fontenot Southern Methodist University Note Set 21.
AWT Components. 2 Using AWT Components 4 Component –Canvas –Scrollbar –Button –Checkbox –Label –List –Choice –TextComponent –TextArea –TextField 4 Component.
Graphics You draw on a Graphics object The Graphics object cannot directly be created by your code, instead one is generated when the method paintComponent.
Graphics Chapter 16.  If you want to draw shapes such as a bar chart, a clock, or a stop sign, how do you do it?
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved. 1 Chapter 2 2D Graphics: Basics.
LAB SESSION 7 Graphical user interface Applet fundamentals Methods in applets Execution of an applet Graphics class.
1 Drawing C Sc 335 Object-Oriented Programming and Design Rick Mercer.
CSC1401 Drawing in Java - 2. Reminder from last class How do you save your modified picture? String filename = …; Picture stevePicture = new Picture(filename);
Chapter 5 Programming Graphics. Chapter Goals To be able to write simple applications To display graphical shapes such as lines and ellipses To use colors.
Multithreading : animation. slide 5.2 Animation Animation shows different objects moving or changing as time progresses. Thread programming is useful.
Chapter 5 Programming Graphics. Chapter Goals To be able to write applications with simple graphical user interfaces To display graphical shapes such.
Graphical User Interface Bonus slides Interaction Between Components & Drawing.
Draw Shapes Introduction to simple graphics. What is a graphics context? An instance of the Graphics class Graphics is ABSTRACT! You can extend Graphics.
More Java Drawing in 2D Animations with Timer. Drawing Review A simple two-dimensional coordinate system exists for each graphics context or drawing surface.
CMSC 341 Building Java GUIs. 09/26/2007 CMSC 341 GUI 2 Why Java GUI Development? Course is about Data Structures, not GUIs. We are giving you the opportunity.
Java Graphics Section 1 - Multi-File Graphics Programs Section 2 - The Coordinate System and Graphics Context g Section 3 - The Java Drawing and Painting.
GUI and Swing, part 2 The illustrated edition. Scroll bars As we have previously seen, a JTextArea has a fixed size, but the amount of text that can be.
Graphics Programming With Applets Feb 23, Applets There are three different types of executable java code. –Standalone application, which has main()
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved Chapter 14 Graphics.
Liang, Introduction to Java Programming, Fifth Edition, (c) 2005 Pearson Education, Inc. All rights reserved Chapter 13 Graphics.
1 L37 Graphics and Java 2D™ (2). 2 OBJECTIVES To use methods of class Graphics to draw lines,  rectangles,  rectangles with rounded corners,  three-dimensional.
Advanced Java Class GUI – part 1. Intro to GUI GUI = Graphical User Interface -- “Gooey” Just because it’s “gooey” does not mean you may write messy code.
Slides prepared by Rose Williams, Binghamton University Chapter 19 Swing II.
1 Applets Chapter 1 To understand:  why applets are used to extend the capabilities of Web pages  how an applet is executed and know about the restrictions.
Liang, Introduction to Java Programming, Sixth Edition, (c) 2007 Pearson Education, Inc. All rights reserved L01 (Chapter 13) Graphics.
©The McGraw-Hill Companies, Inc. Permission required for reproduction or display. 4 th Ed Chapter Chapter 5 Java Graphics Applets.
Slides prepared by Rose Williams, Binghamton University ICS201 Lecture 16 : Swing VI Graphics King Fahd University of Petroleum & Minerals College of Computer.
Java Review Structure of a graphics program. Computer Graphics and User Interfaces Java is Object-Oriented A program uses objects to model the solution.
Swing Graphics ● Empty Swing containers have no visual appearance except for a background color ● Every JComponent must have a paintComponent method that.
Drawing pictures with Java. JFrame: the basic Java window The swing package contains classes, objects and methods that can be used to create a consistent.
Chapter 16: Graphics. Objectives Learn about the paint() and repaint() methods Use the drawString() method to draw String s using various fonts and colors.
Introducing Graphics There are generally two types of graphics facilities in Java –Drawing –GUIs We concentrate on drawing here We will draw on a Graphics.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Outline 20.1 Test-Driving the Screen Saver Application.
© Copyright 1992–2004 by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. Chapter 28 - Java Graphics and Java2D Outline 28.1Introduction.
Chapter 28 - Java Graphics and Java2D Outline 28.1Introduction 28.2Graphics Contexts and Graphics Objects 28.3Color Control 28.4Font Control 28.5Drawing.
 Pearson Education, Inc. All rights reserved. 1 Ch 12 Graphics and Java 2D In this chapter you will learn:  To understand graphics contexts.
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved COS240 Object-Oriented Languages.
Lecture 8.3 The Use of JComponent. © 2006 Pearson Addison-Wesley. All rights reserved More About the Standard Drawing Classes java.awt.Container.
Agenda Java Coordinate Systems. Graphics Class. Drawing on Panels. Drawing Shapes.
(C) 2010 Pearson Education, Inc. All rights reserved.  Class Graphics (from package java.awt) provides various methods for drawing text and shapes onto.
Merete S COLLEGEFACULTY OF ENGINEERING & SCIENCE Graphics ikt403 – Object-Oriented Software Development.
Graphics basic 1. 2 Objectives Understand Java coordinate systems. Draw things using the methods in the Graphics class. Override the paintComponent method.
Painting (Chapter 12) Java Certification Study Group January 25, 1999 Mark Roth.
Liang, Introduction to Java Programming, Seventh Edition, (c) 2009 Pearson Education, Inc. All rights reserved COS240 O-O Languages AUBG,
Chapter 2: Graphics In Java Basics of classes –instance variables –methods –overriding methods Graphics class (drawing routines) Other classes –Color –Font.
Graphics and Java2D Chapter Java Coordinate System Origin is in _____________ corner –Behind title bar of window X values increase to the ________.
Review_6 AWT, Swing, ActionListener, and Graphics.
CSI 3125, Preliminaries, page 1 AWT. CSI 3125, Preliminaries, page 2 AWT Java AWT (Abstract Windowing Toolkit) is an API to develop GUI or window-based.
Getting Started with GUI Programming Chapter 10 CSCI 1302.
Basic Graphics 03/03/16 & 03/07/16 Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010.
CPCS 391 Computer Graphics Lab One. Computer Graphics Using Java What is Computer Graphics: Computer graphics are graphics created using computers and,
CS202 Java Object Oriented Programming GUI Programming – Color and Drawing Methods Chengyu Sun California State University, Los Angeles.
Graphics Drawing Things With Java. Today's Topics Course Updates Java Graphics –Java 1.1 versus Java 1.2 (Java 2) Drawing Lines Drawing Shapes.
Eleventh Graphics in Java.
12 Graphics and Java 2D™.
Graphics Chapter 6 Copyright © 2000 W. W. Norton & Company.
Java Graphics CS 2511.
JAVA 2 Design and programming of GUI
4.14 GUI and Graphics Case Study: Creating Simple Drawings (Cont.)
12 Graphics and Java 2D™.
Presentation transcript:

Graphics CSCI 201L Jeffrey Miller, Ph.D. HTTP :// WWW - SCF. USC. EDU /~ CSCI 201 USC CSCI 201L

Outline USC CSCI 201L2/23 ▪G▪Graphics ▪S▪Strings, Lines, Rectangles, Ovals ▪A▪Arcs, Polygons, Polylines ▪P▪Program

Graphics Overview ▪Each GUI component has a graphics context ▪The coordinate system starts at (0, 0) in the top left corner and increases positive to the right in the x direction and down in the y direction ▪The upper left corner of a component is relative to its parent component USC CSCI 201L3/23 Graphics

Graphics Class ▪The Graphics class provides methods for drawing strings, lines, rectangles, ovals, arcs, polygons and polylines ▪The Graphics object displays figures and images on the screen on different platforms ▪Graphics is an abstract class that is automatically created by the JVM when a component is displayed ›This object is passed into the paintComponent(Graphics) method of the component to display the drawing ›The paintComponent(Graphics) method is defined in the JComponent class and is invoked whenever a component is first displayed or redisplayed USC CSCI 201L4/23 Graphics

Graphics API USC CSCI 201L5/23 Graphics

Outline USC CSCI 201L6/23 ▪G▪Graphics ▪S▪Strings, Lines, Rectangles, Ovals ▪A▪Arcs, Polygons, Polylines ▪P▪Program

Drawing Strings ▪To draw items on a component, create a class that extends the JPanel class and overrides the paintComponent(Graphics) method ▪The Graphics class defines a method drawString(String, int x, int y) ›The string passed into the method is drawn at location (x, y) of the parent component USC CSCI 201L7/23 Strings, Lines, Rectangles, Ovals

Drawing a String 1 import java.awt.Graphics; 2 import javax.swing.JFrame; 3 import javax.swing.JPanel; 4 5 public class Test extends JFrame { 6 public Test() { 7 super("Graphics Example"); 8 add(new NewPanel()); 9 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 10 setSize(250, 225); 11 setLocationRelativeTo(null); 12 setVisible(true); 13 } public static void main(String args[]) { 16 Test t = new Test(); 17 } 18 } class NewPanel extends JPanel { 21 protected void paintComponent(Graphics g) { 22 super.paintComponent(g); 23 g.drawString("CSCI 201", 0, 40); 24 } 25 } USC CSCI 201L8/23 Graphics

Drawing Lines ▪The Graphics class defines a method drawLine(int x1, int y1, int x2, int y2) ›A straight line is drawn from location (x1, y1) of the parent component to (x2, y2) of the parent component USC CSCI 201L9/23 Strings, Lines, Rectangles, Ovals

Drawing a Line 1 import java.awt.Graphics; 2 import javax.swing.JFrame; 3 import javax.swing.JPanel; 4 5 public class Test extends JFrame { 6 public Test() { 7 super("Graphics Example"); 8 add(new NewPanel()); 9 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 10 setSize(250, 225); 11 setLocationRelativeTo(null); 12 setVisible(true); 13 } public static void main(String args[]) { 16 Test t = new Test(); 17 } 18 } class NewPanel extends JPanel { 21 protected void paintComponent(Graphics g) { 22 super.paintComponent(g); 23 g.drawLine(0, 0, 100, 50); 24 } 25 } USC CSCI 201L10/23 Graphics

Drawing Rectangles ▪The Graphics class defines two methods for drawing regular rectangles ›drawRect(int x, int y, int w, int h) ›fillRect(int x, int y, int w, int h) USC CSCI 201L11/23 Strings, Lines, Rectangles, Ovals

Drawing Rounded Rectangles ▪The Graphics class defines two methods for drawing rounded rectangles ›drawRoundRect(int x, int y, int w, int h, int aw, int ah) aw is the horizontal diameter of the arcs at the corner ah is the vertical diameter of the arcs at the corner ›fillRoundRect(int x, int y, int w, int h, int aw, int ah) USC CSCI 201L12/23 Strings, Lines, Rectangles, Ovals

Drawing 3D Rectangles ▪The Graphics class defines two methods for drawing 3D rectangles ›The third dimension is not very visible though ›draw3DRect(int x, int y, int w, int h, boolean raised) ›fill3DRect(int x, int y, int w, int h, boolean raised) USC CSCI 201L13/23 Strings, Lines, Rectangles, Ovals raised=falseraised=true raised=falseraised=true

Drawing Ovals ▪The Graphics class defines two methods for drawing ovals ›drawOval(int x, int y, int w, int h) ›fillOval(int x, int y, int w, int h) USC CSCI 201L14/23 Strings, Lines, Rectangles, Ovals

Outline USC CSCI 201L15/23 ▪G▪Graphics ▪S▪Strings, Lines, Rectangles, Ovals ▪A▪Arcs, Polygons, Polylines ▪P▪Program

Drawing Arcs ▪An arc is part of an oval bounded by a rectangle ▪The Graphics class defines two methods for drawing arcs ›drawArc(int x, int y, int w, int h, int startAngle, int arcAngle) ›fillArc(int x, int y, int w, int h, int startAngle, int arcAngle) USC CSCI 201L16/23 Arcs, Polygons, Polylines

Drawing Polygons ▪A polygon is a closed two-dimensional region bounded by an arbitrary number of edges ▪A polygon consists of a number of (x, y) coordinates that define the vertices of the polygon ›Two successive points are the endpoints of a line that is a side of the polygon ›The first and last points are joined by a line segment ▪There are two ways to create polygons ›Create a Polygon object ›Draw the polygon with an array of x and an array of y values USC CSCI 201L17/23 Arcs, Polygons, Polylines

Drawing Polygons Example #1 1 import java.awt.Graphics; 2 import java.awt.Polygon; 3 import javax.swing.JFrame; 4 import javax.swing.JPanel; 5 6 public class Test extends JFrame { 7 public Test() { 8 super("Graphics Example"); 9 add(new NewPanel()); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 11 setSize(250, 225); 12 setLocationRelativeTo(null); 13 setVisible(true); 14 } public static void main(String args[]) { 17 Test t = new Test(); 18 } 19 } class NewPanel extends JPanel { 22 protected void paintComponent(Graphics g) { 23 super.paintComponent(g); 24 Polygon poly = new Polygon(); 25 poly.addPoint(110, 10); 26 poly.addPoint(160, 10); 27 poly.addPoint(210, 60); 28 poly.addPoint(210, 110); 29 poly.addPoint(160, 160); 30 poly.addPoint(110, 160); 31 poly.addPoint(60, 110); 32 poly.addPoint(60, 60); 33 g.drawPolygon(poly); 34 } 35 } USC CSCI 201L18/23 Arcs, Polygons, Polyline

Drawing Polygons Example #2 1 import java.awt.Graphics; 2 import java.awt.Polygon; 3 import javax.swing.JFrame; 4 import javax.swing.JPanel; 5 6 public class Test extends JFrame { 7 public Test() { 8 super("Graphics Example"); 9 add(new NewPanel()); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 11 setSize(250, 225); 12 setLocationRelativeTo(null); 13 setVisible(true); 14 } public static void main(String args[]) { 17 Test t = new Test(); 18 } 19 } class NewPanel extends JPanel { 22 protected void paintComponent(Graphics g) { 23 super.paintComponent(g); 24 int x[] = {110, 160, 210, 210, 160, 110, 60, 60}; 25 int y[] = {10, 10, 60, 110, 160, 160, 110, 60}; 26 g.drawPolygon(x, y, x.length); 27 } 28 } USC CSCI 201L19/23 Arcs, Polygons, Polyline

Drawing Polylines ▪A polyline is an open two-dimensional region bounded by an arbitrary number of edges ▪A polyline does not join the first and last points as a polygon does ▪There is only one way to create polyline ›Draw the polyline with an array of x and an array of y values USC CSCI 201L20/23 Arcs, Polygons, Polylines

Drawing Polylines Example 1 import java.awt.Graphics; 2 import java.awt.Polygon; 3 import javax.swing.JFrame; 4 import javax.swing.JPanel; 5 6 public class Test extends JFrame { 7 public Test() { 8 super("Graphics Example"); 9 add(new NewPanel()); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 11 setSize(250, 225); 12 setLocationRelativeTo(null); 13 setVisible(true); 14 } public static void main(String args[]) { 17 Test t = new Test(); 18 } 19 } class NewPanel extends JPanel { 22 protected void paintComponent(Graphics g) { 23 super.paintComponent(g); 24 int x[] = {110, 160, 210, 210, 160, 110, 60, 60}; 25 int y[] = {10, 10, 60, 110, 160, 160, 110, 60}; 26 g.drawPolyline(x, y, x.length); 27 } 28 } USC CSCI 201L21/23 Arcs, Polygons, Polyline

Outline USC CSCI 201L22/23 ▪G▪Graphics ▪S▪Strings, Lines, Rectangles, Ovals ▪A▪Arcs, Polygons, Polylines ▪P▪Program

Program ▪Create the following GUI. Make the clock functional to update the arms and the time every second. Look up the Thread.sleep(1000) method to make your program more efficient than using busy waiting. USC CSCI 201L23/23 Program