I used sliderocket for the first time and have been very impressed. Once my trial is over and I’m relegated to the free version I’ll pass judgment. If you get to click happy it freaks out about transitions though, so may sure text has completely faded in/appeared before clicking or it’ll start acting odd. No sound to worry about, it’s all slides.

My biggest source was Mrinal Wadhwa’s similar presentation which provided a lot of inspiration and some things I could steal to make myself seem smarter than I am. I based my Elastic Racetrack and Marshal explanations on a great post on Craftymind.

Related Posts:

• Altering Flash Builder’s new menu
• How to Flex the Twitter API
• Flex OIM review
• Flex Open Iteration Meeting
• Let’s patch: Fun with Scientific Notation!

Related Posts:

• How to Flex the Twitter API
• Flex OIM review
• Flex Open Iteration Meeting
• Flex in Eclipse tips
• Let’s patch: Fun with Scientific Notation!

    override mx_internal function dispatchRpcEvent(event:AbstractEvent):void
    {
        if (hasEventListener(event.type))
        {
            event.mx_internal::callTokenResponders();
            if (!event.isDefaultPrevented())
                dispatchEvent(event);
        }
        else
        {
            if (httpService != null)
                httpService.mx_internal::dispatchRpcEvent(event);
            else
                event.mx_internal::callTokenResponders();
        }            
    }

(or monkey patch it in). 3.5 is obviously coming, and you can see the targeted fix list here

Related Posts:

• Let’s patch: Fun with Scientific Notation!
• ObjectUtil.compare() Patch 3 (with feeling!)
• ObjectUtil.compare() Patch attempt number 2
• Hold the HTTPService: Flex 3.4 gets a showstopper
• Bug hunting in the Flex SDK (part 3)

If you add a responder to a token created by the send() method, you’ll end up with two calls to the responder for every return by the server. The workaround is use event listeners rather than responders, but a lot of people (myself included) aren’t interested in rewriting legacy code to work around something that worked in a prior version.

Related Posts:

• Let’s patch: Fun with Scientific Notation!
• ObjectUtil.compare() Patch attempt number 2
• Bug hunting in the Flex SDK (part 3)
• Bug hunting in the Flex SDK (part 2)
• ObjectUtil.compare() Patch 3 (with feeling!)

With that in mind (and a fresh Flash Builder 4 Beta install) I figured what better way to learn a little about Spark than to create a Twitter Flex app? Since I was intending on posting it as a how-to, I kept it simple and sweet. Of course, it should be easy to take the code snippets and move them to your own mega-app.

I thought the first step was to learn the Twitter API, until I discovered there already existed projects out there that already took care of that. Thanks to the open source library tweetr, I just have to have a vague idea about twitter and let tweetr do the heavy lifting. No worrying about value objects or dealing with XML, just a simple event listener. So, with that I got to focus on Spark, which I’d never dealt with before.

If you want to see the final output (and view source) I’ve posted it here.

The search code to work with Tweetr is very simple. I simply add an eventListener for the COMPLETE event and shove the results into a bindable ArrayCollection. I’ve bound the search function to the enter & click events of a Spark TextInput and Button, but since they operate just like their MX components, it’s not really interesting to look at.

[Bindable]
private var _searchResults:ArrayCollection = new ArrayCollection();
 
private function search():void {
	var tweetr:Tweetr = new Tweetr;
 
	tweetr.addEventListener(TweetEvent.COMPLETE, searchResults, false, 0, true);
	tweetr.search(searchInput.text);
}
 
private function searchResults(event:TweetEvent):void {
	_searchResults.source = event.responseArray;
	_searchResults.refresh();
}

Using MX, I’d normally bind that data to some sort of DataGrid or Repeater, but Spark has neither. But, thanks to Flash Builder’s code hinting, I discovered the DataGroup component. It’s somewhat like a repeater, but with more layout options thanks to the way layouts work in Spark.

<s:DataGroup 
	dataProvider="{_searchResults}" 
	itemRenderer="com.enigmaticthought.components.TweetBox" width="100%">
	<s:layout>
		<s:VerticalLayout />
	</s:layout>
</s:DataGroup>

So all I had left was to create a renderer for the data. That’s where TweetBox came in to play. Its base class is a Spark ItemRenderer, which was a little tricky to deal with because I had to define states for it, even though I didn’t use any states. This is because the ItemRenderer uses states to handle things like hover and select to make the component customizable.

To fill in the TweetBox, I simply overrode the set data function and assigned all the values to the display components. Sadly, SearchResultData was not built as Bindable, so I couldn’t just let data binding do the work.

import com.swfjunkie.tweetr.data.objects.SearchResultData;
private var _tweet:SearchResultData; 
 
override public function set data(value:Object) : void {
	super.data = value;
	_tweet = value as SearchResultData;
	if (_tweet) {
		tweetImage.source = _tweet.userProfileImage;
		tweetText.text = _tweet.text;
		tweetAuthor.text = _tweet.user;
	}
}

One other thing to note is that while I could use Spark components for the text data, the image is still an MX component. There isn’t any plan for a Spark Image in Flex 4, but this is a good example of how mixing Spark & MX works.

<s:ItemRenderer 
	xmlns:fx="http://ns.adobe.com/mxml/2009" 
	xmlns:s="library://ns.adobe.com/flex/spark" 
	xmlns:mx="library://ns.adobe.com/flex/halo"
	width="100%">
	<s:layout>
		<s:HorizontalLayout/>
	</s:layout>
--------------------------------------------
...State & Code Removed...
--------------------------------------------
	<mx:Image id="tweetImage" height="48" width="48" scaleContent="true" />
	<s:VGroup id="textGroup" width="100%">
		<s:SimpleText id="tweetText" width="100%" explicitMaxWidth="{textGroup.width}" />
		<s:SimpleText id="tweetAuthor" width="100%" textAlign="right"/>
	</s:VGroup>
</s:ItemRenderer>

And now I have a really simple twitter search application. So, what are some of the other uses for Twitter, other than e-stalking people? You could build a new alert system that watches Twitter Trends to see what’s in the news, or use the search to keep an eye on a company, team, movie, TV Show, or stock. Of course, may you just want to amuse yourself.

Related Posts:

• Altering Flash Builder’s new menu
• Flex OIM review
• Flex Open Iteration Meeting
• Let’s patch: Fun with Scientific Notation!
• ObjectUtil.compare() Patch 3 (with feeling!)