View
217
Download
2
Category
Preview:
Citation preview
Lec.10 + (Chapter 8 & 9) GUIJava Applet
Jiang (Jen) ZHENG
July 6th, 2005
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
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
CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10
4
Intro. To HTML
A example of HTML file<html>
<head>
<title>Title of page</title>
</head>
<body> This is my first homepage.
<b>This text is bold</b>
</body>
</html>
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 <html>. This tag tells your browser that this is the start of an HTML document. The last tag in your document is </html>. This tag tells your browser that this is the end of the HTML document.
The text between the <head> tag and the </head> tag is header information. Header information is not displayed in the browser window.
The text between the <title> tags is the title of your document. The title is displayed in your browser's caption.
The text between the <body> tags is the text that will be displayed in your browser.
The text between the <b> and </b> tags will be displayed in a bold font.
HTML tags are not case sensitive. But XHTML (the next generation HTML) demands lowercase tags.
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:
<body>. With an added bgcolor attribute, you can tell the browser that the background color of your page should be red, like this: <body bgcolor="red">.
Ex2: This tag defines an HTML table: <table>. With an added border attribute, you can tell the browser that the table should have no borders: <table border="0">
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.
CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10
7
HTML Tags
Headings: Defined with the <h1> to <h6> tags. <h1> defines the largest heading. <h6> defines the smallest heading.
Paragraphs: Defined with the <p> tag. HTML automatically adds an extra blank line before and after a paragraph.
Line Breaks: Defined with the <br> tag. The <br> tag is an empty tag. It has no closing tag.
Comments in HTML: <!-- This is a comment -->
…
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:
Scheme Accessfile A file on your local PC
ftp A file on an FTP server
http A file on a World Wide Web Server
telnet A Telnet connection
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
<a></a> tags. Inside the <a> tag place an HREF attribute
whose value is the URL you want to link to. Ex1: <a href= “Labs/Lab5” > lab5 </a> Ex2: <a href= “lastpage.htm” > Last Page </a>
Link to your Mail system: <a href="mailto:someone@w3schools.com">
someone@w3schools.com</a>
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 <a href="javafaq.html">the FAQ</a> The browser cuts books.html off the end Get http://www.ibiblio.org/javafaq/ Then it attaches javafaq.html onto the end to get http://www.ibiblio.org/javafaq/javafaq.html
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: <a href="/boutell/faq/www_faq.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.
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.
CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10
12
The Applet Element
Applet Tags <applet> and </applet>
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
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 <param> and </param> tags
Using the getParameter() method to read parameter values
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);
}
}
CS401/COE401 Summer 2005.Department of Computer Science.University of Pittsburgh.Lecture 10
15
Example
HTML File:
<HTML><HEAD> <TITLE> Draw String </TITLE> </HEAD> <BODY> This is the applet:<P> <APPLET code="DrawStringApplet" width="300" height="50"><PARAM name="Message" value="Howdy, there!"> This page will be very boring if your browser doesn't understand Java. </APPLET> </BODY> </HTML>
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.
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 ...
Recommended