flex 使用webservices 写的天气预报

注意：本机必须连接互联网

效果图：

源码如下：

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" creationComplete="init()"> <mx:Panel width="620" height="455" layout="absolute" title="天气预报" fontSize="12"> <mx:HRule x="10" y="78" width="570"/> <mx:Label x="44" y="50" text="今 天" width="67" fontWeight="bold" color="#030303"/> <mx:Label x="474" y="50" text="后 天" width="67" fontWeight="bold" color="#030303"/> <mx:Label x="247" y="50" text="明 天" width="67" fontWeight="bold" color="#030303"/> <mx:Canvas x="10" y="88" width="168" height="315" borderStyle="solid" borderColor="#111AC6"> <mx:Label x="10" y="10" width="146" id="lblDate"/> <mx:Label x="10" y="38" width="146" height="24" id="lblwd"/> <mx:Label x="10" y="70" id="lblfl" width="146" height="29"/> <mx:Image x="10" y="120" width="70" height="65" id="imgToday"/> <mx:Image x="88" y="120" width="70" height="65" id="imgToday2"/> <mx:TextArea x="10" y="197" width="148" height="106" id="taDetail" editable="false"/> </mx:Canvas> <mx:Canvas x="204" y="88" width="173" height="315" borderStyle="solid" borderColor="#111AC6"> <mx:Label x="10" y="10" width="138" id="lblDate1"/> <mx:Label x="10" y="38" width="136" height="24" id="lblwd1"/> <mx:Label x="10" y="70" id="lblfl1" width="136" height="29"/> <mx:Image x="10" y="120" width="70" height="65" id="imgTomorrow"/> <mx:Image x="88" y="120" width="70" height="65" id="imgTomorrow2"/> <mx:TextArea x="10" y="197" width="148" height="106" id="taDetail1" editable="false"/> </mx:Canvas> <mx:Canvas x="403" y="88" width="175" height="315" borderStyle="solid" borderColor="#111AC6"> <mx:Label x="10" y="10" width="138" id="lblDate2"/> <mx:Label x="10" y="38" width="136" height="24" id="lblwd2"/> <mx:Label x="10" y="70" id="lblfl2" width="136" height="29"/> <mx:Image x="10" y="119" width="70" height="65" id="imgAfterTomorrow"/> <mx:Image x="88" y="119" width="70" height="65" id="imgAfterTomorrow2"/> <mx:TextArea x="10" y="197" width="148" height="106" id="taDetail2" editable="false"/> </mx:Canvas> <mx:TextInput x="140" y="10" id="txtCity" text="北京"/> <mx:Button x="324" y="12" label="查 询" id="btnQuery" click="query()"/> <mx:Label x="44" y="14" text="请输入城市：" width="88"/> <mx:Label x="403" y="14" width="138" height="26" fontWeight="bold" color="#FD060C" id="lblCity"/> </mx:Panel> <mx:WebService id="wsWeather" wsdl="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?wsdl" showBusyCursor="true" result="resultHandle(event)" fault="faultHandle(event)"/> <mx:Style> Label{ color:#F8A10B; } Alert{ font-size:12px; } </mx:Style> <mx:Script> <!--[CDATA[ import mx.controls.Alert; import mx.collections.ArrayCollection; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; /*根据城市查询天气 */ private function query():void{ if(txtCity.text==""){ Alert.show("请输入城市名称","友情提示"); return; } wsWeather.getWeatherbyCityName(txtCity.text); } /* 初始化查询北京三天天气 */ private function init():void{ wsWeather.getWeatherbyCityName("北京"); } /* 显示今天-明天-后天三天天气 */ private function resultHandle(evt:ResultEvent):void{ var arr:ArrayCollection=ArrayCollection(evt.result); this.lblCity.text=arr[0]+"-"+arr[1]; //今天天气 this.lblDate.text=arr[6];//日期 this.lblwd.text="温度："+arr[5];//温度 this.lblfl.text=arr[7]; //风力 this.imgToday.source="images/weather/a_"+arr[8];//图片 this.imgToday2.source="images/weather/a_"+arr[9];//图片2 this.taDetail.text=arr[10]; //明天天气 this.lblDate1.text=arr[13]; this.lblwd1.text=arr[12]; this.lblfl1.text=arr[14]; this.imgTomorrow.source="images/weather/a_"+arr[15]; this.imgTomorrow2.source="images/weather/a_"+arr[16]; this.taDetail1.text=arr[11]; //后天天气 this.lblDate2.text=arr[18]; this.lblwd2.text=arr[17]; this.lblfl2.text=arr[19]; this.imgAfterTomorrow.source="images/weather/a_"+arr[20]; this.imgAfterTomorrow2.source="images/weather/a_"+arr[21]; this.taDetail2.text=arr[22]; } private function faultHandle(evt:FaultEvent):void{ Alert.show("请检查网络连接..."); } ]]--> </mx:Script> </mx:Application>