1. Lec.10 + (Chapter 8 & 9) GUI Java Applet Jiang (Jen) ZHENG July 6 th, 2005

2. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 2 Outline Intro. to HTML Intro. To URL HTML Links Java Applet Tags Parsing Parameters to Java Applet init( ) method appletviewer command

3. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 3 Intro. To HTML HTML stands for Hyper Text Markup Language An HTML file is a text file containing small markup tags The markup tags tell the Web browser how to display the page An HTML file must have an htm or html file extension An HTML file can be created using a simple text editor

4. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 4 Intro. To HTML A example of HTML file Title of page This is my first homepage. This text is bold

5. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 5 Intro. To HTML Example Explained The first tag in your HTML document is. This tag tells your browser that this is the start of an HTML document. The last tag in your document is. This tag tells your browser that this is the end of the HTML document. The text between the tag and the tag is header information. Header information is not displayed in the browser window. The text between the tags is the title of your document. The title is displayed in your browser's caption. The text between the tags is the text that will be displayed in your browser. The text between the and tags will be displayed in a bold font. HTML tags are not case sensitive. But XHTML (the next generation HTML) demands lowercase tags.

6. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 6 Tag Attributes Tags can have attributes. Attributes can provide additional information about the HTML elements on your page. Ex1: This tag defines the body element of your HTML page:. With an added bgcolor attribute, you can tell the browser that the background color of your page should be red, like this:. Ex2: This tag defines an HTML table:. With an added border attribute, you can tell the browser that the table should have no borders: Attributes always come in name/value pairs like this: name="value". Attribute values should always be enclosed in quotes, either single quote or double quote. Attributes are always added to the start tag of an HTML element.

7. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 7 HTML Tags Headings: Defined with the to tags. defines the largest heading. defines the smallest heading. Paragraphs: Defined with the tag. HTML automatically adds an extra blank line before and after a paragraph. Line Breaks: Defined with the tag. The tag is an empty tag. It has no closing tag. Comments in HTML: …

8. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 8 Uniform Resource Locator (URL) Some examples of the most common schemes can be found below: SchemeAccess fileA file on your local PC ftpA file on an FTP server httpA file on a World Wide Web Server telnetA Telnet connection

9. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 9 HTML Links To make a hypertext link: Surround the text you want to be linked with tags. Inside the tag place an HREF attribute whose value is the URL you want to link to. Ex1: lab5 Ex2: Last Page Link to your Mail system: someone@w3schools.com

10. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 10 Absolute URL & Relative URL Absolute URL: a completely specified URL Relative URL: If any piece of the URL is missing, it is assumed to be the same as that of the document in which the URL is found. Such a URL is called a relative URL Ex: http://www.ibiblio.org/javafaq/books.html click on this hyperlink the FAQ http://www.ibiblio.org/javafaq/books.html The browser cuts books.html off the end Get http://www.ibiblio.org/javafaq/http://www.ibiblio.org/javafaq/ Then it attaches javafaq.html onto the end to get http://www.ibiblio.org/javafaq/javafaq.html

11. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 11 Absolute URL & Relative URL If the relative link begins with a /, then it is relative to the document root instead of relative to the current file. Ex: while browsing http://www.ibiblio.org/javafaq/books.html clicked on this hyperlink:http://www.ibiblio.org/javafaq/books.html Your browser would throw away /javafaq/javafaq.html and attach /boutell/faq/www_faq.html to the end of http://www.ibiblio.org to get http://www.ibiblio.org/boutell/faq/www_faq.html. http://www.ibiblio.org http://www.ibiblio.org/boutell/faq/www_faq.html Relative URLs have a number of advantages. First they save a little typing. More importantly relative URLs allow entire trees of HTML documents to be moved or copied from one site to another without breaking all the internal links.

12. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 12 The Applet Element Applet Tags and Applet Attributes code: where to look for the compiled.class file codebase: contains a URL that points at the directory where the.class file is Width, height: how big a rectangle the browser should set aside for the applet

13. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 13 Parsing Parameters to Applet Parameters are passed to applets in NAME=VALUE pairs in and tags Using the getParameter() method to read parameter values

14. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 14 Example Java File: import java.applet.*; import java.awt.*; public class DrawStringApplet extends Applet { private String defaultMessage = "Hello!"; public void paint(Graphics g) { String inputFromPage = this.getParameter("Message"); if (inputFromPage == null) inputFromPage = defaultMessage; g.drawString(inputFromPage, 50, 25); }

15. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 15 Example HTML File: Draw String This is the applet: This page will be very boring if your browser doesn't understand Java.

16. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 16 The init( ) method init( ) in Java Applet is like the main( ) in Java Application. It is called exactly once in an applet's life, when the applet is first loaded. To read PARAM tags, start downloading any other images or media files you need, and set up the user interface.

17. CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10 17 The appletviewer command To run a Java Applet, using appletviewer command Ex: appletviewer MiniCalcApplet.htm Let us study the MiniCalcApplet example from the textbook, compare this applet with the MiniCalc application...