A couple of days ago Corey Lucier posted a couple of nice examples of the new Flex 4 AnimateTransitionShader.

Like Flex 3, the new effects don’t handle being interrupted well. They jump abruptly to the end of the current IEffectInstance, then start a new one. The abruptness is what your trying to get away from when you decide implement an effect, opting for a smooth transition.

With a bit of tweaking about it was fairly easy to hack around this. Here’s what i changed

In the examples below I’ve added a couple of more states and a ButtonBar to navigate. I’ve also removed the easing to make it a little simpler to see. If you click around a bit you should see the difference.

(more…)

Here’s a little component I knocked out over the holiday period for use in a current project.

Its basically a rip of ComboBox (extends ComboBase due to private methods in ComboBox), that will filter the dataProvider depending on what the user enters into the TextInput, and select the text to show you where a match is found (can only select the first match in FP9). You can also set it to be case sensitive (false by default).

There’s a few other components out there with the same functionality (some you have to pay for some you don’t), most of which can be found doing a search for ‘AutoCompleteComboBox Flex’.

They either didn’t quite do what we wanted or were too complex for our needs.

(more…)

A couple of weeks ago I made a post about using Repeaters in ViewStacks and I mentioned in the post I’d put together a class called DataStack that worked in the same way as a ViewStack but was driven by a dataProvider.

I then realized that using a Repeater inside a ViewStack would achieve the same result, but one thing I didn’t mention is that the DataStack re-uses its children like itemRenderers.

This means that if you only add one child to a DataStack, but supply a dataProvider with 1000 items, it will only create the one child and re-use it, unlike the Repeater and ViewStack combination which would create 1000 instances of the same child.

In addition recently I added a little more code so that you can add more than a single child to the DataStack and it will cycle through through them as you change the selectedIndex. So if you supply 2 different children and a dataProvider of 1000 items, it will reuse each child 500 times, the child at index 0 for all the data at the even indices, and the child at index 1 for all the data at the odd indices.

Due to the fact that DataStack isn’t a ViewStack (i.e. it extends Container not ViewStack), it won’t work with the Efflex viewStackEffects, and therefore I created a dataStack effect for Efflex and an example that extends it.

DataStack Example (right click for source).

The source for DataStack can be downloaded from our Google Code repository.

Did you know there’s a magazine out there dedicated to Flash & Flex Development? Well you do now! We received a few copies to give out at LFPUG and I have to say I was impressed with the look, feel and content of the mag, good quality stuff.

Flash & Flex Developers Magazine is a print and online, bimonthly magazine. This month issue includes:

How to become a Flash/Flex Developer?…
Data Analytics and Tracking User-Behavior in Flex Applications…
Animating with ActionScript…
Create your first ActionScript game in minutes…
Flash DecalSheet System…
Flickr in Flash – Creating a portfolio…
How to use Yahoo! Maps in Flex…
Flex Application Architecture…
Google Analytics for Flash…
Miniblog Part 2…
Drag and Drop in AIR using Flash CS3…
FLEXing Your Business Application…
New 3D Methods of Display Objects in Flash Player 10…
Blender to Flash workflow…
How to view PowerPoint on YouTube…

Pricing depends on the subscription type, whether its print, online, or your company takes out a corporate subscription and it’s also possible to purchase a single issue.

There’s also a free issue online you can take a look at before committing.

Go tell you boss to get their card out.

Not so long ago I was working with the XIFF library again and I needed to show a list of contacts.

The contact datum is represented in XIFF as an ArrayCollection containing ArrayCollections.

Roster extends ArrayCollection and contains a property called ‘groups’ which also extends ArrayCollection.
The ‘groups’ ArrayCollection contains RosterGroup items, which also extend ArrayCollection, and each of these contain RosterItemVO’s (the actual contact).

The RosterGroup ArrayCollection represent the groups that you arrange your contacts in, including an offline group, and a RosterItemVO represents an individual contact.

So we have something like…

[code]










[/code]

I took a look at what they were doing in SparkWeb, but they had, what seemed to me, an extremely complicated way of displaying the data, when a Tree control should be able to do the job, the only problem being that a Tree didn’t want to work with ArrayCollections. To the rescue ArrayCollectionDataDescriptor!

ArrayCollectionDataDescriptor Example (right click for example source)

As you can see in the example, the objects passed into the Tree as the dataProvider need to have a property to be used at the label, so you can’t use an ArrayCollection as it is (if you do, it’ll do toString() on it for the label of the folder and you’ll get a list of your objects), so you just need to extend ArrayCollection (as they have in XIFF) and give it a property to use for the label.

The source for the ArrayCollectionDataDescriptor can be found in our Google Code Library.

A PanelStack is an combination of a ViewStack and Panel.

It extends ViewStack, and adds the panel features to it (NOTE you can’t treat the children as if they are in a Box, they are treated as if they are in a ViewStack).

Although you could put one of these together pretty easily by add a ViewStack as the only child to a Panel and making its width and height 100%, we recently required this functionality and this was a much cleaner approach for what we required, instead of overriding all the display list methods. Because it’s a ViewStack you can also use the Efflex viewStackEffects in there as you can see in the example.

PanelStack.

The source for the example is available on right-click, but the source for the PanelStack itself is in our Google Code Library.