OpenLaszlo est une plateforme de développement d'applications RIA. Elle permet de créer des applications au format Flash ou DHTML très rapidemment à partir d'un mélange d'XML et de Javascript. Cette plateforme permet notamment de répliquer les composants à partir d'une source de données XML. Allez voir
les démos pour vous donner un aperçu des composants disponibles par défaut.
Il devient facile de générer des interfaces riches, avec des animations sympas, et plutôt user friendly.
Exemple
Les données sont générées par PHP qui fournit un fichier XML dont l'application se nourrit pour composer l'interface. Les sources de l'exemple (adaptation de l'exemple de la liste des contacts fourni par OpenLaszlo) :
PHP:
<?php
<canvas bgcolor="#eaeaea" width="500" height="462" >
<bluestyle name="bluecolors" canvascolor="null"/>
<include href="lz/tabelement.lzx" />
<dataset src="http://ivanramirez.info/lab/ria/lz.php5" name="data" request="true"/>
<class name="row" height="23" bgcolor="0xE7E7D6" width="100%">
<attribute name="minheight" value="23"/>
<attribute name="maxheight" value="250"/>
<attribute name="date" value="$path{'date/text()'}"/>
<attribute name="title" value="$path{'title/text()'}"/>
<view name="small" width="100%">
<basebutton resource="tabrsrc" clickable="true"
width="${parent.width}"
stretches="both"
style="bluecolors" >
<method event="onclick">
if (classroot.height == classroot.minheight) {
classroot.open.setAttribute('visible', true);
newheight = classroot.maxheight;
} else {
classroot.open.setAttribute('visible', false);
newheight = classroot.minheight;
}
classroot.animate('height', newheight, 300);
</method>
</basebutton>
<text x="10" y="4" text="${'<b>' + classroot.date + '</b> : ' + classroot.title }" width="100%"/>
</view>
<view x="10" name="open" width="95%" visible="false">
<text datapath="body/text()" width="100%" multiline="true" />
<vscrollbar />
<simplelayout axis="x"/>
</view>
<view name="bottom" width="100%" resource="tabshadow"
stretches="both" height="2"/>
<stableborderlayout axis="y" />
<simplelayout axis="y"/>
</class>
<view name="contactsborder" bgcolor="0x676767" width="500" height="462">
<text name="test" x="5" y="1" fgcolor="white">Liste des news</text>
<view x="2" y="20" width="498" height="438" clip="true">
<view width="${parent.width-16}">
<row datapath="data:/entries/entry" />
<simplelayout axis="y"/>
</view>
<scrollbar axis="y"/>
<simplelayout axis="x"/>
</view>
</view>
</canvas>
?>
Sympa, non ?
Seul inconvénient à savoir, les performances ne sont pas au rendez vous pour des applications comportant beaucoup de données dynamiques (du moins pour le format SWF).
