COMP 110: Introduction to Programming Tyler Johnson Apr 20, 2009 MWF 11:00AM-12:15PM Sitterson 014

COMP 110:Introduction to Programming

Tyler JohnsonApr 20, 2009

MWF 11:00AM-12:15PMSitterson 014

COMP 110: Spring 20092

Announcements

Lab 8 has been graded

Milestone 1 has been graded


Questions?


Today in COMP 110

Go over Lab 8

Java Graphics

Programming Demo


Lab 8


Computer Graphics

Computer Graphics is about producing images with a computer

This can be useful in a variety of ways

User interfaces (dialog boxes, icons, windows)Special effects (movies, games, etc)Image editing (photoshop)Visualizing scientific data


Graphics in Java

Java provides some useful classes & functionality for adding graphics to your programs


Your First Graphics Program

import javax.swing.JApplet;import java.awt.Graphics;

public class HappyFace extends JApplet {

public void paint(Graphics canvas) {

canvas.drawOval(100, 50, 200, 200);canvas.fillOval(155, 100, 10, 20);canvas.fillOval(230, 100, 10, 20);canvas.drawArc(150, 160, 100, 50, 180, 180);

}}

Where’s the main method?


Applets

public class HappyFace extends JApplet

Our HappyFace class inherits from the class JApplet

This means that our program is an applet instead of a normal application

An applet is program that is meant to be run in a web browser

We’ll use it as an easy way to get some graphics capability


Applets

Applets do not have a main methodThey can’t be run like a normal application (using the red running man icon in jGRASPWe need to use the apple icon to run the applet


Drawing to Screen



}

Applets use a method called paint in order to draw to screen

This method is called for you automatically when you start the applet


Screen Coordinate System

(0,0)x-

axis

y-

axis

(100,50)

50 pixels

100 pixels


Drawing Shapes

//draw oval at position 100, 50, of width and height 200canvas.drawOval(100, 50, 200, 200);

//draw a “filled-in” oval at position 155, 100 with w=10, h=20canvas.fillOval(155, 100, 10, 20);

//draw a “filled-in” oval at position x=230, y=100 with w=10, h=20canvas.fillOval(230, 100, 10, 20);

//draw an arc, details in the text on pgs 33-34canvas.drawArc(150, 160, 100, 50, 180, 180);


The Graphics Class

What is the canvas object?An object of the Graphics class

The graphics class knows how to draw things like shapes to the screen


Setting the Color

The Graphics class also provides the capability to change the color that shapes are drawn with

Example//draw a yellow ovalcanvas.setColor(Color.YELLOW);canvas.drawOval(100, 50, 200, 200);

//now draw a black ovalcanvas.setColor(Color.BLACK);canvas.drawOval(100, 50, 200, 200);


Drawing Text to the Screen

We can display text on the screen using the drawString method

drawString(string, xPos, yPos)

Example

//print at string and position (60, 75)canvas.drawString("This will be printed to the screen", 60, 75);


String Drawing Example

import javax.swing.JApplet;import java.awt.Graphics;

public class HappyFace extends JApplet {



canvas.drawString("This is a happy face!", 50, 50);}

}


Drawing Polygons

A polygon is a closed figure made up of line segments that do NOT cross


Drawing Polygons

You can draw a polygon by giving the locations of the corners

There are two functions you can usedrawPolygon• Draws an unfilled polygon (just the edges)

fillPolygon• Draw a filled polygon

p1

p2

p3p4

p5


Drawing Polygons

Syntaxcanvas.drawPolygon(X_Array, Y_Array, Num_Points)canvas.fillPolygon(X_Array, Y_Array, Num_Points)

Example

int[] xHouse = {150, 150, 200, 250, 250};int[] yHouse = {100, 40, 20, 40, 100};

canvas.drawPolygon(xHouse, yHouse, xHouse.length);


Creating Dialog Boxes

Dialog boxes are special windows that can be used to take input from the user or to display output


Dialog Boxes

Dialog boxes can be created using the JOptionPane classimport javax.swing.JOptionPane;

public class JOptionPaneDemo {

public static void main(String[] args) {

String name = JOptionPane.showInputDialog("Enter your name:");

JOptionPane.showMessageDialog(null, "Hi " + name + "!"); System.exit(0);}

}


Input Dialogs

Input dialogs take input from the user in the form of a string

We use the showInputDialog method of the JOptionPane class

ExampleString name = JOptionPane.showInputDialog("Enter your

name:")


Output Dialogs

Output dialogs are used to display a message to the user

We use the showMessageDialog method of the JOptionPane class

ExampleJOptionPane.showMessageDialog(null, "Hi " + name + "!");


Methods of JOptionPane

If showInputDialog and showMessage Dialog are called using the class name JOptionPane, what kind of methods must they be?

Static, a JOptionPane object is never created

String name = JOptionPane.showInputDialog("Enter your name:");

JOptionPane.showMessageDialog(null, "Hi " + name + "!");


Exiting the Program


String name = JOptionPane.showInputDialog("Enter your name:"); JOptionPane.showMessageDialog(null, "Hi " + name + "!"); System.exit(0);}

At the end of the program we called System.exit(0)

This is necessary to get the program end when using things like windows/dialog boxes etc.


Confirmation Windows

We can also create dialog boxes that provide the user with the options “Yes” and “No”

These are called confirmation windows


Confirmation Windows

import javax.swing.JOptionPane;

public class JOptionPaneDemo2 {


while(true) {

int answer = JOptionPane.showConfirmDialog(null, "End Program?",

"Click Yes or No:", JOptionPane.YES_NO_OPTION);

if(answer == JOptionPane.YES_OPTION) System.exit(0); else if(answer == JOptionPane.NO_OPTION) System.out.println("One more time"); else System.out.println("Error");

} }}


Creating the Window

int answer = JOptionPane.showConfirmDialog(null, "End Program?",

"Click Yes or No:", JOptionPane.YES_NO_OPTION);


Checking the Result

if(answer == JOptionPane.YES_OPTION)System.exit(0);

else if(answer == JOptionPane.NO_OPTION)System.out.println("One more time");

elseSystem.out.println("Error");


Programming Demo

Improving our HouseFill the house with a colorDraw a doorDraw a window


Programming Demo

(150, 100)

(150, 40)

(200, 20)

(250, 40)

(250, 100)

(0,0)x-

axis

y-

axis

(175, 100)

(175, 60) (200, 60)

(200, 100)

(220, 60)

(220, 80)

(240, 80)

(240, 60)

(150, 120)


Programming Demo

Programming


Wednesday

Begin reviewing for final

Documents

COMP 110: Introduction to Programming Tyler Johnson Apr 20, 2009 MWF 11:00AM-12:15PM Sitterson 014