by Andreas Dormann

Advanced Flex List Control for Mobile Devices

How to build a mobile list control with delete function…
I’m surprised that Adobe has forgotten such an obvious thing like a list control with delete function in its Flex mobile framework. You know it from the iPhone: just wiping over an item with your finger shows a delete button, on which you can click to delete the item. I’ve researched for solutions to realise such a list with Flex at our well known Flexperts, but without any success. So let’s try it ourself…

My approach is subclassing a List in combination with an IconItemRenderer. The renderer is prepared to handle gestures and listens to the (s)wipe gesture.

Well, that’s a simplified explanation of my AdvancedMobileList. Two features that I didn’t explain:

My AdvancedMobileList has an autoDelete property. If set to true, the list itself handles the deletion of an item.
I use a wipe effect to wipe my trash icon in and out. And to precisely handle the effect, I had to code a few additional things.

You can download the complete project files – embedded in an example – from here.

Feel free to use it for your own purposes!

P.S.:
When you want to use an IconItemRenderer you should use my AdvancedMobileListItemRenderer. Look at the AmericanPresidents view in my example for details. You’ll see, it has never been so easy to get rid of a president ;-).