Ajuda : WAP

WML São as siglas de Wireless Markup Language e é a linguagem utilizada para criar páginas para qualquer elemento que utilize a tecnologia WAP, como alguns telefones celulares.

WAP são as siglas de Wireless Application Protocol.

Este tutorial de wml consta de umas lições que ajudam passo a passo a construir uma simples e completa página para telefones e outros dispositivos wap ademais de uma segunda parte na qual se encontram os tags mais habituais na linguagem WAP.

Para compreender esta linguagem devemos estar bastante familiarizado com o html, já que o wml é muito similar.

PRIMEIROS PASSOS

As páginas wml swml são editadas com um editor normal de texto (tipo notepad de Windows). O mesmo que utilizávamos para os html servirá. Quando terminamos a página grava-se com a extensão .wml (ex.: arquivo.wml).

Para publicá-la em Internet, praticamente qualquer servidor de espaço servirá. Somente temos que configurá-la no servidor (ou pedir ao administrador do sistema que o faça) os MIME types:

	MIME type:	EXTENSÃO
Para o código WML	text/vnd.wap.wml	.wml
Para as imagens wml (extensão wbmp):	image/vnd.wap.wbmp	.wbmp
Para o WML Script:	text/vnd.wap.wmlscript	.wmls
Para o WML compilado:	application/vnd.wap.wmlc	.wmlc
Para o WML Script compilado:	application/vnd.wap.wmlscriptc	.wmlsc

Porém se usamos apenas os .wml e .wbmp somente teremos que configurar o servidor para os mesmos.

E se queremos que o index.wml seja o index preestabelecido (para ter acesso direto a: http://www.wmlclub.com/wap/ e não ter que escrever: http://www.wmlclub.com/wap/index.wml) teremos que configurar o index.wml como página preestabelecida (cada servidor se configura de uma forma distinta).

O primeiro que devemos incluir é o seguinte encabeçado, que define a versão da linguagem WML a ser utilizada:

A página encontra-se dentro do tag que indica que é wml: <wml> y </wml>

As páginas wml chamam-se "baralhos" e constam de uma ou mais "cartas".

Aqui temos um "baralho" de uma só "carta" ou o que é o mesmo, uma página wml simples:

E aqui um baralho de duas cartas:

A carta dois agora tem um título. O título aparecerá na linha de título do dispositivo wap.

Ao carregar a página vê-se sempre a primeira carta. Para ir da primeira carta à segunda, temos que pôr um link ou um botão:

O salto de linha em wml è <br/> e não<br>, como no html.

Se o que queremos é fazer um link a uma página externa, devemos colocar o url completo:

<ahref="http://www.wapclub.com/">Ir a wapclub</a>  

Igual que em html, os comentários escrevem-se assim:

<!-- Isto é um comentário -->

Notas importantes

1) TODOS os textos deverão ir incluídos dentro do tag "p", assim:

2) Deve-se evitar o uso do tag "b" uma vez que pode dar erros em alguns dispositivos que não o admitem. Para usar um tamanho de letra maior recomendamos utilizar <strong> </strong> porém sempre com muita moderação.

3) Em alguns dispositivos o tag deve ser colocado diante de cada linha, nunca ao final ou no meio, sendo portanto melhor fazer sempre assim, para evitar problemas.

4) Recomendo o uso do atributo "title" sempre, porém devemos considerar que se colocamos mais letras das que um dispositivo pode suportar não sabemos como ficará ao final, pode desde "romper" a linha até se sobrepor ao texto que colocamos em cada "carta".

OS TAGS DE TEXTO

Os tags de texto são iguais aos do html:

Não é nada recomendável utilizar os tags "b", "i" e "u" mais que o imprescindível.

Ademais muitos dispositivos móveis não distinguem bem entre "strong" "b" ou "big".
Tendo em consideração que habitualmente as telas são pequenas, seria melhor não utilizar a ênfase.

CARACTERES ESPECIAIS
Existem certos caracteres que não podem ser escritos tal qual porque o WML reserva-os para seu próprio código.

Aqui encontramos uma lista desses caracteres:

SÍMBOLO:	ESCREVE-SE:
<	&lt; (menor que)
>	&gt; (maior que)
´	&apos; (apóstrofo)
"	&quote; (aspas)
&	&amp; (ampersand)
$	$$ (dólar)
&nbsp;	&nbsp; (espaço, também se pode marcar a tecla de espaço diretamente)

Deve-se utilizar &amp; em vez de & na linha de argumentos dos programas perl.
Por exemplo: programa.pl?nome=$(var1)&amp;senha=$(var2)

Outros caracteres:

LETRAS:	ESCREVE-SE:	LETRAS:	ESCREVE-SE
A	A	a	a
B	B	b	b
C	C	c	c
D	D	d	d
E	E	e	e
F	F	f	f
G	G	g	g
H	H	h	h
I	I	i	i
J	J	j	j
K	K	k	k
L	L	l	l
M	M	m	m
N	N	n	n
O	O	o	o
P	P	p	p
Q	Q	q	q
R	R	r	r
S	S	s	s
T	T	t	t
U	U	u	u
V	V	v	v
W	W	w	w
X	X	y	x
Y	Y	y	y
Z	Z	z	z

LETRAS:	ESCREVE-SE:	LETRAS:	ESCREVE-SE:
À	À	Û	Û
Â	Â	Ü	Ü
Ã	Ã	Ý	Ý
Ä	Ä	Þ	Þ
Å	Å	ß	ß
Æ	Æ	à	à
Ç	Ç	á	á
È	È	â	â
É	É	ã	ã
Ê	Ê	ä	ä
Ë	Ë	å	å
Ì	Ì	æ	æ
Í	Í	ç	ç
Î	Î	è	è
Ï	Ï	é	é
Ð	Ð	ê	ê
Ñ	Ñ	ë	ë
Ò	Ò	ì	ì
Ó	Ó	í	í
Ô	Ô	î	î
Õ	Õ	ï	ï
Ö	Ö	ð	ð
×	×	ñ	ñ
Ø	Ø	ò	ò
Ù	Ù	ó	ó
Ú	Ú	ô	ô

LETRAS:	ESCREVE-SE:
õ	õ
ö	ö
÷	÷
ø	ø
ù	ù
ú	ú
û	û
ü	ü
ý	ý
þ	þ
ÿ	ÿ

Números:

NÚMEROS:	ESCREVE-SE:
0	0
1	1
2	2
3	3
4	4
5	5
6	6
7	7
8	8
9	9
º	º
¹	¹
²	²
³	³

Símbolos:

SÍMBOLO:	ESCREVE-SE:
<	&lt; (menor que)
>	&gt; (maior que)
´	&apos; (apóstrofo)
"	&quote; (aspas)
&	&amp; (ampersand)
$	$$ (dólar)
&nbsp;	&nbsp; (espaço, também se pode marcar a tecla de espaço diretamente)

Outros:

SÍMBOLO:	ESCREVE-SE:
¿	¿
?	?
¡	¡
!	!
(	(
)	)
[	[
]	]
«	«
»	»
{	{
}	}
>	>
<	&#60;
/	&#47;
\	&#92;
"	&#34;
#	&#35;
%	&#37;

SÍMBOLO:	ESCREVE-SE:
&	&
'	'
*	*
+	+
=	=
,	,
-	-
.	.
:	:
;	&#59;
@	@
^	^
_	_
`	`
~	~
	
|	 
¢	¢
£	£

SÍMBOLO:	ESCREVE-SE:
¤	¤
¥	¥
¦	¦
§	§
¨	¨
©	©
ª	ª
¬	¬
-	­
®	®
¯	¯
°	°
±	±
´	´
µ	µ
¶	¶
·	·
¸	¸

ACENTOS E CEDILHA

Em wml temos que substituir os acentos agudo, grave, circunflexo, til e cedilha por estes caracteres:

á	á
Á	Á
é	é
É	É
í	í
Í	Í
ó	ó
Ó	Ó
ú	ú
Ú	Ú
à	à
â	â
Â	Â
ê	ê
Ê	Ê
ô	ô
Ô	Ô
ã	ã
Ã	Ã
õ	õ
Õ	Õ
ç	ç
Ç	Ç

VARIÁVEIS

Uma das grandes diferenças entre o wml e o html é que com o wml pode-se definir variáveis nas cartas, designar-lhes valores e apresentá-los na tela, inclusive utilizar as variáveis em expressões (programa.pl?f=$(mivar), etc.)
A maior vantagem de tudo isso é que pode-se conservar a informação ao passar de uma carta a outra e assim poder dividir o conteúdo em vários passos (que em telas tão pequenas, dá uma idéia de mais espaço).

As variáveis são cadeias de texto (case sensitive-que distingue maiúsculas e minúsculas, como sempre no wml) à quais se lhe designa um valor (sequência de caracteres) ou nenhum valor.
O nome da variável pode começar pelo traço baixo ou undercore: "_" ou uma letra US-ASCII, seguida de uma ou mais letras US-ASCII, números ou o traço baixo.
Exemplos de nomes de variáveis válidas: NOME_Usuario _mivar1 X700II

CRIAR VARIÁVEIS E DESIGNAR VALORES

Há Várias formas possíveis: 

• Com setvar
  <setvar name="mivar1" value="Joao"/>
  João é o valor da variável mivar1. Com setvar criamos a variável e ao mesmo tempo também lhe designamos um valor.
• Com input
  Com input pode-se criar (declarar) a variável, designá-la um valor e também devolvê-la o valor original.
  Input utiliza-se para a entrada de dados e esses dados (valores) serão designados a uma variável.
• Com select
  Com select pode-se criar (declarar) a variável, designá-la um valor e também devolvê-la o valor original.
  Select permite selecionar ao usuário um ou mais valores entre uma lista de opções que serão designados a uma variável.
• Com postfield
  Com postfield pode-se criar (declarar) a variável, designá-la um valor e também devolvê-la o valor original.

REFERENCIAR VARIÁVEIS

Podemos incluir o valor de uma variável dentro de um documento wml, tanto para que apareça na tela como para que se envie a um programa.

Há três formas de referenciar a variável:

$nomevariável
utiliza-se quando não há ambigüidade com o nome da variável dentro do contexto.
$(nomevariável)
Quando pode existir ambigüidade com o nome da variável dentro do contexto.
$(nomevariável:conversão) Explica-se mais abaixo.

Como o wml se reserva o uso do símbolo de dólar, para que queiramos que apareça na tela este símbolo, deve-se escrever duas vezes ($$). Por exemplo temos esta variável: $moeda e queremos apresentar seu valor na tela, assim: $15, escreveremos:
Saldo atual: $$$moeda

CONVERSÃO AO FORMATO ESCAPE $(nomevariável:conversão)

No seu momento se estabeleceu uma substituição de alguns caracteres próprios dos URLs para que o servidor não os confundira (regras do formato escape (RFC2396).
Estas regras facilitam-nos um mecanismo para poder incluir numa linha URL, esses caracteres. Ainda que estas regras foram criadas para referenciar URLs, podem-se aplicar as mesmas regras para referenciar variáveis.

Exemplo (este exemplo, que converte o texto em formato escape é muito útil, podemos descarregá-lo desde demos).

Quando se introduz o valor de uma variável dentro de um baralho, pode-se definir o formato (escape, unescape ou no escape) assim:

$(var:e) $(var:E) $(var:escape) (qualquer um dos três traduz ao formato escape)
$(var:u) $(var:U) $(var:unesc) (qualquer um dos três traduz do formato escape a texto US-ASCII)
$(var:n) $(var:N) $(var:noesc) (qualquer um dos três faz com que o valor da variável não se traduza ao formato escape)

O WML sempre aplica o formato escape quando se trata de atributos que trabalham com URLs. Por isso muitas vezes pode-se assumir que o WML converterá ao formato escape quando o tenha que fazer. De qualquer maneira, convém incluí-lo se temos a menor dúvida sobre o que ocorrerá.

Aqui encontramos uma lista dos caracteres de escape (todos começam por %)

; %3b
/ %2f
? %3f
: %3a
@ %40
& %26
= %3d
+ %2b
$ %24
, %2c
espaço %20
{ %7b
} %7d
| %7c
\ %55c
^ %5e
[ %5b
] %5d
` %27
< %3c
> %3e
# %23

AS VARIÁVEIS E AS TAREFAS <NOOP>, <PREV>, <REFRESH> e <GO>

• <noop/>
  Não faz nada. Utiliza-se para desativar eventos no nível do baralho.

   

• <prev/>
  Prev volta ao anterior URL.
  Se dentro de prev há um elemento setvar, como no exemplo, será processado antes de que se execute o prev.
  <prev>
  <setvar name="mivar" value="conteudo"/>
  </prev>

   

• <refresh/>
  Refresh refresca os conteúdos visíveis do navegador.

  Se refresh contém um setvar, como no exemplo, processa-se o setvar e depois se procede ao refresh.

  <refresh>
  <setvar name="mivar" value="conteudo"/>
  </refresh>

   

• <go>
  Go leva a outra URL ou outra carta. Se dentro de go há um elemento setvar, se processa primeiro este e depois se executa a tarefa "go".

  <go href="http://www.wmlclub.com/cgi-bin/programa.pl?x=$(mivar1)&y=$(mivar2)" method="post">
  <setvar name="mivar1" value="50"/>
  <setvar name="mivar2" value="80"/>
  </go>

IMAGENS EM MOVIMENTO

Para criar imagens em movimento utilizamos o contador de tempo "timer".
O formato das imagens wml é wbmp.
Veja na seção Programas um conversor de bmp a wbmp.

Exemplo de código para imagens em movimento:

 

CRIAÇÃO DE TABELAS

Ainda que o tag de <table> esteja guardado nas especificações do WML 1.1, existem alguns móveis que não o implementam, como é o caso do Nokia 7110, no lugar os dados são mostrados numa tabela de uma coluna.

Exemplo de código para criação de tabelas:< /p>

Fonte:http://br.wmlclub.com

 

Voltar