ryan: February 2008 Archives

By default, the Flex image component does not enable smoothing on scaled images, which makes them appear jagged.  Ben Longoria has written a great SmoothImage class that overrides the image component and sets smoothing to true.  I needed a bit more functionality out of it, so I have extended it a bit further.  I wanted:

• Smart resizing which scales the image only if it won't fit in the application bounds
• Drop shadow on the image
• Centered preloader that displays while image is loading

I have written an updated class that expands upon the original SmoothImage, and includes these new features.


View the Example

View Source






Here is SmoothImageLoader.as

Yahoo Pipes is a pretty nifty utility for quickly bundling data sources from the web into one neat feed.  While you can do nearly everything Pipes does with ActionScript, the feeds must be cached locally for flash player to access them because of crossdomain policies.  For this reason, it is nice to only have to cache one feed, instead of caching several and then piecing them all together.  This also makes it easy to modify the data feed later on through the Pipes interface without having to touch ActionScript. 


Building a Yahoo Pipes app

First, sign up for a Yahoo Pipes account if you haven't already:  http://pipes.yahoo.com/pipes/
Next, create a simple Application.  There are plenty of examples out there.  You can always clone someone else's pipe, and modify it with your own favorite data sources.  

For this tutorial, I have created an app that pulls feeds from Digg.com, and combines snapshots of the articles from Snap.com
The sample app can be viewed here:
http://pipes.yahoo.com/pipes/pipe.info?_id=xv9z9HSr3BG_6gN48jxBKg


Setting up PHP caching
I am using a PHP RSS caching script called RSS Fetch.  It can be easily customized to cache at specified intervals, or constantly pull the newest data.  I have added a line to the rsslist array for the yahoo pipes RSS source:
"Pipes" => "http://pipes.yahoo.com/pipes/pipe.run?_id=xv9z9HSr3BG_6gN48jxBKg&_render=rss"
You'll also need to create a "cache" directory for the script to write to.  My example can be seen here:
http://infinitearray.com/experiments/feeder/rssfetch.php?id=Pipes&cachetime=5


Creating a Flex App
Luckily, Adobe has done most of the work here.  They've open sourced a few libraries that take care of parsing RSS feeds.   You'll need both the as3corelib and the as3syndicationlib.  Mike Chambers has built a great demo App for working with these libraries.