Create A Mini Multiple RSS Reader With Flex 2.0 and ColdFusion 7

Introduction

I recently needed to create a small widget that would allow users to select one of 3 RSS feeds, view the titles and descriptions in each feed, and be able to click on a button to go to the link for an item. Since I had previously read Sas Jacobs excellent article about using Flex and ActionScript 3 to load an RSS feed (available on DMX Zone) and had just completed reading Professional Adobe Flex 2 (Wrox), I understood the basics of using an RSS XML file in Flex. What I wasn't clear on was how to allow the user to select 1 of 3 different RSS feeds. However, the combination of ActionScript 3 and Flex's LinkBar control made it easy.

Example - Flex Widget

You can view an example of the multi RSS Reader Flex widget and right click on the widget to view the source code. Please keep in mind that I had to make this reader small as it will go on a web page that is already bit crowded. The code is extensively commented to assist in understanding what's happening.

Backend

Because of Flash security restrictions, I needed to use a ColdFusion CFC to pull in the RSS XML file. You can view that CFC as part of the source code. You just send the CFC the URL of the RSS XML file and ColdFusion gets it and returns the XML to the Flex application.

User Interface in Flex

Once the XML is returned by the CFC, I create an XMLList object that holds all the item nodes in the XML. Each item node has a title, link, and description child node. I use the title nodes to populate a mx:List control. The user can click on a button to load the link for that title in a new browser window. I also display the description below the mx:List control.

I use a mx:LinkBar control to display the three RSS feed choices. When the application first loads, I create an ArrayCollection that is the data provider for the LinkBar. The ArrayCollection stores generic objects and each object has a label, feed, and newsTitle property. The label property stores the text that is displayed in the LinkBar and the feed property is the RSS feed URL. When the user clicks on one of the LinkBar items, the feed for that RSS is sent to the CFC. When the XML for that feed is returned to the Flex application, the titles in that XML are put into mx:List control.

Important Notes

There is no error handling in this version. So if the RSS XML cannot be loaded by the CFC and returned to Flex, only an Alert box displays. I'll work on adding robust error handling in the next version. Another change is to remove the hard-coded RSS feed information from within the MXML and put it into its own XML file that the application can read in and use as the LinkBar's data provider. That will make it easier to swap in new RSS feeds later.

Lastly, the application will only work with RSS XML that follow a specific formatting: channel node - item node and each item node has a title, description, and link child nodes.

Update

A newer version that uses an XML file to determine which RSS feeds to display in the link bar, additional source code commenting and also has improved error handling in the CFC is available here (with source code).