labs.atellis.com

For the first Atellis Labs release we’re sharing our Flex Reflection Component. This component acts as a reflective surface, displaying a live visual reflection of the area above. It’s an update to the previous reflection component I released on my personal blog last year.

I’ve been keeping updates to this component in my back pocket for quite a while, and in that time it’s been through a lot of changes. From trying bitmap compare techniques to automated event attachments, I left no stone unturned in finding the best implementation for a reflection component in Flex. In the end the best option was a straightforward automatic vs. manual approach. The default mode of automatic will give you dependable live rendering right out of the box. Setting the mode to manual will let you optimize CPU usage by allowing full control of when the reflection is updated. Along those lines I’ve radically improved the performance of the draw method using the new Flex profiler and documented the component using ASDoc.

Since the first release I’ve also seen this component used in some really cool and unexpected ways, and I wanted to be sure this update would accommodate those uses. Occasionally the reflection target would be manipulated by non-standard effects or unconventional display list drawings which weren’t reflected correctly. To address that, I added a clean solution for automatically reflecting the application area above the component when a target is not specified. This means that virtually anything in the application layer will be reflected correctly by default. It also means that implementing the reflection component is as easy as the code below.

<Reflection />


Download: Flex Reflection Component (282 kb)

Enjoy!