lunes, mayo 04, 2009

Conociendo Flex VI: Usando web services vía WSDL

.

El siguiente ejemplo de código Flex utiliza la API del servicio web de meteorología del USA Weather Forecast que permite consultar datos acerca de una población dada.


<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" creationComplete="loadWebService()">

<!--Código original de http://www.holaflex.com -->


<mx:Script>

<![CDATA[

  import mx.rpc.Fault;
  import mx.rpc.events.FaultEvent;
  import mx.rpc.events.ResultEvent;
  import mx.rpc.soap.LoadEvent;
  import mx.rpc.soap.WebService; 

  private var webService : WebService = new WebService();
  private function loadWebService ( ) : void
  {
    // Carga el WSDL y agrega un listener que indica cuando está listo

    webService.wsdl = "http://www.webservicex.net/WeatherForecast.asmx?WSDL";
    webService.addEventListener(LoadEvent.LOAD, onWSDL);
    webService.addEventListener(FaultEvent.FAULT, onWebServiceFault);
    webService.loadWSDL( );
  }


  //listener que avisa cuando se han obtenido los datos
  private function onWSDL ( event : LoadEvent ) : void
  {
     webService.GetWeatherByZipCode.addEventListener(ResultEvent.RESULT,       onGetWeatherByZipCode);
     webService.GetWeatherByZipCode("01010");
  }

  private function onGetWeatherByZipCode ( event : ResultEvent ) : void
  {
  // se acomodan los datos recibidos para su visualizacion
    textArea.text += "La temperatura maxima del día de hoy en " + event.result.PlaceName + " , "+ event.result.StateCode + " es : " + event.result.Details[0].MaxTemperatureC + "C";
  }

  // Si hubo error en la llamada al web service.
  private function onWebServiceFault(event:FaultEvent):void {
    var fault: Fault = event.fault;
    var message:String = "Error: " + fault.faultCode;
    message += "\ndetalles: " + fault.faultDetail;
    trace("Error en el Web Service:" + message);
  }

]]>
</mx:Script>

<mx:TextArea id="textArea" width="500" height="100" />

</mx:Application>


El siguiente ejemplo muestra como usar la operación "GetWeatherByPlaceName" del mismo servicio que el programa anterior, la cual me trae el pronóstico asociado a la ciudad para los próximos cinco días, los datos se selccionan de un combo y se muestran sobre una grilla.

 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:WebService id="myDocLiteralWS" wsdl="http://www.webservicex.net/WeatherForecast.asmx?WSDL" useProxy="false" result="processResult(event)">

<mx:operation name="GetWeatherByPlaceName">
    <mx:request>
         <PlaceName>{cbxGetWeather.selectedItem}</PlaceName>
    </mx:request>
</mx:operation>
</mx:WebService>
<mx:Script>
           <![CDATA[
                import mx.collections.ArrayCollection;
                import mx.rpc.events.ResultEvent;
                
                [Bindable]
                private var myDp:ArrayCollection;              

                private function processResult( event:ResultEvent ) : void
                {
                     myDp = event.result.Details;
                }
           ]]>
      </mx:Script>

<mx:Panel x="64" y="53" width="617" height="330" layout="absolute" title="Pronóstico para los próximos 5 días">

  <mx:ComboBox id="cbxGetWeather" prompt="Seleccione Ciudad" width="150" x="10" y="10" change="myDocLiteralWS.GetWeatherByPlaceName(cbxGetWeather.selectedItem);">
      <mx:ArrayCollection>
       <mx:String>Montevideo</mx:String>
          <mx:String>La Paz</mx:String>
          <mx:String>Las Vegas</mx:String>
          <mx:String>Bogota</mx:String>
          <mx:String>Santiago de Chile</mx:String>
          <mx:String>Montevideo</mx:String>
          <mx:String>Houston</mx:String>
      </mx:ArrayCollection>
  </mx:ComboBox>

  <mx:DataGrid x="10" y="93" id="myDG" width="500" dataProvider="{myDp}">
  <mx:columns>
      <mx:DataGridColumn headerText="Fecha" dataField="Day"/>
      <mx:DataGridColumn headerText="Temper. Maxima" dataField="MaxTemperatureC" width="120"/>
      <mx:DataGridColumn headerText="Temper. Minima" dataField="MinTemperatureC" width="120"/>
  </mx:columns>
  </mx:DataGrid>
</mx:Panel>

</mx:Application>



2 comentarios:

kikefuss dijo...

Saludos!!... oye tengo una duda, veras ando adentrandome en esto de la programacion con flex, se me hace buena herramienta, pero keria ver si sabrias como dar movimiento a los elementos como el pane, o algu form, he visto unos videos en internet y veo ke los panes o alguos contenedores se pueden arrastrar con el mouse, incluso uno de tus ejemplos ( el ke muestra caracteristicas de los paises mediante un mapa), muestra un pane que es movible, sabrias como dar esta funcionalidad??...

por tu atencion gracias!! HA!! y esta muy chevere tu blog! me latio!!!..

Cya!!!!!!!

Fernando Bordignon dijo...

Gracias, todavía no he llegado a ver bien este tema. En cuanto tenga algo cerrado trataré de publicarlo.

Bordi