Search Flex Samples

Parsing the Kuler RSS feed using Flex

Just a quick example I threw together last night which loads the Kuler RSS feed and displays some items in a DataGrid along with their rating and theme image (using the Flex Image control as a custom item renderer).




<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white"

creationComplete="tempXML.send(httpServiceParams)">



<mx:Script>

<![CDATA[

import mx.controls.dataGridClasses.DataGridColumn;



private var kulerNS:Namespace = new Namespace("http://kulerserv/services/rss/kulerRSS");



private function themeTitle_labelFunc(item:XML, column:DataGridColumn):String {

return item.kulerNS::themeItem.kulerNS::themeTitle;

}



private function themeRating_labelFunc(item:XML, column:DataGridColumn):String {

return item.kulerNS::themeItem.kulerNS::themeRating;

}



private function themeImage_labelFunc(item:XML, column:DataGridColumn):String {

return item.kulerNS::themeItem.kulerNS::themeImage;

}

]]>

</mx:Script>



<mx:Object id="httpServiceParams"

listtype="rating"

readerType="public" />



<mx:HTTPService id="tempXML"

url="http://kuler.adobe.com/kuler/API/rss/get.cfm"

resultFormat="e4x" />



<mx:XMLListCollection id="itemXMLListColl"

source="{tempXML.lastResult.channel.item}" />



<mx:VDividedBox width="100%" height="100%" >

<mx:DataGrid id="dataGrid"

width="100%"

dataProvider="{itemXMLListColl}">

<mx:columns>

<mx:DataGridColumn headerText="Title:"

labelFunction="themeTitle_labelFunc">

<mx:itemRenderer>

<mx:Component>

<mx:Label />

</mx:Component>

</mx:itemRenderer>

</mx:DataGridColumn>



<mx:DataGridColumn headerText="Rating:"

textAlign="center"

labelFunction="themeRating_labelFunc" />



<mx:DataGridColumn headerText="Image:"

textAlign="center"

labelFunction="themeImage_labelFunc"

itemRenderer="mx.controls.Image" />

</mx:columns>

</mx:DataGrid>

<mx:TextArea text="{tempXML.lastResult}"

width="100%"

height="100%" />

</mx:VDividedBox>

</mx:Application>



0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples