COMP 14 Introduction to Programming Miguel A. Otaduy June 8, 2004.

COMP 14Introduction to Programming

Miguel A. Otaduy

June 8, 2004

Last Time

• Create a Java window extending JFrame.

• Add labels with JLabel

• Add Images with ImageIcon

• Setting colors and layout

Example: LowerUpperCase

Basics

• Layout: GridLayout(3,2)

• JLabel to output result

• JTextField to input sentence

• 4 buttons

JLabel and JTextField

• Very similar. With JTextField we can also type data from outside and access it in the program.

JLabel output=new JLabel();JTextField input=new JTextField();…String inputStr=input.getText();output.setText(“OUTPUT RESULT”);

Using Buttons

• Create JButton objects

• Buttons generate events when clicked

• Add event handlers

• Inside event handler, code operations to be executed when button is clicked

Adding Buttons

• To create a button, we use the JButton class

• Add button to the content pane

• Change text of the button with the setText method

• Enable/disable the button with setEnabled method

JButton toLower = new JButton (“To Lower Case");

toLower.setText(“Convert to Lower Case");

content.add(toLower);

toLower.setEnabled(false);

Buttons and Events

• Pressing buttons triggers action events

• Setup a listener for the event– actionPerformed method from ActionListener class

– ActionListener class from the java.awt.event package• something else to import

ActionListener

• Special type of class, called interface

• Interface - class that contains only the method headings (no method bodies)

public interface ActionListener{

public void actionPerformed (ActionEvent e);}

ActionListener

• In order to handle an event, define a class that will implement ActionListener.

• Make the class ButtonHandler an internal class of our main class.

• In ButtonHandler, code the method actionPerformed

private class ButtonHandler implements ActionListener

ActionListener

• Declare a ButtonHandler that will be a data member of the main class.

• Instantiate the ButtonHandler (e.g. in the constructor)

• Once the JButton object is created, register the action listener:

private ButtonHandler toLowerHandler;

toLowerHandler=new ButtonHandler();

toLower.addActionListener(toLowerHandler);

Example: LowerUpperCase• Declare buttons: toLowerButton, toUpperButton, exitButton, clearButton

• Instantiate buttons• Add buttons to the content pane• Implement ActionListener classes

that will handle events: ButtonHandler, ExitHandler, ClearHandler

• Register action listeners

actionPerformed

• Variables we want to access inside the actionPerformed methods, must be declared as member variables of the main class– not local to constructor

• Make input, output, and the buttons member variables

ExitHandler.actionPerformed

• We simply need to exit the system

System.exit(0);

ClearHandler.actionPerformed

• Clear JTextField input and JLabel output

input.setText(“”);

output.setText(“”);

setVisible(true);

ButtonHandler.actionPerformed

• How do we know which button we pressed (toLower or toUpper)?

public void actionPerformed(ActionEvent e){JButton pressed=(JButton)(e.getSource());if(pressed==toLower)

…else if(pressed==toUpper)

…}

Example: LowerUpperCase

• Finish example

Applets

• A Java application is a stand-alone program with a main method

• A Java applet is a Java program that is intended to be transported over the web and executed using a web browser– an applet doesn't have a main

method– needs an extra import statement:import java.applet.Applet;

Applet Methods

• Several methods from Applet class that are invoked automatically at certain points in an applet's life– init - executed only once when the applet

is initially loaded– start - called when applet becomes active

(when browser loads / returns to the page)– stop - called when applet becomes inactive

(when browser leaves the page)– paint - automatically executed and is used

to draw the applets contents

Converting Apps to Applet• See Ch 13, pgs. 745-748• Extends JApplet instead of JFrame• No main method• No constructor

– put code from constructor in init() method

• No setVisible, setTitle, or setSize methods

Example: LowerUpperCase

• Convert to Applet

Want to Learn More?

• Creating a GUI with Swing

• Creating Applets

http://java.sun.com/docs/books/tutorial/uiswing/

http://java.sun.com/docs/books/tutorial/applet/

Writing Web Pages

• Web pages are written in a "markup" language called HTML (HyperText Markup Language)

• HTML is NOT a programming language.

• HTML just tells the computer how to format text and images--it's like using Word, but having to type in what you want things to look like.

Tags

• HTML works based on the concept of tags. A tag is some text surrounded by < and >

• Tags are not printed to the screen• Example tags:

– <HTML>, <TITLE>, <P>, <H1>

• A lot of the time they work in pairs:– <HTML> and </HTML>

• HTML is not case-sensitive– <HTML> and <html> are the same thing

Very Simple Web Page

<HTML><HEAD><TITLE>Simple web page</TITLE></HEAD><BODY>This is the text on a web page.</BODY></HTML>

View any web page source by choosing Source from the View menu in a web browser

What Do The Tags Mean?• <HTML>, </HTML>

– go at the beginning and end of EVERY page

• <HEAD>, </HEAD>– introduction of the document

• <TITLE>, </TITLE>– what goes in the title bar of the window

• <BODY>,</BODY>– the text (and other stuff) that is displayed in the

window

Color and Images

• You can add color or an image to the background:– color: make body tag

<BODY BGCOLOR=RED>

– image: make body tag<BODY

BACKGROUND="image.gif">

Ignores White Space

• In HTML, where you put a line break is ignored. The web browser decides this for you based on the size of the window

• These two will print the same thing:first:

<BODY>Why not fly?</BODY>

second:<BODY>Whynot fly?</BODY>

Adding White Space

• Putting <P> at the beginning of a paragraph and </P> at the end will put a blank line between two pieces of text

• You can also use <BR> to insert a carriage return (aka <enter>)

• <hr> will insert a horizontal line

Other Tags

• Bold– <B> and</B>

• Italic– <I> and </I>

• Center– <CENTER> and </CENTER>

• Comments– <!-- and -->

Hierarchical Structure

• For documents having a hierarchical structure, you can use heading tags– <H1> marking chapter in a book – <H2> marking section of a chapter– <H3> marking subsection of a chapter– <H4> and so on down...– <H5>

Lists

• There are two kinds of lists:– Ordered lists (surrounded by <OL>

and </OL>– Unordered lists (surrounded by <UL>

and </UL>

• Both use <LI> and </LI> to indicate List Items (things in the list)

Tables

• You can also create tables

• Beginning: <TABLE> </TABLE>– options: border, cellspacing, cellpadding

• Each row: <TR> </TR>• Each column: <TD> </TD>

Links

• This is the important part. This is how you go from page to page.

• <A HREF="put URL here">text to be displayed</A>

Inserting Images

• You can also just add an image into the middle of the page

• Use <IMG SRC="put URL here">

• Tutorials

• Quick Reference

http://werbach.com/barebones/barebones.html

http://www.htmlcodetutorial.com/

http://www.w3.org/MarkUp/Guide/

Want To Learn More?

Applets and the Web

• An applet is embedded into an HTML file using a tag that references the bytecode file (ClassName.class) of the applet class

• It is actually the bytecode version of the program that is transported across the web

• The applet is executed by a Java interpreter that is part of the browser– this Java interpreter not included in Windows

XP, must download from java.com

• Basic HTML file for an applet:

• Can also specify size of applet window

• Put the applet HTML file (named something.html) and your Java applet bytecode (named ClassName.class) in your public_html folder in AFS space.

<html> <body> <applet code = "ClassName.class"></applet> </body> </html>

Applets and the Web

<applet code="ClassName.class" height=200 width=300> </applet>

• Finish Homework 6 (due Wednesday night)– Sort ints– Create array of Participant objects– Read data into Participant objects– Sort Participant objects

• Start Homework 7 (due Friday night)– Access AFS disk space– Create simple web page (just one line in the

body)– Play around with UpperLower.java

• Bring laptops to the remaining classes (review & practice)

To do