1 Review of applets & Computer Graphis GUILecture 6 Review of Applets & Compute Graphics GUI Overview  Introduction to Graphics. Applets: a quick review.  Some Classes for Graphics in Java.  Drawing Geometric Figures »Lines, Rectangles, Ovals, Arcs  Coloring Graphics Shapes.  Applications with Many Frames  Example Displaying Images 

2 Review of applets & Computer Graphis GUILecture 6 Writing Applets Always extends the JApplet class, which is a subclass of Applet for Swing components. Override init(), start(), stop(), and destroy() if necessary. By default, these methods are empty. l Add your own methods and data if necessary. l Applets are always embedded in an HTML page.

3 Review of applets & Computer Graphis GUILecture 6 The HTML Tag < applet code=classfilename.class width=applet_viewing_width_in_pixels height=applet_viewing_height_in_pixels [archive=archivefile] [codebase=applet_url] [vspace=vertical_margin] [hspace=horizontal_margin] [align=applet_alignment] [alt=alternative_text] >

4 Review of applets & Computer Graphis GUILecture 6 The Color Class Color c = new Color(r, g, b); r, g, and b specify a color by its red, green, and blue components. Example: Color c = new Color(128, 100, 100); You can use the following methods to set the component’s background and foreground colors: setBackground(Color c) setForeground(Color c) Example: setBackground(Color.yellow); setForeground(Color.red);

5 Review of applets & Computer Graphis GUILecture 6 The Font Class Font myFont = Font(name, style, size); Example: Font myFont = new Font("SansSerif ", Font.BOLD, 16); Font myFont = new Font("Serif", Font.BOLD+Font.ITALIC, 12); public void paint(Graphics g) { Font myFont = new Font("Times", Font.BOLD, 16); g.setFont(myFont); g.drawString("Welcome to Java", 20, 40); //set a new font g.setFont(new Font("Courier", Font.BOLD+Font.ITALIC, 12)); g.drawString("Welcome to Java", 20, 70); }

6 Review of applets & Computer Graphis GUILecture 6 Drawing Geometric Figures Drawing Lines drawLine(x1, y1, x2, y2); Drawing Rectangles drawRect(x, y, w, h); fillRect(x, y, w, h); Rounded Rectangles drawRoundRect(x, y, w, h, aw, ah); fillRoundRect(x, y, w, h, aw, ah); Drawing Arcs drawArc(x, y, w, h, angle1, angle2); fillArc(x, y, w, h, angle1, angle2);

7 Review of applets & Computer Graphis GUILecture 6 Java Support for Graphics: Common Classes As shown in the previous applet example, Java AWT (Abstract Windowing Toolkit) package provides a collection of classes your programs can use to perform graphics operations. Some of the common classes are: java.awt Color Component Font FontMetrics GraphicsPolygon contains methods and constants for manipulating fonts contains methods and constants for obtaining font information contains methods for drawing strings, lines, rectangles and other shapes contains methods and constants for manipulating colors contains methods for creating polygons

8 Review of applets & Computer Graphis GUILecture 6 import java.applet.Applet; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.Rectangle; public class RectangleApplet extends Applet { public void paint (Graphics g) { Graphics2D g2 = (Graphics2D)g; Rectangle rectangle = new Rectangle(10,10,50,50); g2.draw(rectangle); } // End of paint() method } // End of RectangleApplet class Using Applet to draw a rectangle Default color: Black

9 Review of applets & Computer Graphis GUILecture 6 Experience with Graphics: Example 1 import java.awt.*; public class FrameTest1 { public static void main(String[] args) { MyFrame frame = new MyFrame(); frame.setTitle("Graphics Using Frames"); frame.show(); } // End of main method } // End of class FrameTest1 class MyFrame extends Frame { public MyFrame() { final int FRAME_WIDTH = 300; final int FRAME_HEIGHT = 300; setSize(FRAME_WIDTH, FRAME_HEIGHT); } // End of MyFrame() constructor public void paint(Graphics g) { g.drawString("Hello world!",100,100); } // End of paint() method } // End of MyFrame class Here is an example of simple plain text on a frame.

10 Review of applets & Computer Graphis GUILecture 6 Experience with Graphics: Example 2 public class FrameTest1 { public static void main(String[] args) { MyFrame frame = new MyFrame(); frame.setTitle("Graphics Using Frames"); frame.show(); } // End of main method } // End of class FrameTest1 Now, let us change the font size and color of the text. import java.awt.*; class MyFrame extends Frame { public MyFrame() { final int FRAME_WIDTH = 300; final int FRAME_HEIGHT = 300; setSize(FRAME_WIDTH, FRAME_HEIGHT); } // End of MyFrame() constructor public void paint(Graphics g) { Graphics2D g2 = (Graphics2D)g; final int size = 48; Color myColor = new Color(0.9F, 0.3F, 0.5F); Font myFont = new Font("Times", Font.BOLD, size); g2.setColor(myColor); g2.setFont(myFont); g2.drawString("Hello World!",60,150); } // End of paint() method } // End of MyFrame class

11 Review of applets & Computer Graphis GUILecture 6 Applications with Many Frames one can develop standalone graphical applications with more than one window frame as shown in the example below: class MyFrame1 extends Frame { public MyFrame1() { final int FRAME_WIDTH = 300; final int FRAME_HEIGHT = 300; setSize(FRAME_WIDTH, FRAME_HEIGHT); } // End of MyFrame() constructor public void paint(Graphics g) { g.drawString("Hello world!",100,100); } // End of paint() method } // End of MyFrame1 class

12 Review of applets & Computer Graphis GUILecture 6 Applications with Many Frames (Cont’d) class MyFrame2 extends Frame {public MyFrame2() { final int FRAME_WIDTH = 500; final int FRAME_HEIGHT = 300; setSize(FRAME_WIDTH, FRAME_HEIGHT); } // End of MyFrame() constructor public void paint(Graphics g) { Graphics2D g2 = (Graphics2D)g; final int size = 48; Color myColor = new Color(0.9F, 0.3F, 0.5F); Font myFont = new Font("Times", Font.BOLD, size); g2.setColor(myColor); g2.setFont(myFont); g2.drawString("Hello World!",60,150); } // End of paint() method }

13 Review of applets & Computer Graphis GUILecture 6 Applications with Many Frames (Cont’d) import java.awt.*; import java.applet.*; public class MultiFrameTest1 { public static void main(String[] args) { MyFrame1 frame1 = new MyFrame1(); frame1.setTitle("Graphics Using Frame 1"); frame1.setSize(300, 300); frame1.show(); MyFrame2 frame2 = new MyFrame2(); frame2.setTitle("Graphics Using Frame 2"); frame2.setSize(300, 300); frame2.show(); } // End of main method } // End of class MultiFrameTest1

14 Review of applets & Computer Graphis GUILecture 6 Java Support for Graphics: Component Class public void paint(Graphics g); This method must be overridden by the programmer to produce some desired effect. Note that this is the same paint() method that was used in the previous applet example and the Applet class inherited it from Component class. When you make a change to the data, your drawing is not automatically updated. You must tell the window manager that the data has changed, by calling the repaint method.  When any graphical t object is displayed, the paint() method is called automatically.  To explicitly call paint() method, repaint() method of the same object must called.  Then, repaint() method calls update() method which in turn calls paint().  Note that repaint() method performs some system-dependent tasks and should thus NOT be overridden.  The update() method is often called directly and can be overridden to enable “smoothening” of animations in multimedia applications.

15 Review of applets & Computer Graphis GUILecture 6 Displaying Images Java currently supports two image formats: GIF (Graphics Interchange Format) and JPEG(Joint Photographic Expert Group). Image filename for each of these types end with.gif and jpg. To display an image, you need to perform the following steps 1- Retrieve the image from a file or from an Internet source 2-Draw the image. To load an image from a local file or download it from an internet source you need to use getImage() method in the Applet class. To load image from the specified URL: public Image getImage(URL url) You need to draw an image in a graphics context. The Graphics class has the drawImage()method for displaying an image drawImage(Image img, int x, int y, Color bgcolor, ImageObserver observer) Observer is the object on which the image is displayed.

16 Review of applets & Computer Graphis GUILecture 6 Example Displaying Images import java.applet.*; import java.awt.*; import java.awt.event.*; public class DisplayImageApplet extends Applet implements ActionListener { private ImageCanvas c; //the canvas for displaying image private TextField tfFilename; //the name of the image file private Button btShow; //the "Show" button public void init() { //create Panel p1 to hold a text field and a button Panel p1 = new Panel(); p1.setLayout(new FlowLayout()); p1.add(new Label("Filename")); p1.add(tfFilename = new TextField(" ", 10)); p1.add(btShow = new Button("Show")) // place an ImageCanvas object and p1 in the frame setLayout(new BorderLayout()); add("Center", c = new ImageCanvas()); add("South", p1); c.setBackground(Color.gray); //register listener btShow.addActionListener(this); tfFilename.addActionListener(this); } //handling the "Show" button public void actionPerformed(ActionEvent e) { if ((e.getSource() instanceof Button) || (e.getSource() instanceof TextField)) displayImage(); }

17 Review of applets & Computer Graphis GUILecture 6 Example Displaying Image(Cont.) private void displayImage() { //retrieving image Image image = getImage (getCodeBase(), tfFilename.getText().trim()); //show image in the canvas c.showImage(image); } //define the canvas for showing an image class ImageCanvas extends Canvas { private String filename; private Image image = null; public ImageCanvas() { } //set image public void showImage(Image image) { this.image = image; repaint(); } public void paint(Graphics g) { if (image != null) g. drawImage (image, 0, 0, getSize().width, getSize().height, this); }

18 Review of applets & Computer Graphis GUILecture 6 Example Displaying Image(Cont.)