COMP 14 Introduction to Programming

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

2. Last Time • Create a Java window extending JFrame. • Add labels with JLabel • Add Images with ImageIcon • Setting colors and layout

3. Example: LowerUpperCase

4. Basics • Layout: GridLayout(3,2) • JLabel to output result • JTextField to input sentence • 4 buttons

5. 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”);

6. 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

7. 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"); content.add(toLower); toLower.setText(“Convert to Lower Case"); toLower.setEnabled(false);

8. 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

9. 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); }

10. ActionListener • In order to handle an event, define a class that will implementActionListener. • Make the class ButtonHandler an internal class of our main class. • In ButtonHandler, code the method actionPerformed private class ButtonHandler implements ActionListener

11. 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);

12. 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

13. 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

14. ExitHandler.actionPerformed • We simply need to exit the system System.exit(0);

15. ClearHandler.actionPerformed • Clear JTextField input and JLabel output input.setText(“”); output.setText(“”); setVisible(true);

16. 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) … }

17. Example: LowerUpperCase • Finish example

18. 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;

19. 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

20. 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, orsetSize methods

21. Example: LowerUpperCase • Convert to Applet

22. 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/

23. 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.

24. 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

25. 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

26. 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

27. 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">

28. 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> Why not fly? </BODY>

29. 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

30. Other Tags • Bold • <B> and</B> • Italic • <I> and </I> • Center • <CENTER> and </CENTER> • Comments • <!-- and -->

31. 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>

32. 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)

33. Tables • You can also create tables • Beginning: <TABLE> </TABLE> • options: border, cellspacing,cellpadding • Each row: <TR> </TR> • Each column: <TD> </TD>

34. 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>

35. Inserting Images • You can also just add an image into the middle of the page • Use <IMG SRC="put URL here">

36. Want To Learn More? • Tutorials • Quick Reference http://www.htmlcodetutorial.com/ http://www.w3.org/MarkUp/Guide/ http://werbach.com/barebones/barebones.html

37. 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

38. Applets and the Web • 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> <applet code="ClassName.class" height=200 width=300> </applet>

39. To do • 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)