Flex 2 ViewStack Component Visibility

The ViewStack component in the Flex framework operates by setting the visibility on one of its children — the child with index specified by ViewStack.selectedIndex — to true, and the visibility of all the other children to false.  It is not difficult to imagine a scenario where ViewStack.selectedIndex is bound to a variable that sometimes changes; as that variable changes, the ViewStack dutifully follows along, changing to match.  Nice and easy, right?  Right. 

Careful, though.  Something bit me the other day when I was using a setup like this.  I needed a particular child Canvas of the ViewStack to become momentarily invisible so that I could do some animation on a canvas floating above it.  No problem, I thought, I’ll just manually set that Canvas’s visibility to false.  So I did, and was quite befuddled by the results: the Canvas’s visibility, when set to false, was immediately set back to true, making the animation on top of it look really wacky. 

It took me awhile to realize that binding the ViewStack’s selectedIndex property was causing it to reset the visibility on the child in question back to true, without my wanting it to do so.  Thus, the Canvas I wanted to disappear… well, it never did. 

Solution?  Set the visibility of the entire ViewStack to false, not just the one particular child in question. That did the trick.  Ahhh, much better!