Applets

CS 3331 Fall 2009

Outline

Basics of applets First applet HelloWorldApplet.java More on applets Animation applet digital clock

What Are Applets?

An applet is a special Java program that can be embedded in HTML documents. It is automatically executed by (appletenabled) web browsers. In Java, non-applet programs are called applications.

Application vs. Applet

Application

Trusted (i.e., has full access to system resources) Invoked by Java Virtual Machine (JVM, java), e.g., java HelloWorld Should contain a main method, i.e., public static void main(String[]) Not trusted (i.e., has limited access to system resource to prevent security breaches) Invoked automatically by the web browser Should be a subclass of class java.applet.Applet

Applet

Examples

HelloWorld.java
public class HelloWord { public static void main(String[] args) { System.out.println(Hello, World!); } }

HelloWorldApplet.java

First Java Applet

Java source in HelloWorldApplet.java

import java.awt.*; import java.applet.Applet; public class HelloWorldApplet extends Applet { public void paint(Graphics g) { Dimension d = getSize(); g.setColor(Color.BLACK); g.fillRect(0, 0, d.width, d.height); // paint background g.setFont(new Font("San-serif", Font.BOLD, 24)); g.setColor(new Color(255, 215,0)); g.drawString("Hello, world!", 60, 40); g.drawImage(getImage(getCodeBase(), Rabbit.jpg"), 20, 60, this); } }
6

Graphics Coordinate
(0,0)
x

height

y width

Importing the Applet class

Here is the directive that you need:

import java.applet.Applet;

import is a keyword java.applet is the name of the package A dot ( . ) separates the package from the class Applet is the name of the class There is a semicolon ( ; ) at the end

The java.awt package

awt stands for Abstract Window Toolkit The java.awt package includes classes for:

Drawing lines and shapes Drawing letters Setting colors Choosing fonts

If its drawn on the screen, then java.awt is probably involved!

Importing the java.awt package

Since you may want to use many classes from the java.awt package, simply import them all:
import java.awt.*;

The asterisk, or star (*), means all classes The import directives can go in any order, but must be the first lines in your program

10

The paint method

Our applet is going to have a method to paint some colored rectangles on the screen This method must be named paint paint needs to be told where on the screen it can draw

This will be the only parameter it needs

paint doesnt return any result

11

The paint method, part 2

public void paint(Graphics g) { }

public says that anyone can use this method void says that it does not return a result

A Graphics (short for Graphics context) is an object that holds information about a painting

It remembers what color you are using It remembers what font you are using You can paint on it (but it doesnt remember what you have painted)

12

Colors

The java.awt package defines a class named Color There are 13 predefined colorshere are their fullyqualified names:
Color.PINK Color.RED Color.ORANGE Color.YELLOW Color.MAGENTA Color.GREEN Color.CYAN Color.BLUE

Color.BLACK Color.DARK_GRAY Color.GRAY Color.LIGHT_GRAY Color.WHITE

For compatibility with older programs (before the naming conventions were established), Java also allows color names in lowercase: Color.black, Color.darkGray, etc.

13

New colors

Every color is a mix of red, green, and blue You can make your own colors: new Color( red , green , blue ) Amounts range from 0 to 255 Black is (0, 0, 0), white is (255, 255, 255) We are mixing lights, not pigments Yellow is red + green, or (255, 255, 0)

14

Setting a color

To use a color, we tell our Graphics g what color we want: g.setColor(Color.RED); g will remember this color and use it for everything until we tell it some different color

15

Drawing rectangles

There are two ways to draw rectangles: g.drawRect( left , top , width , height );

g.fillRect(left , top , width , height );

16

The complete applet

import java.applet.Applet; import java.awt.*; // CIT 591 example public class Drawing extends Applet { public void paint(Graphics g) {

g.setColor(Color.BLUE); g.fillRect(20, 20, 50, 30); g.setColor(Color.RED); g.fillRect(50, 30, 50, 30);
}

17

Some more java.awt methods

g.drawLine( x1 , y1 , x2 , y2 ); g.drawOval( left , top , width , height ); g.fillOval( left , top , width , height ); g.drawRoundRect( left , top , width , height ); g.fillRoundRect( left , top , width , height ); g.drawArc( left , top , width , height , startAngle , arcAngle ); g.drawString( string , x , y );

18

Embedding Applet into HTML

HTML source in HelloWorld.html

<!--HelloWorld.html--> <html> <head> <title>HelloWord</title> </head> <body> <center> <applet code="HelloWorldApplet.class" width=300 height=350></applet> </center> <hr/> <a href="HelloWorldApplet.java">The source.</a> </body> </html>
19

Compiling and Running

To compile javac HelloWorldApplet.java Produces HelloWorldApplet.class To run

Open page HelloWorld.htmlfrom web browser or Use appletviewer of JDK appletviewer HelloWorld.html

20

Elements of Applets

Superclass: java.applet.Applet No main method paint method to paint the picture Applet tag: <applet> </applet>

code width and height

21

Outline

Basics of applets First applet HelloWorldApplet.java More on applets Animation applet digital clock

22

Framework-Based Programming

(OO) Frameworks

Semi-complete applications. Provide the structure (backbone) and utilities for applications. Often domain specific. Inversion of control. Examples: applets, GUI frameworks, etc.

23

The Class Applet

j av a.awt.Panel

j av a.applet.Applet destro y() ini t() start() stop()

24

The Life-Cycle of Applet

init()

Called exactly once in an applets life. Called when applet is first loaded, which is after object creation, e.g., when the browser visits the web page for the first time. Used to read applet parameters, start downloading any other images or media files, etc.

25

Applet Life-Cycle (Cont.)

start()

Called at least once. Called when an applet is started or restarted, i.e., whenever the browser visits the web page. Called at least once. Called when the browser leaves the web page.

stop()

26

Applet Life-Cycle (Cont.)

destroy()

Called exactly once. Called when the browser unloads the applet. Used to perform any final clean-up.
init

start

stop

destroy

start

27

Outline

Basics of applets First applet HelloWorldApplet.java More on applets Animation applet digital clock

28

Animation Applet --- Digital Clock

import import import import java.awt.*; java.awt.event.*; javax.swing.*; java.util.Calendar;

public class DigitalClock extends java.applet.Applet { <Fields> <Methods>

An applet must be a subclass of java.applet.Applet.

29

Program Structure
java.applet.Applet

DigitalClock + start(): void + stop(): void + paint(g: Graphics) : void

javax.swing.Timer

<<use>>

java.util.Calendar

<<use>>

<<use>>

java.awt

java.awt.event

30

Methods for Digital Clock

public void start(){...} invoked when entering the web page that contains the applet public void stop(){...} invoked when leaving the web page that contains the applet public void paint(Graphics g){...} paint the picture

31

Field Declarations

protected Timer timer; protected Font font = new Font("Monospaced", Font.BOLD, 48); protected Color color = Color.GREEN;

32

Object Initialization
public DigitalClock() { timer = new Timer(1000, createTimerTickHandler()); } protected ActionListener createTimerTickHandler() { return new ActionListener() { public void actionPerformed(ActionEvent event) { repaint(); } }; }

33

The start() and stop() Methods

public void start() { timer.start(); }

public void stop() { timer.stop(); }

Start and stop the timer Stopped timer will not consume CPU time.

34

The paint() Method

public void paint(Graphics g) { Calendar calendar = Calendar.getInstance(); int hour = calendar.get(Calendar.HOUR_OF_DAY); int minute = calendar.get(Calendar.MINUTE); int second = calendar.get(Calendar.SECOND); g.setFont(font); g.setColor(color); g.drawString(hour / 10 + hour % 10 + ":" + minute / 10 + minute % 10 + ":" + second / 10 + second % 10, 10, 60); }

35

Who Calls the paint()method?

Timer ticks and calls ActionListener.actionPerformed() ActionListener.actionPerformed() calls DigitalClock.repaint() DigitalClock.repaint() calls DigitalClock.paint() The paint() method is usually not called directly.

36

Drawing Strings
g.drawString("A sample string", x, y)

37

HTML Source
<!-- DigitalClock.html --> <html> <head> <title>Digital Clock Applet</title> </head> <body bgcolor=black> <h1>The Digital Clock Applet</h1><p> <applet code=DigitalClock.class width=250 height=80> </applet> <p><hr> <a href=DigitalClock.java>The source</a> </body> </html>

38

The java.awt.Color Class

Instances of the Color class represent colors.
new Color(r, g, b)

where r, g, b are the values of the red, green, and blue components, respectively. They are in the in the range of 0 to 255.
Predefined constants BLACK ORANGE YELLOW BLUE GREEN PINK CYAN LIGHTGRAY RED ARKGRAY MAGENTA WHITE
39

The java.awt.Font Class

Fonts are specified with three attributes:

font name: Serif Sans-serif Monospaced Dialog DialogInput TimesRoman Helvetica Courier font style: PLAIN BOLD ITALIC Styles can be combined: Font.BOLD|Font.ITALIC

font size: a positive integer

A font can be created as follows:

new Font(name, style, size)

40

Exercise

Write an applet class named CuckooDigitalClock that behaves like DigitalClock except that it cuckoos at every hour by playing an audio file cuckoo.au. Hints

To play an audio file, use play(getCodeBase(), cuckoo.au). To get the current time, use the class java.util.Calendar, e.g.,
Calendar calendar = Calendar.getInstance(); int hour = calendar.get(Calendar.HOUR_OF_DAY); int minute = calendar.get(Calendar.MINUTE);

int second = calendar.get(Calendar.SECOND);

41