ruby+flex实现天气预报

最新推荐文章于 2023-02-17 23:56:03 发布

最新推荐文章于 2023-02-17 23:56:03 发布 · 123 阅读

文章标签：

#Ruby #Flex #Rails #AIR #Adobe

iOS 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一个使用Flex和Ruby on Rails实现的简洁天气预报系统。通过Ruby on Rails后端处理天气数据并以RSS形式提供，前端使用Flex进行展示。用户可以选择不同城市查看未来几天的天气预报。

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

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

ruby端：

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端：

<?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>

运行结果：