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：

• mx.rpc.events.FaultEvent
• mx.rpc.events.ResultEvent

分別代表調用出錯和成功事件，兩者都沒有提供用戶默認實現，需要用編程方式實現事件處理。特別是用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>