1 / 51

Wireless Markup Language

Wireless Markup Language. By Er. Balwinder Singh. How to open the WAP toolkit. WML and WMLScript languages. WML is an XML language derived from HDML specification (version 2) by Unwired Planet.

cailin-burch
Download Presentation

Wireless Markup Language

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Wireless Markup Language By Er. Balwinder Singh

  2. How to open the WAP toolkit

  3. WML and WMLScript languages • WML is an XML language derived from HDML specification (version 2) by Unwired Planet. • WML is designed for wireless Web environment and it does not take care of any specific device type. • The language is compact and the user interface model of WML is dedicated to small screens with few press buttons. • WML can be said to be a display language. • WMLScript is a scripting language that can be mixed with WML to provide functionalities in the WAP application like JavaScript in HTML

  4. Card and Deck • WML data is structured as a collection of cards. • A single collection of cards is referred to as a WML deck. • Each card contains structured content and navigation specifications.

  5. Card and Deck

  6. Cards and decks

  7. Type of WML cards. • There are three basic types of cards that you will construct in WML: - • Choice Card: Generally presents a set of menu options to the user. • Data Entry card: Request data from the user for use within the application. • Display card: Displays or presents the result data to the user

  8. Document Prologue • A valid WML deck is a valid XML document and therefore must contain an XML declaration and a document type declaration. • The first two lines define the document prologue that identifies the XML subset. This prologue must be included at the beginning of every WML deck, that is, before each <wml> tag..

  9. Document Prologue 1. <?xml version="1.0"?> 2. <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN“ "http://www.wapforum.org/DTD/wml_1.1.xml">

  10. Cards To declare a card, insert the following:<card id="index" title="My WAP Site" newcontext="true"> This will make a card with the ID index (used for linking) and will display the text:My WAP Siteat the top of the screen.

  11. Cards Closing TagsUnlike with HTML, it is extremely important to close WML tags. If you do not, a page will certainly not work. You must close both the <card> and <wml> tags:</card></wml>

  12. The <p> Tag Just like in HTML the <p> tag is used to show where a paragraph begins and ends. Unlike HTML, though, all text on a WML page must be inside these tags. As with HTML you use the tags as follows:<p>information</p>

  13. Aligning Text Aligning text in WML is nearly exactly the same as in HTML. All aligning must be done using the following <p> tags:Center:<p align="center">Right:<p align="right">

  14. HOW TO CREATE A CARD <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="card1" title="Title"> <p> THIS IS THE FIRST CARD. </p> </card> </wml>

  15. Output of the Program

  16. Align <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="calc" > <p align="center"> This is center alignment. </p> </card> </wml>

  17. Output of the Program

  18. Right Align

  19. Break • The <br/> TagIn WML (as mentioned earlier) all tags must be closed. This causes problems when using old HTML tags (like <Br>) which have no closing tag. To get around this, some tags have had a / put on the end e.g.<Br />This, like in HTML will make a line break

  20. Break <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="calc" > <p align="right"> This Break Here.<br/>after Break </p> </card> </wml>

  21. Output of the program

  22. Text Formatting <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> <b>BOLD</b><br/> <i>ITALIC</i><br/> <u>UNDERLINE</u><br/> </p> </card> </wml>

  23. Output of the Program

  24. Images 1. WAP phones only have monochrome screens, images do not work very well on WML pages. 2. They also use their own image format: WBMP. 3. Images in WML are inserted using the <img> tag, just like in HTML:

  25. Image <img src="logo.wbmp" alt="Logo" />Again, you can see that a / has been added at the end as the <img> tag has no closing tag. Note:It is very important that you also include the alt text as it will be displayed while the image is being downloaded

  26. Image <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="calc" > <p> <img src="cloudy.wbmp" alt="balli"/> </p> </card> </wml>

  27. Output of the Program

  28. Add Another Card • To add another card, all you need to do is put in another <card> tag with a different ID to the others. For example:<card title="About Me" id="about">information</card>would be added below the first card but before the </wml> tag.

  29. Linking 1. There are three ways to link to another WAP site, file or card. 2. Just like in HTML these can either be the full path to a file or a relative link.To link to a WAP site you use the following:<a href="http://gowansnet.waphosts.net/">Gowansnet</a>To link to another file on your site you would use:<a href="links.wml">My Links</a>To link to another card in the same page you use:<a href="#about">About Me</a>

  30. Do Element • The do element gives the user a general mechanism for performing actions on the current card, that is, a card-level user interface element.

  31. Go Task The go element declares a go task, indicating navigation to an URL. If the URL names a WML card or deck, it is displayed. A go executes a push operation on the history stack. syntax • href=href This attribute specifies the destination URI, for • example, the URI of the card to display. • This attribute is required.

  32. Linking of Two Cards • <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" 2. "http://www.wapforum.org/DTD/wml_1.1.xml"> 3. <wml> 4. <card id="First_Card"> 5. <do type="accept" label="Next"> 6. <go href="#Second_Card"/> 7. </do> 8. <p> • Select <b>Next</b> to display the next card. • </p> 11. </card> 12. <card id="Second_Card"> 13. <p> 14. This card contains the following:... 15. </p> 16. </card> </wml>

  33. Line-by-Line Explanation • The first two lines define the document prologue that identifies the XMLsubset. • This prologue must be included at the beginning of every WML deck, that is, before each <wml> tag..

  34. Line-by-Line Explanation • The third line defines the header of the WML deck. • All WML decks must begin with a <wml> tag and end with a </wml> tag. • The fourth line of the deck specifies the header of the first card. • Like decks, cards require begin and end tags, for example, <card> and </card>.

  35. Line-by-Line Explanation • The fifth line defines an action, which specifies what the user agent should do when the user presses a specified function key. • The type attribute identifies the key (ACCEPT) and the label attribute a label name (Next) for the specified key. • The sixth line specifies the action related to the specified key. The href attribute identifies the target URI destination, • for example, the card named Second_Card.

  36. Output Of The Program

  37. Output of the program

  38. Two Cards

  39. Anchor tag <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> <anchor> Linkage <go href="MultiCard.wml"/> </anchor> </p> </card> </wml>

  40. Output of the Program

  41. <Input > element / input tag <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> Name:<input name="user" size="25"/> </p> </card> </wml>

  42. Output of the program

  43. Select and option <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> <select name="tutorial"> <option value="HTML">HTML TUTORIAL</option> <option value="XML">XML TUTORIAL</option> <option value="WAP">WAP TUTORIAL</option> </select> </p> </card> </wml>

  44. Output of the Program

  45. Select option with multiple line <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> <select name="tutorial" multiple="true"> <option value="HTML">HTML TUTORIAL</option> <option value="XML">XML TUTORIAL</option> <option value="WAP">WAP TUTORIAL</option> </select> </p> </card> </wml>

  46. Output of the Program

  47. Input fields <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> Name:<input name="name" type="text"/><br/> Age:<input name="age" type="text" format="*N"/> Sex:<input name="Sex" size="15"/> </p> </card> </wml>

  48. Output of the program

  49. Fieldset <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="First_Card"> <p align="left"> <fieldset title="cd info"> Title:<input name="title" type="text"/><br/> Prize:<input name="prize" type="text"/> </fieldset> </p> </card> </wml>

  50. Output of the Program

More Related