Flex中解析Kuler RSS feed的例子

By Minidxer | July 29, 2008

接下来的例子演示了Flex中载入Kuler RSS feed并对其进行解析,并将内容显示在DataGrid中。

让我们先来看一下Demo可以右键View Source或点击这里察看源代码):


下面是完整实现代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white"
  6.         creationComplete="tempXML.send(httpServiceParams)">
  7.  
  8.     <mx:Script>
  9.         <![CDATA[
  10.             import mx.controls.dataGridClasses.DataGridColumn;
  11.  
  12.             private var kulerNS:Namespace = new Namespace("http://kulerserv/services/rss/kulerRSS");
  13.  
  14.             private function themeTitle_labelFunc(item:XML, column:DataGridColumn):String {
  15.                 return item.kulerNS::themeItem.kulerNS::themeTitle;
  16.             }
  17.  
  18.             private function themeRating_labelFunc(item:XML, column:DataGridColumn):String {
  19.                 return item.kulerNS::themeItem.kulerNS::themeRating;
  20.             }
  21.  
  22.             private function themeImage_labelFunc(item:XML, column:DataGridColumn):String {
  23.                 return item.kulerNS::themeItem.kulerNS::themeImage;
  24.             }
  25.         ]]>
  26.     </mx:Script>
  27.  
  28.     <mx:Object id="httpServiceParams"
  29.             listtype="rating"
  30.             readerType="public" />
  31.  
  32.     <mx:HTTPService id="tempXML"
  33.             url="http://kuler.adobe.com/kuler/API/rss/get.cfm"
  34.             resultFormat="e4x" />
  35.  
  36.     <mx:XMLListCollection id="itemXMLListColl"
  37.             source="{tempXML.lastResult.channel.item}" />
  38.  
  39.     <mx:VDividedBox width="100%" height="100%" >
  40.         <mx:DataGrid id="dataGrid"
  41.                 width="100%"
  42.                 dataProvider="{itemXMLListColl}">
  43.             <mx:columns>
  44.                 <mx:DataGridColumn headerText="Title:"
  45.                         labelFunction="themeTitle_labelFunc">
  46.                     <mx:itemRenderer>
  47.                         <mx:Component>
  48.                             <mx:Label />
  49.                         </mx:Component>
  50.                     </mx:itemRenderer>
  51.                 </mx:DataGridColumn>
  52.  
  53.                 <mx:DataGridColumn headerText="Rating:"
  54.                         textAlign="center"
  55.                         labelFunction="themeRating_labelFunc" />
  56.  
  57.                 <mx:DataGridColumn headerText="Image:"
  58.                         textAlign="center"
  59.                         labelFunction="themeImage_labelFunc"
  60.                         itemRenderer="mx.controls.Image" />
  61.             </mx:columns>
  62.         </mx:DataGrid>
  63.  
  64.         <mx:TextArea text="{tempXML.lastResult}"
  65.                 width="100%"
  66.                 height="100%" />
  67.     </mx:VDividedBox>
  68.  
  69. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:minidxer

Topics: Flex | Tags: , , , ,

Related Post

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Archives

Sponsored Ads