| | {section} |
| | {column:width=80%} |
| | |
| | h2. Code Files |
| | |
| | This section provides the completed code for the Flickr RIA. To see the application in action, see the [Part I Introduction|Part I. Creating a Simple RIA] or the [Code Anatomy|1c. Code Anatomy]. For step-by-step instructions to build this application, see [the Tutorial|1d. RIA Tutorial]. |
| | {column} |
| | {column} |
| | {adbe-prev:http://learn.adobe.com/wiki/display/Flex/1a.+Learning+Points} |
| | {adbe-next:http://learn.adobe.com/wiki/display/Flex/1c.+Code+Anatomy} |
| | {rate:title=User rating\|theme=dynamic\|key=focal\|display=default} |
| | {adbe-pod} |
| | |
| | h6. Learn more |
| | |
| | * {adbe-popup:http://en.wikipedia.org/wiki/MXML}MXML defined{adbe-popup} |
| | * {adbe-popup:http://www.amazon.com/Flex-Solutions-Essential-Techniques-Developers/dp/1590598768}Book: Flex Solutions:Essential Techniques for Flex 2 and 3 Developers{adbe-popup} |
| | * {adbe-popup:http://www.adobe.com/devnet/flex/articles/paradigm.html}An overview of MXML: The Flex markup language{adbe-popup} |
| | |
| | {adbe-pod} |
| | {column} |
| | {column} |
| | {column} |
| | {section} |
| | |
| | h2. Main Application (FlickrRIA.mxml) |
| | |
| | {code} |
| | <?xml version="1.0" encoding="utf-8"?> |
| | <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" |
| | backgroundGradientColors="[0xFFFFFF, 0xAAAAAA]" |
| | horizontalAlign="left" |
| | verticalGap="15" |
| | horizontalGap="15"> |
| | |
| | <mx:Script> |
| | <![CDATA[ |
| | import mx.collections.ArrayCollection; |
| | import mx.rpc.events.ResultEvent; |
| | |
| | [Bindable] |
| | private var photoFeed:ArrayCollection; |
| | |
| | private function requestPhotos():void { |
| | photoService.cancel(); |
| | var params:Object = new Object(); |
| | params.format = 'rss_200_enc'; |
| | params.tags = searchTerms.text; |
| | photoService.send(params); |
| | } |
| | |
| | private function photoHandler(event:ResultEvent):void { |
| | photoFeed = event.result.rss.channel.item as ArrayCollection; |
| | } |
| | ]]> |
| | </mx:Script> |
| | |
| | <mx:HTTPService id="photoService" |
| | url="http://api.flickr.com/services/feeds/photos_public.gne" |
| | result="photoHandler(event)" /> |
| | |
| | <mx:HBox> |
| | <mx:Label text="Flickr tags or search terms:" /> |
| | <mx:TextInput id="searchTerms" /> |
| | <mx:Button label="Search" |
| | click="requestPhotos()" /> |
| | </mx:HBox> |
| | |
| | <mx:TileList width="100%" height="100%" |
| | dataProvider="{photoFeed}" |
| | itemRenderer="FlickrThumbnail"> |
| | </mx:TileList> |
| | |
| | </mx:Application> |
| | {code} |
| | |
| | h2. Custom component item renderer (FlickrThumbnail.mxml) |
| | |
| | {code} |
| | <?xml version="1.0" encoding="utf-8"?> |
| | <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" |
| | width="125" height="125" |
| | horizontalAlign="center" |
| | paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5"> |
| | |
| | <mx:Image |
| | width="75" height="75" |
| | source="{data.thumbnail.url}" /> |
| | |
| | <mx:Text width="100" text="{data.credit}" /> |
| | |
| | </mx:VBox> |
| | {code} |
| | | |
| | {adbe-prev:http://learn.adobe.com/wiki/display/Flex/1a.+Learning+Points} |
| | {adbe-next:http://learn.adobe.com/wiki/display/Flex/1c.+Code+Anatomy} |
