1. Applets, HTML and GUI’s Recitation – 04/11/2008 CS 180 Department of Computer Science, Purdue University

2. Announcements Project 8 has been posted.  Develop a Graphical User Interface for the Music Application.  Use posted project 6 solution. Milestone due 16 th April. Final submission due 23 th April.

3. Introduction HyperText Markup Language (HTML) is the language used to create Web documents. Applets are simply Java programs designed to run from a document (page) on the World Wide Web.

4. HTML Documents to be read on the Web or using a Web browser typically are expressed in a language called HTML. HTML stands for HyperText Markup Language. Hypertext contains links (or hyperlinks) which permit you to go to other documents. One can place Applets into an HTML document.

5. HTML, cont. HTML is not a general-purpose programming language like Java. Instead, it is a collection of commands that can produce something that can be viewed using a Web browser. The commands allow you to include pictures and hyperlinks, and allow you to specify headings, subheadings, paragraph beginnings, etc.

6. HTML Basics Most HTML commands are of the form Some text Example-  Anything between and is centered on the page when it is displayed.  begins a new line.  begins a new paragraph. Commands such as and form a “container” (in this case a table container).  Overloading of the word ‘Container’ between Java and HTML.

7. HTML : document outline

8. HTML Basics, cont. The entire document is enclosed between and. The head of the document is enclosed between and.  It might consist only of a title enclosed between and, used to name the document.  The body is enclosed between and and is the real content of the document.

9. Inserting Hyperlinks, cont. A key element in an HTML document is a link that a person can click to view another document. example CS180 Home The path to document can be either a full path name or a relative path name to a HTML file or a URL to any place on the Web.  Examples-  Details

10. Displaying a Picture A picture can be inserted into an HTML document using Example OR The picture can be in any directory, but the path name, either full or relative, leading to the picture must be provided.

11. Applets: Introduction Applets are Java programs that are typically displayed on a Website and viewed over the Internet. An applet can also be run as a stand-alone program on a computer using an applet viewer. An applet is a derived class of class JApplet which is a class in the Swing library.

12. Applets: Class hierarchy

13. Applet Basics, cont. A JApplet is a Container, which permits you to add components to it in the same way you add components to a JFrame. Differences from JFrame:  Applets do not use the setVisible method or the setTitle method, nor do they need any size instructions.  Applets are displayed automatically, and do not need to have a main method.  Applets typically do not use constructors. Instead they use method init which serves the same purpose.

14. Applet Example class HelloApplet

15. Running an Applet Applets are compiled the same way other Java classes are compiled. The normal way to run an applet is as part of a Web document.  The applet then is viewed using a Web browser. An applet can also be viewed using an applet viewer which is a program designed to run an applet as a stand-alone program.

16. Adding Icons to an Applet, cont. class DukeApplet

17. Adding Icons to an Applet, cont. ImageIcon is a class in the Swing library. syntax ImageIcon nameOfImageIcon = new ImageIcon(Picture_File_Name);  Picture_File_Name is a string giving either a relative or absolute path name to the picture file.  The dukeIcon is to the left of the label by default. This can be changed if desired.  Also, an ImageIcon be any size image.

18. Applets in HTML An Applet can be placed in an HTML Document. To display an applet window, place the following command in an HTML document: (Actually “.class” is optional. code=“AdderApplet” is equivalent to code=“AdderApplet.class” )

19. Example of Applet placed in HTML DukeIcon! The DukeIcon Home Page Hello out there!! This is a CS180 Applet example <applet code="DukeApplet.class“ width=400 height=200> Like that?

20. Example, contd.

21. Quiz G Can you run an applet program from the command line as shown: $ javac DukeApplet.java $ java DukeApplet Why or why not?