web design & development lecture 18. java graphics

21
Web Design & Development Lecture 18

Upload: daniela-adams

Post on 24-Dec-2015

216 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: Web Design & Development Lecture 18. Java Graphics

Web Design & DevelopmentLecture 18

Page 2: Web Design & Development Lecture 18. Java Graphics

Java Graphics

Page 3: Web Design & Development Lecture 18. Java Graphics

Graphics

• Window is like a painter’s canvas

• App must paint its window contents• Java components paint themselves

• Anything else: Programmer

• When to paint?

• How to paint?JButton

Page 4: Web Design & Development Lecture 18. Java Graphics

MyApp

Page 5: Web Design & Development Lecture 18. Java Graphics

Open WinExp, Notepad

Page 6: Web Design & Development Lecture 18. Java Graphics

Close WinExplorer

Repaint event sent to: MyApp, Desktop

Page 7: Web Design & Development Lecture 18. Java Graphics

Desktop gets repaint event

Page 8: Web Design & Development Lecture 18. Java Graphics

MyApp gets repaint event

MyApp JPanel gets repaint event

Page 9: Web Design & Development Lecture 18. Java Graphics

MyApp gets repaint event

MyApp JPanel forwards repaint event to JButton

Page 10: Web Design & Development Lecture 18. Java Graphics

Painting a Swing Component

• Three methods are at the heart of painting a swing component– paintComponent()– paintBorder()– paintChildren()

Page 11: Web Design & Development Lecture 18. Java Graphics

The Swing Painting Methods

• It's one of three methods, that objects of type JComponent use to paint themselves. The three methods are invoked in this order:

– paintComponent — The main method for painting. By default,

it first paints the background. Then it performs any custom painting.

– paintBorder — Tells the component's border (if any) to paint. Do not invoke or override this method.

– paintChildren — Tells any components contained by this component to paint themselves. Do not invoke or override this method

Page 12: Web Design & Development Lecture 18. Java Graphics

The following figure illustrates the order in which each component that inherits from JComponent paints itself. Steps 1 and 2 — painting the background and performing custom painting — are performed by the paintComponent method. Step 3 is performed by paintBorder, and step 4 is performed by paintChildren

Page 13: Web Design & Development Lecture 18. Java Graphics

• An Example of Painting • To illustrate painting, we'll use the

swingApplication program. Here is its GUI:

Page 14: Web Design & Development Lecture 18. Java Graphics

Your Painting Strategy

• Steps– Subclass JPanel

• class MyPanel extends JPanel

– Override the paintComponent(Graphics g) method• Inside method using graphics object Do whatever drawing

you want to do

– Install that JPanel inside a JFrame• When frame becomes visible through the paintChildren()

method your panel become visible• To become visible your panel will call paintComponent()

method which will do your custom drawing

Page 15: Web Design & Development Lecture 18. Java Graphics

Example Code: MyPan1.javaimport javax.swing.*;import java.awt.*;

public class MyPan1 extends JPanel {

public void paintComponent(Graphics g){ super.paintComponent(g); // erasing behaviour

Graphics2D g2 = (Graphics2D)g;

g2.drawRect(20,20,20,20); g2.setColor(Color.blue); g2.fillOval(50,50,20,20);

g2.drawString("Hello World", 120, 50);

} }

Page 16: Web Design & Development Lecture 18. Java Graphics

Example Code: Test1.javaimport javax.swing.*;import java.awt.*;

public class Test1{

JFrame f; MyPan1 p;

public Test1(){

f = new JFrame(); Container c = f.getContentPane();

c.setLayout(new BorderLayout());

p = new MyPan1(); c.add(p);

f.setSize(400,400); f.setVisible(true); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

} // end constructor

Page 17: Web Design & Development Lecture 18. Java Graphics

Example Code: Test1.java public static void main(String args[ ]){

Test1 t = new Test1();

}

} // end class

Page 18: Web Design & Development Lecture 18. Java Graphics

Output

Page 19: Web Design & Development Lecture 18. Java Graphics

Graphics PrimitivesDraw Fill

• Point (x,y)

• Line (pt1,pt2)

• PolyLine (pt list)

• Arc

• Oval (pt, w,h)

• Rectangle (pt, w,h)• RoundRectangle

• Polygon (pt list)

• Image (file, x,y)

• Text (string, x,y) label

Page 20: Web Design & Development Lecture 18. Java Graphics

Graphics Attributes• Color

• Font

• Stroke attributes:– Line width, dash, end caps, joins, miter

• Paint attributes:– Color, gradient, texture

• Composite:– Blending

• Transforms:– Translate, rotate, flip, shear, scale

Page 21: Web Design & Development Lecture 18. Java Graphics

Color

• Combinations of Red, Green, Blue

• Each [0, 255]

• Java: new Color(255, 150, 0)

Hokie Orange