ruby+flex实现天气预报

 研究一段时间flex后发现，actionscript3和ruby一样具有很强的动态性，可以构建十分强大的客户端，但目前对于一些主要基于文本的系统来说有点杀鸡用牛刀的感觉，可是未来的客户端正在朝着多媒体化的方向发展，因为这样会带来更高的用户体验。感觉flex在客户端上有着很好的表现，而ruby在后台业务处理上非常的灵巧，随着两者不断的成熟与发展，有理由相信两者的结合一定会在企业级AIR应用上开辟一片新天地。

      下面是一个flex结合ruby on rails订阅天气预报的例子，实现起来比较简洁自然。

ruby端：

Ruby代码

1. class WeathersController < ApplicationController   
2.   require 'rss/1.0'             
3.   require 'rss/2.0'             
4.   require 'open-uri'    
5.   def show   
6.     feed= "http://www.raychou.com/weather/rss.php?id=#{params[:code]}"           
7.     content = ""             
8.     open(feed) do |s|           
9.       content = s.read           
10.     end           
11.     @rss = RSS::Parser.parse(content, false)        
12.     render :xml => @rss.channel  <SPAN style="COLOR: #ff0000">#无需解析直接发送</SPAN>   
13.   end  
14. end  

class WeathersController < ApplicationController
  require 'rss/1.0'          
  require 'rss/2.0'          
  require 'open-uri' 
  def show
    feed= "http://www.raychou.com/weather/rss.php?id=#{params[:code]}"        
    content = ""          
    open(feed) do |s|        
      content = s.read        
    end        
    @rss = RSS::Parser.parse(content, false)     
    render :xml => @rss.channel  #无需解析直接发送
  end
end

 

 flex端：

Java代码

1. <?xml version="1.0" encoding="utf-8"?>   
2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="624" height="426">   
3.      <mx:Script>   
4.         <![CDATA[   
5.             import mx.events.CloseEvent;   
6.             import mx.rpc.events.ResultEvent;   
7.             [Bindable]   
8.             private var cityName: Array = [ {label:"北京", data:"54511"},   
9.                                             {label:"南京", data:"58238"},   
10.                                             {label:"上海", data:"58367"}   
11.                                           ];   
12.             [Bindable]   
13.             private var selectedItem:Object;   
14.            <SPAN style="COLOR: #ff0000">//<SPAN>处理请求</SPAN>，<SPAN>无需解析结果数据，直接用就可以了</SPAN></SPAN>   
15.         private function resultWeather(event:ResultEvent):void{   
16.               item1.text = event.result.channel.item[0].title.toString();   
17.               item2.text = event.result.channel.item[1].title.toString();   
18.                      item3.text = event.result.channel.item[2].title.toString();   
19.             }   
20.         ]]>   
21.      </mx:Script>   
22.      <!--向后台发送http请求-->   
23.     <mx:HTTPService result="resultWeather(event);" id="getWeather" url="http://localhost:3000/weathers/show" useProxy="false">   
24.         <mx:request>   
25.             <code>{selectedItem.data}</code>   
26.         </mx:request>   
27.     </mx:HTTPService>   
28.     <mx:Panel x="171" y="54" width="418" height="333" layout="absolute" title="天气预报查询" fontWeight="bold" fontSize="13">   
29.         <mx:ComboBox x="120" y="28" id="cmbCityName" dataProvider="{cityName}" close="selectedItem=ComboBox(event.target).selectedItem;   
30.         getWeather.send();" width="164" fontSize="12"/>   
31.         <mx:Label x="10" y="81" id="item1" text="" width="367" fontSize="14" color="#0A6464"/>   
32.         <mx:Label x="10" y="126" id="item2" text="" width="367" fontSize="14"  color="#0A6464"/>   
33.         <mx:Label x="10" y="171" id="item3" width="367" fontSize="14" color="#0A6464"/>   
34.         <mx:Label x="37" y="30" text="请选者城市"/>   
35.     </mx:Panel>   
36. </mx:Application>  

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="624" height="426">
     <mx:Script>
     	<![CDATA[
     		import mx.events.CloseEvent;
     		import mx.rpc.events.ResultEvent;
     		[Bindable]
            private var cityName: Array = [ {label:"北京", data:"54511"},
                                            {label:"南京", data:"58238"},
                                            {label:"上海", data:"58367"}
                                          ];
            [Bindable]
            private var selectedItem:Object;
           //处理请求，无需解析结果数据，直接用就可以了
        private function resultWeather(event:ResultEvent):void{
     	      item1.text = event.result.channel.item[0].title.toString();
     	      item2.text = event.result.channel.item[1].title.toString();
                     item3.text = event.result.channel.item[2].title.toString();
     		}
     	]]>
     </mx:Script>
     <!--向后台发送http请求-->
    <mx:HTTPService result="resultWeather(event);" id="getWeather" url="http://localhost:3000/weathers/show" useProxy="false">
	    <mx:request>
	        <code>{selectedItem.data}</code>
	    </mx:request>
	</mx:HTTPService>
	<mx:Panel x="171" y="54" width="418" height="333" layout="absolute" title="天气预报查询" fontWeight="bold" fontSize="13">
		<mx:ComboBox x="120" y="28" id="cmbCityName" dataProvider="{cityName}" close="selectedItem=ComboBox(event.target).selectedItem;
		getWeather.send();" width="164" fontSize="12"/>
		<mx:Label x="10" y="81" id="item1" text="" width="367" fontSize="14" color="#0A6464"/>
		<mx:Label x="10" y="126" id="item2" text="" width="367" fontSize="14"  color="#0A6464"/>
		<mx:Label x="10" y="171" id="item3" width="367" fontSize="14" color="#0A6464"/>
		<mx:Label x="37" y="30" text="请选者城市"/>
	</mx:Panel>
</mx:Application>