A korábbi cikkemben megkezdtem a WAP bemutatását, egy-két használható szerkesztőfelületet és a megtekintéshez szükséges eszközök bemutatásával, no meg az alapokat ismertettem. Az ott megígértek szerint folytatása következik. Íme:
A WAP nyelv a HTML nyelv leegyszerűsített változata és megtalálható benne az a lehetőség, hogy más oldalakra hivatkozzunk. A WML-ben ugyanúgy néz ki egy hivatkozás mint a HTML nyelvben. A szöveget ami „aktiválja” a hivatkozást, az a tagba zárjuk és a URL címet pedig a href értékben adjuk meg. Ismét egy példa:
1. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card title="Oldal hivatkozassal">
<p>Ha unatkozni fogsz, latogass el egy
<a href="http://wap.cybersex.nl">erotikus
oldalra</a> kozvetlenul a telefonod kijelzojen.</p>
</card>
</wml>
1. kép: Az aktuális hivatkozás ki van emelve
Az oldalak többsége több „kártyát” tartalmaz. Az előnye a gyorsaságában rejlik - amikor a felhasználó válogat a kártyák között, akkor a telefon nem vesz fel kapcsolatot a szerverrel, mert már előzőleg a memóriájában eltárolta az adott oldalt minden „kártyájával” együtt.
Amikor a telefon az oldalt lehúzta, mindig sorrendben jelennek meg a kártyák (például nem a 2. számú kártya lesz a nyitólap). Ha azt szeretnénk, hogy a felhasználó eljusson valamelyik másik „kártyára”, muszáj kézzel kiviteleznünk a hivatkozást (a sorrendet beállítani). A WAP-böngésző tudniillik egyszerre csak egy „kártyát” tud megjeleníteni.
Ha a kártyák között szeretnénk hivatkozást létrehozni, muszáj lesz a kártyákat egyértelműen megjelölnünk. Az oldal neve tulajdonképpen az id értéke. Hivatkozást a kártyára úgy készítünk, ha ezt használjuk: #kártya_neve - amit megadunk id-nek azt írjuk a kártya_neve helyére. Ez első hallásra így nem biztos, hogy egyértelmű, a valóságban azért egyszerűbb. Ezért itt egy újabb példa:
2. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card title="Elso kartya" id="elso">
<p>Sziasztok!<br/>
A legerdekesebb informaciok a<a
href="#masodik">masodik kartyan vannak</a>.</p>
</card>
<card title="Masodik kartya" id="masodik">
<p>Na ez nem volt teljesen igaz. Lehetseges, hogy jobban orulnetek ha visszaugornatok
<a href="#elso">az elso kartyara</a>.</p>
</card>
</wml>
2. kép: Hivatkozás két kártya között
A hagyományos hivatkozásoktól eltérően (amelyek a szöveg egy részében van elhelyezve), léteznek másféle navigációs elemek is, amelyeket sokkal kényelmesebb használni a hagyományos társaikhoz képest.
Minden kártyánál a do objektum segítségével definiálhatunk olyan akciókat, amelyeket könnyen előhívhatunk valamilyen billentyűvel, vagy a menüből választjuk ki az adott akciót a telefonon - a konkrét elérhetősége függ az adott böngészőtől.
A <do> tagnak két attribútuma van: a type és a label. Az első közülük az, amelyikkel definiálunk, a másodikat pedig talán már ki is találhattátok - ez egy címke. Ha beszúrjuk az accept értéket, gondoljuk, hogy a felhasználó valamit elfogad - például: kiválasztás a menüből, ugrás másik kártyára, stb. Használhatjuk még a prev értéket is, amely arra szolgál, hogy visszalépjünk az előző oldalra. A telefonok többségén erre a visszalépésre van egy speciális gomb és ez az akciót (visszalépést) automatikusan feltérképezi.
A do tartalma azt mutatja be, hogy mi történik akkor, ha a felhasználó kiválasztja az adott opciót. Legtöbbször a go objektumot használjuk, amely megengedi az ugrást bármilyen másik oldalra vagy kártyára a megadott URL címmel a href attribútumban. A képeken láthatjuk, hogy hogyan fest ugyanaz az oldal két különböző böngészőben:
A go helyére lehet beszúrni az üres prev objektumot, amely arra szolgál, hogy visszaugorjunk. Tehát úgy működik mint a Vissza gomb a böngészőkben.
4. kép: Némely telefonon menüből választhatjuk ki, hogy hova szeretnénk ugorni-
3. kép: - és némelyikben csak egyet kell kattintanunk
Itt egy kis példa a bemutatásához:
3. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card title="Első kártya" id="elso">
<do type="accept" label="Következő kártya">
<go href="#masodik"/>
</do>
<p>Helló<br/>
A legérdekesebb információk a második oldalon találhatok.</p>
</card>
<card title="Második kártya" id="masodik">
<do type="prev" label="Vissza">
<prev/>
</do>
<p>Hát ez nem teljesen igaz. Inkább ugorj vissza.</p>
</card>
</wml>
Vissza gombnak minden kártyán kellene lennie. A felhasználókkal gyakran(!) megtörténik, hogy rossz helyre ugornak, és oda jutnak ahová egyáltalán nem akartak. A vissza gombbal könnyen visszaugorhat, és a helyes címre ugorhat. Minden kártyához hozzáadni a do objektumot a beállításokkal elég fáradságos munka. A WML nekünk ebben is segít: megengedi, hogy az oldal elejére a template objektumba beletegyük a beállításokat, amelyek elérhetőek lesznek az összes kártyán. Ennek eredményeképpen kisebbek lesznek az oldalaink. A template objektumot akkor használjuk, ha oldalunkon több kártya van. Egy kis példa:
4. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<template>
<do type="prev" label="Vissza">
<prev/>
</do>
</template>
<card title="Első kartya" id="elso">
<do type="accept" label="Következő">
<go href="#masodik"/>
</do>
<p>Szia!<br/>
A legjobb szöveget a második kártyán találod.</p>
</card>
<card title="Masodik kartya" id="masodik">
<p>Itt nincs semmilyen jó szöveg, ugorj vissza az első oldalra!</p>
</card>
</wml>
Ezeknek megjelenítési képe ugyanaz mint a 4. vagy a 3. kép.
A WML nyelv alapjaival az előzőekben már megismerkedtünk (kösz ha eddig elolvastad) . Most már rátérhetünk az egyéb dolgokra is - képek behelyezése és táblák készítése. Ezekkel a tulajdonságokkal már nekiláthatunk egy teljes WAP oldal elkészítésének. A későbbiekben bemutatom, hogy hogyan lehet - hová? mit? - elhelyezni, hogy a többi WAP felhasználó is láthassa.
A telefonok képernyője eléggé kicsi, ezért az információkat jól kell elhelyeznünk. Pont erre jók a táblák.
A tábla a table tagba kerül. Itt még be kell állítanunk a columns értéket, hogy a táblának mennyi oszlopa legyen. A táblában - mint a HTML esetében is - az egyes oszlopelemek egy sorba kerülnek. Minden sor a tr tagba és minden elem a td tagba van zárva.
A táblák használatával valóban egyszerű például egy árfolyamos WAP-oldalt készíteni. Jöjjön rá egy kis példa:
5. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card title="Árfolyamok">
<p>
<table columns="2">
<tr>
<td>Pénznem</td>
<td>Árfolyam</td>
</tr>
<tr>
<td>DEM</td>
<td>99.46</td>
</tr>
<tr>
<td>ATS</td>
<td>1.70</td>
</tr>
<tr>
<td>USD</td>
<td>10.46</td>
</tr>
</table>
</p>
</card>
</wml>
4. kép: Egyszerű tábla a böngészőben
A táblák formázása a WML-ben nagyon korlátozott. Az egyetlen dolog, amit beállíthatunk, az a táblák szövegének elrendezése. Minden oszlopnál beállíthatjuk, hogy a kockában a szöveg merre legyen elrendezve: balra, jobbra, vagy középre. Az elrendezést az align értékkel állítjuk be. Minden oszlop tartalmaz egy betűt, ez állítja be, hogy merre álljon a kocka. Az `L' a balra igazításért, a `R' jobbra és a középre igazításért pedig a `C' betű felel. A kijavított árfolyam oldalunk jobban fog kinézni, mert egymás alatt lesznek a számok, betűk. Egy újabb példa következik:
6. példa:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card title="Árfolyamok">
<p>
<table align="CR" columns="2">
<tr>
<td>Pénznem</td>
<td>Árfolyam</td>
</tr>
<tr>
<td>DEM</td>
<td>19.46</td>
</tr>
<tr>
<td>ATS</td>
<td>2.70</td>
</tr>
<tr>
<td>USD</td>
<td>40.46</td>
</tr>
</table>
</p>
</card>
</wml>
5. kép: Egyszerű tábla szövegigazítással. Azért így már egy kicsit csinosabb, nem?
Itt még szót kell ejtenem, hogy a nagyon régi telefonok (pl. Nokia 7110) nem kezelik a táblákat. Ilyeneknél minden kocka új sorban jelenik meg:
6. kép: A nagyon régi telefonok így jelenítik meg a táblázatokat:
Ennyi elég lesz mára. A következő fejezetre tartogatok nektek egy igazán érdekes dolgot:
A képek használatát.
Az időzítőt
A következő órán nekikezdünk a WmlScriptnek is.
Ha ezeken túljutottunk nekikezdünk a WAP PHP-nek, stb.-.
A forráskódokat is elérheted a CD-n.