CS324e - Elements of Graphics and Visualization Java2D Graphics.

Slides:



Advertisements
Similar presentations
 2004 Prentice Hall, Inc. All rights reserved. 1 Chapter 30 - Dynamic HTML: Structured Graphics ActiveX Control Outline 30.1Introduction 30.2Shape Primitives.
Advertisements

Introduction to InDesign Understanding the Basics DTB203 Interior Visualisation
Inkscape Tutorial v2.0 Simon Andrews
Java Graphics Section 1 - Multi-File Graphics Programs Section 2 - The Coordinate System and Graphics Context g Section 3 - The Java Drawing and Painting.
1 Graphics -- Introduction zThe use of graphics is common among modern software systems  Java has strong API support for graphics in the java.awt (abstract.
1 Computer Graphics Week6 –Basic Transformations- Translation & Scaling.
Working with Vector Graphics – Lesson 21 Working with Vector Graphics Lesson 2.
©The McGraw-Hill Companies, Inc. Permission required for reproduction or display. Topics  Applets  Classes used for graphics Graphics Point Dimension.
May 11, 1998CS102-02Lecture 7-1 More Graphics in Java CS Lecture 7-1 A picture's worth a thousand words.
1 L38 Graphics and Java 2D™ (3). 2 OBJECTIVES In this chapter you will learn:  To understand graphics contexts and graphics objects.  To understand.
©The McGraw-Hill Companies, Inc. Permission required for reproduction or display. 4 th Ed Chapter Chapter 5 Java Graphics Applets.
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved. 1 Chapter 2 2D Graphics: Basics F The architecture.
Swing Graphics ● Empty Swing containers have no visual appearance except for a background color ● Every JComponent must have a paintComponent method that.
Graphics Images – PictureBox control Drawing graphics - Graphics object Multimedia controls PictureBox control Image property – select image Choose how.
Graphics. Graphics Features in Java Topics to be covered Topics to be covered Graphics Basics Graphics Basics Coordinate System Coordinate System Graphics,
1 Review of COMPSCI 221  Chapters 1-11 in text  User Interfaces will be addressed as a take- home question.
CS324e - Elements of Graphics and Visualization Checkerboard World.
Java Software Solutions Lewis and Loftus Chapter 7 1 Copyright 1997 by John Lewis and William Loftus. All rights reserved. Graphics -- Introduction The.
1 Graphical User Components (II) Outline JTextArea Creating a Customized Subclass of JPanel JPanel Subclass that Handles Its Own Events Windows: Additional.
DHTML: Structured Graphics ActiveX Control
2D Graphics: Rendering Details
Chapter 15 Graphics and Java 2D™ Java How to Program, 8/e (C) 2010 Pearson Education, Inc. All rights reserved.
© 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.
Default Fill & Stroke D Swap Fill & Stroke Shift X None / Gradient > Color < Stroke X Fill (Click to activate) X More about Fill and Stroke:
 Pearson Education, Inc. All rights reserved. 1 Ch 12 Graphics and Java 2D In this chapter you will learn:  To understand graphics contexts.
Introduction to Flash. Topics What is Flash? What can you do with it? Simple animation Complex interactive web application, such as an online store. Starting.
Element. The element Used to dynamically draw graphics using javascript. Capable of drawing paths, circles, rectangles, text, and images.
Chapter 2 Drawing Objects in Adobe Flash. 1.Use the Flash drawing and alignment tools 2.Select objects and apply colors 3.Work with drawn objects 4.Work.
Advanced User Interfaces with Java SD’98 - Session 3206 Ted Faison Faison Computing Inc.
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved. 1 Chapter 3 2D Graphics: Rendering Details.
Drawing and Filling Geometric Shapes. Java comes with more than just points and lines. Within the Graphics2D class, there are also methods for drawing.
Working with Objects. Objectives Create an object Transform an object Arrange and lock an object Step and repeat an object Use Live Distribute Use the.
Java Graphics. Review 3 kinds of elements in components API? Layout managers Events Extend vs. Implement.
Tutorial 2 Drawing Shapes, Adding Text, and Creating Symbols.
INT 840E Computer graphics Introduction & Graphic’s Architecture.
1 Chapter 3 2D Graphics: Rendering Details  Color spaces, paints stroke types  Affine transforms including translation, rotation, scaling, shearing,
SVG for Designers Tom Hoferek. Objectives Introduce SVG Illustrate its capabilities Demonstrate SVG in action Speculate, discuss, answer questions.
Illustrator I I450 Technology Seminar. Bitmap vs. Vector Photoshop = Bitmap Illustrator = Vector Bitmap images are resolution dependent Vector images.
Vector Graphics Digital Multimedia Chap 이병희
© 2010 Delmar, Cengage Learning Chapter 7 Creating Graphics.
Working With Visual Elements
2/17/04© University of Wisconsin, CS559 Spring 2004 Last Time Resampling –Ideal reconstruction –You can only ideally reconstruct band-limited functions.
Introduction to Java Chapter 8 - Introduction to Java Graphics1 Chapter 8 Introduction to Java Graphics.
Lecture 3 Transformations. 2D Object Transformations The functions used for modifying the size, location, and orientation of objects or of the camera.
Creating Graphics in Java CSE301 University of Sunderland Harry R Erwin, PhD.
Graphics and Java2D Chapter Java Coordinate System Origin is in _____________ corner –Behind title bar of window X values increase to the ________.
 2000 Deitel & Associates, Inc. All rights reserved. Chapter 19 – Dynamic HTML: Structured Graphics ActiveX Control Outline 19.1Introduction 19.2Shape.
CS COMPUTER GRAPHICS LABORATORY. LIST OF EXPERIMENTS 1.Implementation of Bresenhams Algorithm – Line, Circle, Ellipse. 2.Implementation of Line,
Java Graphics Opening Discussion zWhat did we talk about last class? zDo you have any questions about the assignment? zOffset between class.
Images Part 11 dbg. 2 Images The form and several controls can display a number of different types of image files in the BackgroundImage Property. These.
Paint Tutorial Created February 2006 Start Paint: Start>Programs>Accessories>Paint.
Adobe InDesign CS5 – Illustrated Unit C: Working with Objects.
Create a camera using basic shapes only. Using the eye dropper to specify a color  Open camera.ai  use the eye dropper tool and click the first swatch.
Advanced Java Screen Update Techniques SD’98 - Session 4406 Ted Faison Faison Computing Inc.
Adobe Illustrator CS5 - Illustrated Unit B: Performing Essential Operations.
Projects: not limited to spec Error checking File filters Create multiple file formats Polygons Filled shapes Etc.
IS502:M ULTIMEDIA D ESIGN FOR I NFORMATION S YSTEM D IGITAL S TILL I MAGES Presenter Name: Mahmood A.Moneim Supervised By: Prof. Hesham A.Hefny Winter.
Main characteristics of Vector graphics  Vector graphics provide an elegant way of constructing digital images (diagrams, technical illustration and.
10/20/2005week71 Graphics, mouse and mouse motion events, KeyEvent Agenda Classes in AWT for graphics Example java programs –Graphics –Mouse events –Mouse.
12 Graphics and Java 2D™.
Drawing Geometric Objects
Lecture 5 Basic geometric objects
Java Graphics CS 2511.
Adobe Flash Professional CS5 – Illustrated
Exercise 28 - Skills Vector tools enable you to create perfectly formed shapes and lines of all sorts. What’s more the vector objects keep their shape.
Graphics -- Introduction
Chapter Lessons Use the Macromedia Flash drawing tools
In this chapter, you will learn the following:
Performing Essential Operations
Presentation transcript:

CS324e - Elements of Graphics and Visualization Java2D Graphics

Render – Heating animal remains to extract fat – generating an image from a (mathematical) model Java2D can handle primitive shapes, text, images The Graphics object is an abstraction used to perform the rendering 2

Graphics Object Properties foreground color - setColor(Color c) background color - setBackground(Color c) font - setFont(Font f) stroke - how wide is brush plus end joints - setStroke(Stroke s) rendering hints - for example anti- aliasing (demo bugs) clip - region to which drawing is constrained 3

Graphics Object Properties Composite - what method to use to combine color data from a new object being drawn to the objects already on the screen Paint - similar to color, allows the creation of gradients Transform - size, position, and orientation of drawing primitives – translate, rotate, scale, shear 4

Transforms Methods to apply an affine transformation – affine transformations alter the coordinates of an object but preserve straight lines and proportions between points on a straight line 5

Examples Translate Rotate – translate after a rotation Scale Shear – If you specify a non-zero x shear, then x values will be more and more shifted to the right the farther they are away from the y axis. For example, an x shear of 0.1 means that the x value will be shifted 10% of the distance the point is away from the y axis. Y shears are similar: points are shifted down in proportion to the distance they are away from the x axis. – Tutorial.html#Java2D-Tutorial-Transforms-Shear Tutorial.html#Java2D-Tutorial-Transforms-Shear 6

Graphics Primitives the Graphics2D fill and draw methods accept parameters of type Shape – polymorphism Built in Shapes – Arc2D – Ellipse2D – Line2d – Polygon – Rectangle2D – and more! 7

Ellipse2D Specify x and y of upper corner of bounding box, width and height abstract class nested classes – Ellipse2D.Double – Ellipse2D.Float 8

Arc2D Multiple constructors ellipse bounds, start angle, extent angle, type – angles in degrees – types: CHORD, OPEN, PIE – "The angles are specified relative to the non-square framing rectangle such that 45 degrees always falls on the line from the center of the ellipse to the upper right corner of the framing rectangle." 9

Arc2D 10 CHORDPIEOPEN start = 30, extent = 110

Fonts Recall the drawString method from the Graphics class: Property of the graphics object is the current font 11

Fonts Font can be changed Font constructors 12

Font Properties Font family names: – DIALOG, DIALOG_INPUT, MONOSPACED, SANS_SERIF, SERIF Styles: – BOLD, ITALIC, PLAIN Size: point size 13

Font Example | operator 14

Checking Available Fonts Last time I ran it, 302 fonts Handles nonexistent fonts gracefully 15

Stroke line width end caps of lines join style for multi-segment lines 16

Stroke parameters: width, cap, join, miterLimit, dash, dash_phase Also constructor with just new line width 17

Sample Stroke From previous slide, – dashed (10, 5), round caps 18

The Clip Restrict area the graphics object will draw on Can be any Shape – so far just primitives, ellipses, rectangles, arcs – More advanced possible 19

The Clip 20

Write a program to draw a circle of Smiley Faces 21

One Smiley Face 22 face size Center face to center eye eye size frame for smile arc

Calculate Eye Distance 23 x, y for center of face center face to center eye distance x distance = hyp * cos(angle) y distance = hyp * sin(angle)

Use Constants! Constants for various dimensions Could even have constants for various ellipses and arcs – no need to recalculate each time if the graphics object is translated and rotated correctly Complete code to draw one face at a given location and angle – generalize the solution!! 24

Drawing Many To draw many smiley faces translate graphics to middle of panel determine angle increment for each face calculate center point for each face – trigonometry again array of colors for faces 25

manyColor 26