SuperViewStack
by Ruben
For a Flex project I'm working on I decided I would need a ViewStack that also showed the children underneath the selectedChild. As some might know, the ViewStack class displays its children by setting the visibility of one to true, and that of the others to false.
This got me expecting that bringing my concept of an extended ViewStack would be a piece of cake, some piece that was.. Eventually I ended up extending the Canvas class, rather than ViewStack, because the latter seemed to have some creationPolicy issues and doesn't like instanciating children that are not its selectedChild.
SuperViewStack by default displays all of its children that are underneath its selectedChild.
You can easily adjust the factor with which underlying children fade, and with what tint. It is also possible to switch back to normal ViewStack mode.
SuperViewStack has almost all of the functionality that ViewStack has, and all the child-methods (for example addChild()) are still functional.
So go check out the demo, if you're interested you can also check out the source and documentation.
One 'feature' that might seem a little odd to some is that it uses reversed z-indexing, which means that the first added child is on top, and the last on the bottom of the stack. However, you won't notice much of this since all of it is worked out underwater and the first added child still has 0 (zero) as its index, and the fifth will still have 4 as its index..
Comments (read older)
Excellent Class.
I have a question though. Is there a tutorial I can scrutinize and use that creates the same stack effect, but for Flash? These following sites use Flash, xml, and classes (i.e.,Fuse,etc) for the same effect:
http://www.rbk.com/us/freestyle/
http://www.filippa-k.se/
click on collections to see the stack effect.
Indeed, I’m in dire need of a tutorial or link that will teach me how ot do the stack effect in Flash ala reebok.com. Any assistance would be vastly appreciated. Thanks.
I think that perhaps you might be interpreting the concept of a ViewStack the wrong way. A ViewStack is a Flex component that can store multiple views (basically any type of Flex component) and stacks them, displaying only the selected view.
SuperViewStack does the exact same thing, except for the fact that it also displays the views behind (or below, if you will) the selected view.
In my opinion the effects of the showreels on the websites you referred to are somewhat too specific and will probably not be covered solely by using a ViewStack (or SuperViesStack for that matter).
As far as tutorials go, I can recommend the actionscript.org tutorials section, that’s where I learnt the basics of writing Actionscript years ago..
The show reels from the reebok website uses xml, some collection classes, and of course Flash to create that effect. I was just looking for a shortcut to writing that code . The simple way is to use three arrays to hold the _x and/or _y properties of the image syou’re displaying, and some functions to control the alphas of each element of the array, and a function that run a command once each image is out if view. I guess I’ll write the code myself. It just seems that the code for this effect is top secret, because I asked scored of advanced Flash developer I know to assist me with the code, and I’ve been sleeping in every Flash forum on the planet, and no has a clue. WOW…But thanks to Colin Moock’s books, thanks to Flash kit, lee brimelow, Kirupa, and Zeh Fernando, I’m ept enough to write the code myself. Thanks alot for my your reply Ruben.
You rocks! Just what i’m looking for. They haven’t fixed that creationPolicy issues yet!