Cover Flow for histology pictures

I wanted to use Apple’s Cover Flow technique for a future e-learning application about neuropathology. After some initial frustration, I have it working now!

Cover Flow in ActionScript 3.0 is based on Doug McCune’s custom component. I downloaded the latest source files, and soon concluded that I did not know how to use it properly. After watching a video on Adobe’s website, it made a little more sense. However, the real breakthrough came after reading the documentation in Tour de Flex. Although in the beginning, no content was shown in this AIR application. I could solve it by upgrading to the latest version of AIR.

The code example from Tour de Flex worked immediately. When I started to add some panels in a mx:Repeater, initially it did not look well. Apparently it is very important to set the panel’s width and height, then it worked.

The second issue that made be scratch my head was the bin-release issue. When debugging from Flex Builder, it worked. When doing the “Export Release Build” and going to the bin-release directory, it did not work. I couldn’t figure out the error, just that it had to do with the images. Here is a screenshot of what it looked like:

Very strange Cover Flow from bin-release

Deleting the mx:Image tag solved it, but what’s the point of Cover Flow if one cannot use images? I earlier found that the image must be inside a container, or the app will crash even in debugging mode. So I tried switching mx:Image for a mx:Canvas and set its backgroundImageproperty to the image. No success.

Apparently the images were rather large in file size, so I downsized them. Even then, on my computer it consistently gave this strange effect. Become a little desperate, I gave it a shot and uploaded them to the server. Sometimes it helps, seems to be “security-related” (the source view of Flex apps has this issue too, but there it is documented). And guess what… it works!

Correct Cover Flow !! (click on image for demonstration)

I still don’t understand why, but this falls in the category “Don’t know – don’t care!” You can see result for yourself in action: enjoy it !!