flex2使用webservice完成天气预报

于 2007-08-14 00:37:00 发布 · 125 阅读

文章标签：

#WebService #XML #Flex #编程 #SOAP

flasher 专栏收录该内容

15 篇文章

订阅专栏

本文介绍如何使用Flex2和一个免费的WebService接口实现一个简单的天气查询系统。该系统能够获取并展示中国主要城市的天气信息。

http://www.webservicex.net/globalweather.asmx是一个公共免费的webservice接口，提供全球主要城市的当天天气情况（包括中国的主要城市），firefox下打开链接，用GetCitiesByCountry方法和china参数试运行一下，可以看到返回一个xml结构表示支持的城市名称（用这些城市名称作为参数使用GetWeather方法就能得到天气信息了）。下面我们就使用flex2丰富的用户体验来实现简单的天气查询系统。
IDE:Flex builder 3

打开flex 2 language reference，可以看到web service 应用相关的namespace有两个：

mx.rpc.soap
mx.rpc.soap.mxml

从名称上来看，后者是前者的component封装（实际上就是如此），说白了mx.rpc.soap.mxml下的两个class可以使用mxml tag的声明方式来定义一个web service，一般情况下，这样的声明方式可读性还是比较好的，代码量比较少，还有一些UI上扩展的功能可以利用（比如WebService class的ShowBusyCursor方法）。声明方式很简单

xml 代码

<mx:WebService id="weatherWS" wsdl="http://www.webservicex.net/globalweather.asmx?WSDL" showBusyCursor="true" fault="wsFaultPopAlert()"/>

这就是一个简单的webservice定义，然后我们可以加上operation声明，或者使用编程方式调用。以本例来讲，可以直接使用编程方式调用，就跟普通的方法调用形式一样：

xml 代码

weatherWS.GetCitiesByCountry("China");

很简单吧，都不需要关注底层技术。

声明方式也是可以的：

xml 代码

<mx:WebService id="weatherWS" wsdl="http://www.webservicex.net/globalweather.asmx?WSDL" showBusyCursor="true" fault="wsFaultPopAlert()">
<mx:operation name="GetCitiesByCountry"/>
mx:WebService>

mx:operation其实就是mx.rpc.soap.mxml.Operation，里面有一个public funciton -- send(...args)，代表方法调用，于是：

xml 代码

weatherWS.GetCitiesByCountry.send("china")

这样也是可以的。

除此以外WebService提供两个event：

分别代表调用出错和成功事件，两者都没有提供用户默认实现，需要用编程方式实现事件处理。特别是用ResultEvent可以获得调用结果（就是本例开始获得的xml结果，剩下的处理就是分析xml结构啦）。

下面是模块代码：

xml 代码

xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="174" height="200" title="Weather" creationComplete="init()">
<mx:Script>
private var citysArr:Array = new Array();
private function init():void
{
citysArr.push({label:"choose..."});
cityCombo.selectedIndex = 0;
weatherWS.addEventListener(ResultEvent.RESULT, wsResult);
weatherWS.GetCitiesByCountry("China");
this.title = "Weather(connecting...)";
}
private function wsResult(eve:ResultEvent):void
{
this.title = "Weather";
weatherWS.removeEventListener(ResultEvent.RESULT,wsResult);
XML.ignoreWhitespace = true;
XML.ignoreComments = true;
XML.ignoreProcessingInstructions = true;
var xml:XML = new XML(eve.result.toString());
var cityNum:int = xml.Table.length();
for(var i:int=0 ; i
{
citysArr.push({label:xml.Table[i].City});
}
cityCombo.addEventListener(ListEvent.CHANGE, cityListChooseHandler);
weatherWS.addEventListener(ResultEvent.RESULT, onCityInfo);
}
private function cityListChooseHandler(eve:ListEvent):void
{
var cityName:String = cityCombo.selectedLabel;
cityInfo.htmlText = "";
weatherWS.GetWeather(cityName,"china");
}
private function onCityInfo(eve:ResultEvent):void
{
var xml:XML = new XML(eve.result.toString());
var infoNum:int = xml.children().length();
for(var i:int=0 ; i
{
var nodestr:String = xml.children()[i].toXMLString();
cityInfo.htmlText += "
}
}
private function wsFaultPopAlert():void
{
Alert.show("WebService access failed");
}
]]>
mx:Script>
<mx:WebService id="weatherWS" wsdl="http://www.webservicex.net/globalweather.asmx?WSDL" showBusyCursor="true" fault="wsFaultPopAlert()"/>
<mx:Label x="0" y="0" text="City"/>
<mx:ComboBox id="cityCombo" x="34" y="-2" width="120" dataProvider="{citysArr}" labelField="label"/>
<mx:TextArea id="cityInfo" x="0" y="26" width="100%" height="100%" selectable="false"/>
<mx:ControlBar>
mx:ControlBar>
mx:Panel>