1. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie COMP 14 Introduction to Programming Adrian Ilie July 21, 2005

2. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 2 Last Time Create a Java window extending JFrame. Add labels with JLabel Add Images with ImageIcon Setting colors and layout

3. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 3 Example: LowerUpperCase

4. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 4 Basics Layout: GridLayout(3,2) JLabel to output result JTextField to input sentence 4 buttons

5. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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"); toLower.setText(“Convert to Lower Case"); content.add(toLower); toLower.setEnabled(false);

8. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 10 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

11. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 14 ExitHandler.actionPerformed We simply need to exit the system System.exit(0);

15. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 15 ClearHandler.actionPerformed Clear JTextField input and JLabel output input.setText(“”); output.setText(“”); setVisible(true);

16. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 17 Example: LowerUpperCase Finish example

18. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 20 Converting Apps to Applet See Ch 13, pgs. 855-858 (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

21. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 21 Example: LowerUpperCase Convert to Applet

22. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 24 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

25. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 25 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

26. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 26 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

27. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 27 Color and Images You can add color or an image to the background: ♦ color: make body tag ♦ image: make body tag

28. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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: Why not fly? second: Why not fly?

29. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 29 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

30. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 30 Other Tags Bold ♦ and Italic ♦ and Center ♦ and Comments ♦

31. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 31 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... ♦

32. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 32 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)

33. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 33 Tables You can also create tables Beginning: ♦ options: border, cellspacing, cellpadding Each row: Each column:

34. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 34 Links This is the important part. This is how you go from page to page. text to be displayed

35. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 35 Inserting Images You can also just add an image into the middle of the page Use

36. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 36 Tutorials Quick Reference http://werbach.com/barebones/barebones.html http://www.htmlcodetutorial.com/ http://www.w3.org/MarkUp/Guide/ Want To Learn More?

37. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 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. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 38 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

39. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 39 Finish Homework 6 (due Saturday night) ♦ Sort ints ♦ Create array of Participant objects ♦ Read data into Participant objects ♦ Sort Participant objects Start Homework 7 (due Monday 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