Introduction to Applets and Graphics

1
Chapter 4

• Introduction to Applets and Graphics

2
Topics

• Applet Structure
• Executing an Applet
• Drawing Shapes with Graphics Methods
• Using Colors

3
Applets

• A Java application is a stand-alone program with
  a main method (like the ones we've seen so far)
• A Java applet is a program that is intended to
  transported over the Web and executed using a web
  browser
• An applet also can be executed using the
  appletviewer tool of the Java Software
  Development Kit
• An applet doesn't have a main method
• Instead, there are several special methods that
  serve specific purposes

4
Applets

• Executed by a browser or applet viewer
• Opens a window, as well as the Java console
• Applet viewer comes with Java Software
  Development Kit (SDK)

5
Java Translation Execution
Java source code
Across the Internet using HTML
Java bytecode
Java compiler
Web browser
Java interpreter
Java interpreter
Bytecode compiler
Remote computer
Local computer
Machine code
6
Applet Structure

• Do not use main method
• Two methods called automatically
• init method
• Browser calls init when applet starts
• Use to initialize variables and objects
• paint method
• Browser calls after init and whenever window
  needs to be redrawn
• Use to draw to screen

7
Example 4.01 ShellApplet.java

• import javax.swing.JApplet
• import java.awt.Graphics
• public class ShellApplet extends JApplet
• // declare variables here
• public void init( )
• // initialize data here
• public void paint( Graphics g )
• super.paint( g )
• // include graphics code here

8
Executing an Applet

• A Web page tells the browser to run the applet
• HTML tags come in pairs, data goes between start
  and end tags
• ltHTMLgt lt/HTMLgt start and end of HTML
  code
• ltHEADgt lt/HEADgt start and end of header
• ltTITLEgt lt/TITLEgt text to display in title bar
• ltBODYgt lt/BODYgt start and end of page
  content

9
ltAppletgt Tag

• ltAPPLETgt
• CODE Classname.class
• CODEBASE . directory of class file
• WIDTH nnn width of window in pixels
• HEIGHT nnn height of window in pixels
• lt/APPLETgt

10
Minimal HTML File

• ltHTMLgt
• ltHEADgt
• ltTITLEgtTitleNamelt/TITLEgt
• lt/HEADgt
• ltBODYgt
• ltAPPLET CODE"ClassName.class"
• CODEBASE.
• WIDTHnnn
• HEIGHTnnngt
• lt/APPLETgt
• lt/BODYgt
• lt/HTMLgt

11
HTML File for FirstApplet

• ltHTMLgt
• ltHEADgt
• ltTITLEgtMy First Appletlt/TITLEgt
• lt/HEADgt
• ltBODYgt
• ltAPPLET CODE"FirstApplet.class"
• CODEBASE.
• WIDTH400
• HEIGHT300gt
• lt/APPLETgt
• lt/BODYgt
• lt/HTMLgt

12
Executing an Applet

• If HTML file is named FirstApplet.html, you can
  execute the applet using this command
• appletviewer FirstApplet.html
• Many IDEs automatically create and launch the
  HTML file for running an applet

13
Applets in jGrasp

• To run an applet in jGrasp, just click on the
  apple button
• An applet viewer will automatically be opened

14
The Graphics Class

• Browser or appletviewer sends a Graphics object
  to the paint method
• The Graphics object represents the applet window,
  current font, and current color
• Provides methods to draw shapes and text on the
  window

15
The Graphics Coordinate System
 
16
Drawing Shapes

• Let's explore some of the methods of the Graphics
  class that draw shapes in more detail
• A shape can be filled or unfilled, depending on
  which method is invoked
• The method parameters specify coordinates and
  sizes
• Recall that the Java coordinate system has the
  origin in the top left corner
• Shapes with curves, like an oval, are usually
  drawn by specifying the shapes bounding
  rectangle
• An arc can be thought of as a section of an oval

17
Graphics Class Methods

• Methods are available for drawing lines,
  rectangles, ovals, and other shapes, and for
  setting the current color
• All methods have a void return type, so method
  calls are standalone statements
• draw methods draw an outlined share
• fill methods draw a solid shape

18
Displaying Text

• Example
• g.drawString( "Hello", x, y )
• See Example 4.4 DrawingTextApplet.java

19
Drawing a Line

• g.drawLine( xStart, yStart, xEnd, yEnd )
• See Example 4.5 LineDrawingApplet.java

20
Drawing a Line
10
150
20
45
21
Drawing A Rectangle

• g.drawRect( x, y, width, height )

22
Drawing a Rectangle
50
20
page.drawRect (50, 20, 100, 40)
23
Drawing A Solid Rectangle

• g.fillRect( x, y, width, height )

24
Drawing An Oval

• g.drawOval( x, y, width, height )

25
Drawing an Oval
175
20
bounding rectangle
page.drawOval (175, 20, 50, 80)
26
Drawing A Solid Oval

• g.fillOval( x, y, width, height )

27
Drawing Squares and Circles

• To draw a square, use drawRect or fillRect with
  equal values for width and height.
• To draw a circle, use drawOval or fillOval with
  equal values for width and height

28
Example 4.6 ShapeDrawingApplet.java

• public void paint( Graphics g )
• super.paint( g )
• g.drawRect( 100, 50, 40, 100 ) //
  rectangle
• g.fillRect( 200, 70, 80, 80 ) // solid
  square
• g.fillOval( 100, 50, 40, 100 ) // oval
  inside the rectangle
• g.drawOval( 100, 200, 100, 40 ) //
  same-size oval rotated 90 degrees
• int centerX 250, centerY 225
• int radius 25
• g.drawOval( centerX - radius, centerY -
  radius,
• radius 2, radius 2 ) //
  circle using radius and center

29
(No Transcript)
30

• When drawing a figure using Graphics methods,
  specify coordinate values as offsets from a
  starting (x,y) coordinate.
• This will make your figure easier to move or
  resize.

31
Example 4.7 Astronaut.java

• import javax.swing.JApplet
• import java.awt.Graphics
• public class Astronaut extends JApplet
• int sX, sY // starting x and y coordinates
• public void init( )
• sX 95
• sY 20

32

• public void paint( Graphics g )
• super.paint( g )
• // helmet
• g.drawOval( sX 60, sY, 75, 75 )
• g.drawOval( sX 70, sY 10, 55, 55 )
• // face
• g.drawOval( sX 83, sY 27, 8, 8 )
• g.drawOval( sX 103, sY 27, 8, 8 )
• g.drawLine( sX 97, sY 35, sX 99, sY
  43 )
• g.drawLine( sX 97, sY 43, sX 99, sY
  43 )
• g.drawOval( sX 90, sY 48, 15, 6 )
• // neck
• g.drawRect( sX 88, sY 70, 20, 10 )
• // torso

33

• // arms
• g.drawRect( sX, sY 80, 65, 20 )
• g.drawRect( sX 130, sY 80, 65, 20 )
• // legs
• g.drawRect( sX 70, sY 165, 20, 80 )
• g.drawRect( sX 105, sY 165, 20, 80 )
• // flag
• g.drawLine( sX 195, sY 80, sX 195 , sY
  )
• g.drawRect( sX 195, sY, 75, 45 )
• g.drawRect( sX 195, sY, 30, 25 )
• // caption
• g.drawString( "One small step for man", sX
  25, sY 270 )

34
(No Transcript)
35
Representing Color

• A black and white picture can be stored using one
  bit per pixel (0 white and 1 black)
• A colored picture requires more information
  there are several techniques for representing
  colors
• For example, every color can be represented as a
  mixture of the three additive primary colors Red,
  Green, and Blue (RGB system)
• In Java, each color is represented by three
  numbers between 0 and 255 that collectively are
  called an RGB value (one byte per color stored)

36
Using Color

• Every drawing surface has a background color
• The Graphics context has a current foreground
  color
• Both can be set explicitly
• All drawing is done in current color the current
  color is in effect until changed
• The default color is black.
• To use color, import the Color class from the
  java.awt package

37
The Color Class

• A color is defined in a Java program using an
  object created from the Color class
• The Color class also contains several static
  predefined colors, including

38
static Color Constants

• Color.BLACK Color.GRAY
• Color.WHITE Color.ORANGE
• Color.RED Color.YELLOW
• Color.GREEN Color.PINK
• Color.BLUE Color.MAGENTA
• Color.CYAN
• Color.LIGHT_GRAY
• Color.DARK_GRAY

39
Setting the Current Color

• Example
• g.setColor( Color.RED )

40
Custom Colors

• Colors consist of red, green, and blue components
  (RGB).
• Color constructor
• Example
• Color green new Color( 0, 255, 0 )

41
AstronautWithColor.java

• import javax.swing.JApplet
• import javax.swing.JOptionPane
• import java.awt.Graphics
• import java.awt.Color
• public class AstronautWithColor extends JApplet
• int sX, sY
• Color spacesuit
• public void init( )
• spacesuit new Color( 195, 175, 150 )
• sX Integer.parseInt( JOptionPane.showInputDi
  alog
• ( null, "Enter the starting x
  position") )
• sY Integer.parseInt( JOptionPane.showInputDi
  alog
• ( null, "Enter the starting y
  position") )

42

• public void paint( Graphics g )
• super.paint( g )
• // helmet
• g.setColor( spacesuit )
• g.fillOval( sX 60, sY, 75, 75 )
• g.setColor( Color.LIGHT_GRAY )
• g.fillOval( sX 70, sY 10, 55, 55 )
• // face
• g.setColor( Color.DARK_GRAY )
• g.drawOval( sX 83, sY 27, 8, 8 )
• g.drawOval( sX 103, sY 27, 8, 8 )
• g.drawLine( sX 97, sY 35, sX 99, sY
  43 )
• g.drawLine( sX 97, sY 43, sX 99, sY
  43 )
• g.drawOval( sX 90, sY 48, 15, 6 )
• // neck

43

• // torso
• g.fillRect( sX 65, sY 80, 65, 85 )
• // arms
• g.fillRect( sX, sY 80, 65, 20 )
• g.fillRect( sX 130, sY 80, 65, 20 )
• // legs
• g.fillRect( sX 70, sY 165, 20, 80 )
• g.fillRect( sX 105, sY 165, 20, 80 )
• // flag
• g.setColor( Color.BLACK )
• g.drawLine( sX 195, sY 80, sX 195 , sY
  )
• g.setColor( Color.RED )
• g.fillRect( sX 195, sY, 75, 45 )
• g.setColor( Color.BLUE )
• g.fillRect( sX 195, sY, 30, 25 )

44
(No Transcript)
45
Graphics class methods

• void drawArc (int x, int y, int width, int
  height, int startAngle, int arcAngle)
• void drawLine (int x1, int y1, int x2, int y2)
• void drawOval (int x, int y, int width, int
  height)
• void drawRect (int x, int y, int width, int
  height)
• void drawString (String str, int x, int y)
• void fillArc (int x, int y, int width, int
  height, int startAngle, int arcAngle)
• void fillOval (int x, int y, int width, int
  height)
• void fillRect (int x, int y, int width, int
  height)
• Color getColor( )
• void setColor (Color color)

46
Applet Methods

• In previous examples we've used the paint method
  of the Applet class to draw on an applet
• The Applet class has several methods that are
  invoked automatically at certain points in an
  applet's life
• The init method, for instance, is executed only
  once when the applet is initially loaded
• The start and stop methods are called when the
  applet becomes active or inactive
• The Applet class also contains other methods that
  generally assist in applet processing

47
Applet class methods

• void init ( )
• void start ( )
• void stop ( )
• void destroy ( )
• URL getCodeBase ( )
• URL getDocumentBase ( )
• AudioClip getAudioClip (URL url, String name)
• Image getImage (URL url, String name)