Tutorial: Flex Builder et un WebService

Voici un tutorial vidéo qui présente en dix minutes la fonctionnalité d’introspection de webservices dans Flex Builder. L’outil génère automatiquement les classes AS3 mappées aux méthodes du WSDL et gère les événements de résultats. POur visualiser correctement une vidéo sur Viddler, cliquez sur MENU, puis Original size, puis Full Screen :

Voici l’url du webService que j’utilise dans ce tutorial: http://www.webservicex.net/stockquote.asmx?WSDL. Le code source de l’exemple:

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute”>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import net.webservicex.StockQuote;
import net.webservicex.GetQuoteResultEvent;

public var myService:StockQuote = new StockQuote;
public var myResult:XML = new XML;

[Bindable]
public var resultStock:ArrayCollection = new ArrayCollection;

private function callService():void{
myService.addgetQuoteEventListener(handleResult);
myService.getQuote(companyCode.text);
cursorManager.setBusyCursor();
}

private function handleResult(event:GetQuoteResultEvent):void{
cursorManager.removeBusyCursor();
myResult = new XML(event.result);
var myLast:String = myResult.Stock.Last;
var mySymbol:String = myResult.Stock.Symbol;
resultStock.addItem({name:mySymbol,last:myLast});
}
]]>
</mx:Script>
<mx:SeriesInterpolate duration=”500″ id=”drillDown”/>
<mx:Panel x=”10″ y=”10″ width=”250″ height=”339″ layout=”absolute” title=”Quote”>
<mx:Label x=”10″ y=”10″ text=”Symbol :”/>
<mx:TextInput x=”73″ y=”8″ width=”50″ id=”companyCode” maxChars=”4″/>
<mx:Button x=”131″ y=”8″ label=”Get Quote” width=”89″ click=”callService()”/>
<mx:ColumnChart showDataTips=”true” x=”10″ y=”36″ id=”columnchart1″ width=”210″ height=”253″ dataProvider=”{resultStock}”>
<mx:horizontalAxis>
<mx:CategoryAxis categoryField=”name”/>
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries displayName=”Value Stock” yField=”last” showDataEffect=”{drillDown}”/>
</mx:series>
</mx:ColumnChart>
</mx:Panel>
</mx:Application>