The Wireless Bitmap
image format does not have support for animation such as the widely used GIF format of the
HTML world. Instead it is possible to create animations using the WML <ontimer> tag.
Please note that this will in most cases not give you what you expect.
When animating images like this, remember that the micro browser in a WAP device has
limited memory. If you cannot fit all the images into memory all at once, the browser will
have to load the images it can't fit, and your animation will be interrupted by the
loading process.
Nic Mulvaney (nic.mulvaney@wuzap.org) has written a cool tool for sequencing WBMP
animations. The program generates the WML code which can be pasted directly into your
existing code. The tool is called WAP/WBMP Sequencer and is available at http://gizma.com/wap/.
The source for the demo application above is as follows:
<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN\"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<!-- Code written in Microsoft NOTEPAD.EXE. (c) Espen Lyngaas 2000 Color Line ASA -->
<wml>
<card id="image1" ontimer="#image2">
<timer value="10"/>
<p>
<img src="anim1.wbmp" alt="Anim1"/>
</p>
</card>
<card id="image2" ontimer="#image3">
<timer value="10"/>
<p>
<img src="anim2.wbmp" alt="Anim2"/>
</p>
</card>
<card id="image3" ontimer="#image4">
<timer value="10"/>
<p>
<img src="anim3.wbmp" alt="Anim3"/>
</p>
</card>
<card id="image4" ontimer="#end">
<timer value="10"/>
<p>
<img src="anim4.wbmp" alt="Anim4"/>
</p>
</card>
<card id="end" title="The End">
<p>
This is the end of the animation, but you can
<anchor>run it again.
<go href="#image1">
</go>
</anchor>
</p>
</card>
</wml>
|
If you have access to a
server side scripting language such as PHP, the same
deck can be written much simpler like this:
<?
header("Content-type: text/vnd.wap.wml");
echo("<?xml version=\"1.0\"?>\n");
echo("<!DOCTYPE wml PUBLIC \"-//WAPFORUM//DTD WML 1.1//EN\"
\"http://www.wapforum.org/DTD/wml_1.1.xml\">\n\n");
echo("<!-- Code written in Microsoft NOTEPAD.EXE. (c) Espen Lyngaas 1999
Color Line ASA -->\n");
?>
<wml>
<?
for($card=1;$card<5;$card++) {
echo("<card id=\"image".$card."\"
ontimer=\"#image".$card+1.">"\n");
echo("<timer value=\"10\"/>\n");
echo("<p>\n");
echo("<img src=\"anim".$card.".wbmp\"
alt=\"Anim".$card."\"/>\n");
echo("</p>\n");
echo("</card>\n");
}
?>
<card id="image5" title="The End">
<p>
This is the end of the animation, but you can
<anchor>run it again.
<go href="#image1">
</go>
</anchor>
</p>
</card>
</wml>
|
|