helyoWAP

TUTORIAL WML
(13)
Programas comentados: phone18.wml - phone19.wml

Autor: Helio Fonseca Rosa

Esta página contém muitas figuras. Aguarde a carga se a conexão estiver lenta.

Programa  Phone18.wml

Objetivo: Exibir uma tabela de previsão do tempo, como abaixo:
 

 

Phone18.wml (código):

<?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="kard1" title="Previsao do tempo"> 
<p align="center"> 
*** helyoWAP ***
</p>
<p>
<table columns="4"> 
   <tr> 
      <td>Dia</td>
      <td>Tempo</td> 
      <td>MAX</td> 
      <td>min</td>
   </tr> 
   <tr> 
      <td>HOJE</td> 
      <td>Sol</td>
      <td>30</td> 
      <td>26</td>
   </tr> 
   <tr> 
      <td>AMANHA</td> 
      <td>Chuva</td>
      <td>27</td> 
      <td>24</td>
   </tr>
</table> 
</p> 
</card>
</wml>

Para conferência, o autor copiou/colou a listagem acima no "Bloco de Notas" do Windows, o que cancela qualquer tipo de formatação anterior. Em seguida, alinhou todas as linhas à esquerda (o processo de copiar/colar pode trazer algum código espúrio, não visível).   Após, gravou o programa como  phone18.wml. 
Neste processo, o "Bloco de Notas" , automaticamente, mudou a extensão para
phone18.wml.txt!!! . Utilizando o Windows Explorer (recomendado nestes casos) o arquivo foi renomeado para phone18.wml. Em seguida foi testado com êxito no OWG1 Simulator.
O leitor pode utilizar um simulador ou um celular WAP para acessar este programa no seguinte endereço da WEB:
http://sites.uol.com.br/helyomobile/wml/phone18.wml . As telas poderão ter uma aparência diferente, dependo das características técnicas do simulador ou celular utilizado.

Comentários:
Abaixo está a tabela que desejamos, com 3 linhas e 4 colunas.  

Dia

Tempo

MAX

mim

HOJE

SOL

30

26

AMANHA

CHUVA

27

24

Observando o código vemos que cada linha ("row") está entre as tags <tr> e </tr>  (de "table row") e o conteúdo de cada célula está entre as tags <td> e </td> (de "table data")

Os códigos que definem a tabela devem estar entre as tags <table> e </table>.
Se a tabela tem 3 linhas, deveremos ter 3 "duplas"  <tr></tr>.
O número de colunas é um atributo da tag <table>.
Se temos 4 colunas então deveremos especificar <table columns="4">.

Então, para facilitar, planeje e digite seu código a partir de um esboço como este :

<table columns="4">

<tr>
<td>
Dia</td> 
</tr>

 <td>Tempo</td>

<td>MAX</td>

 <td>min</td>

<tr>
<td>
HOJE</td>
</tr>

<td>Sol</td>

<td>30</td>

 <td>26</td>

<tr>
<td>
AMANHA</td>
</tr>

<td>CHUVA</td>

 <td>27</td>

  <td>24</td>

</table>

 As "dados" das células são exibidos sempre alinhadas à esquerda. Os atributos de posicionamento existem na linguagem WML mas não estão habilitados no OWG1 Simulator.

Observação:
Não há programação para o "label" ou tecla "Back". O resultado do seu uso é imprevisível.


  Programa Phone19.wml 

Substituir as palavras "Sol" e "Chuva" no programa anterior por figuras representativas:

Phone19.wml (código)

<?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="kard1" title="Previsao do tempo"> 
<p align="center"> 
*** helyoWAP ***
</p>
<p>
<table columns="4">   
    <tr> 
       <td>Dia</td>
       <td>Tempo</td> 
       <td>MAX</td> 
       <td>min</td>
    </tr> 
    <tr> 
       <td>HOJE</td> 
       <td><img localsrc="sun" alt="" src=""/></td>
       <td>30</td> 
       <td>26</td>
       </tr> 
    <tr> 
       <td>AMANHA</td> 
       <td><img localsrc="rain" alt="" src=""/></td>
       <td>27</td> 
       <td>24</td>
    </tr>
</table> 
</p> 
</card>
</wml>

Para conferência, o autor copiou/colou a listagem acima no "Bloco de Notas" do Windows, o que cancela qualquer tipo de formatação anterior. Em seguida, alinhou todas as linhas à esquerda (o processo de copiar/colar pode trazer algum código espúrio, não visível).   Após, gravou o programa como  phone19.wml. 
Neste processo, o "Bloco de Notas" , automaticamente, mudou a extensão para
phone19.wml.txt!!! . Utilizando o Windows Explorer (recomendado nestes casos) o arquivo foi renomeado para phone19.wml. Em seguida foi testado com êxito no OWG1 Simulator.
O leitor pode utilizar um simulador ou um celular WAP para acessar este programa no seguinte endereço da WEB:
http://sites.uol.com.br/helyomobile/wml/phone19.wml . As telas poderão ter uma aparência diferente, dependo das características técnicas do simulador ou celular utilizado.

Comentários: 
As palavras "Sol" e "Chuva" foram substituídas no código das células por elementos <img> que utilizam figuras do conjunto disponível na memória do UP. Simulator. 
Vamos repetir os comentários feitos no Programa Phone4.wml:
O comando que inclui a figura é: <img alt="[lua]" localsrc="moon2" src=""/>.
Atenção: esta sintaxe é válida apenas para o OWG1 Simulator. O resultado em outro simulador é imprevisível. O autor não conferiu se esta sintaxe é valida para celulares reais com software da Phone.com.

O atributo "alt" é obrigatório e contém a palavra ou mensagem que será mostrada se o simulador ou celular não puder exibir a figura; "src" deve conter o endereço da figura e não será considerado se a figura for um ícone válido contido na memória da simulador ou celular com software da Openwave.
Na documentação do SDK da Openwave  ("WML Language Reference") encontramos na descrição do atributo "img" a relação destes ícones, mostrada parcialmente abaixo (deve-se usar o nome e não o número do ícone):


Lembrando: Estas figuras são exibidas apenas com software da Openwave.
As figuras no formato WBMP ("Wireless Bitmap") padronizadas pelo WAP serão estudadas na seção Coloque uma figura WBMP na sua mini-page .

 

WirelessBRASIL                 Portal helyoWAP                    Anterior                    Próxima