COMP 14 Introduction 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 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

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 Tags are not printed to the screen Example tags: –,,, A lot of the time they work in pairs: – and HTML is not case-sensitive – and are the same thing

Very Simple Web Page Simple web page This is the text on a web page. View any web page source by choosing Source from the View menu in a web browser

What Do The Tags Mean?, –go at the beginning and end of EVERY page, –introduction of the document, –what goes in the title bar of the window, –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 –image: make body tag

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: Why not fly? second: Why not fly?

Adding White Space Putting at the beginning of a paragraph and at the end will put a blank line between two pieces of text You can also use to insert a carriage return (aka ) will insert a horizontal line

Other Tags Bold – and Italic – and Center – and Comments –

Hierarchical Structure For documents having a hierarchical structure, you can use heading tags – marking chapter in a book – marking section of a chapter – marking subsection of a chapter – and so on down... –

Lists There are two kinds of lists: –Ordered lists (surrounded by and –Unordered lists (surrounded by and Both use and to indicate List Items (things in the list)

Tables You can also create tables Beginning: –options: border, cellspacing, cellpadding Each row: Each column:

Links This is the important part. This is how you go from page to page. text to be displayed

Inserting Images You can also just add an image into the middle of the page Use

Tutorials Quick Reference 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. Applets and the Web

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