Randy Troppmann

This Flash based file-uploading widget is built with Flash CS3 AS3 and uses the new List control with a custom CellRenderer class. The Defining a custom CellRenderer class does an excellent job of describing how to get this done (although I found a few mistakes that I submitted and can be read at the bottom of the link). Specifically, the section titled "To use a library symbol to define a CellRenderer" is what I used.

The use case for going to the trouble of using a custom cellRenderer is when you want all the functionality a List-based display component but need to modify the look and/or functionality of each line. Such is the case with my file-uploading widget where each line has a button and logic to handle the upload process and result.

Getting it to work and look just right took a fair amount tweeking. This was the result.

Breaks after uploading 4 files

If you play with this and add file uploads, you will see that after uploading the 4th file, the new fails to initialize properly, because no button appears. My guess is that as the List is scrolling up, lines that disappear off the top are merely being moved to the bottom thereby saving having to remove a child and reinstantiate a new one. But this is unexpected and breaks file uploader (try and upload more than 4 files).

The answer was to meticulously maintain the state of each line in the data setter of the cellRenderer class. To do this I created a data transport object that represented the data set of the line. This object is used as the data attribute of items in a DataProvider object that is used as a dataProvider for the List. The cellRenderer instance receives the a user click, processes the upload, builds a custom event with data that matches the transport object and dispatches the event. The event bubbles up to Main that replaces the dataProvider item with a new one. NOW when the data setter is called for a file renderer it can access it’s data provider and initialize itself based on what it finds. This is arduous but it works:

fixed!

Here is the source. Comments welcome!

I see here on this gkinner.com blog post that Grant Skinner will be giving an ActionScript 3 workshop at the end of September. From personal experience I know that AS3 development is a different beast from AS2 and to have this kind of access to Grant is an awesome opportunity. I spent the first half of 2005 working for him and even then he was developing with AS3 in secret (so secret he couldn’t tell us, his employees, a thing!). He was the lead architect for the V3 visual components that come with Flash CS3. To get to learn AS3 best-practices and gotchas from the Master is worth its price in gold. Psst … Grant … Edmonton … nudge nudge. Then the onAir Bus would be sure to come here too!

My site Runningmap.com was Dugg recently. Head over there and give me a vote!