Use LinkBar to control the ViewStack
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
private function myEasingFunction(t:Number, b:Number, c:Number, d:Number):Number {
return 0.2;
};
</mx:Script>
<mx:Move id="moveLeftShow" xFrom="600" xTo="0" yTo="0" duration="3000" easingFunction="myEasingFunction" />
<mx:Move id="moveRightHide" xFrom="0" xTo="600" duration="3000" easingFunction="myEasingFunction" />
<mx:LinkBar dataProvider="myVS" />
<mx:ViewStack id="myVS" borderStyle="solid">
<mx:Canvas id="Canvas0" label="Canvas0" creationCompleteEffect="{moveLeftShow}" showEffect="{moveLeftShow}"
hideEffect="{moveRightHide}">
<mx:Box height="300" width="600" backgroundColor="#00FF00">
<mx:Label text="Screen 0" color="#FFFFFF" />
</mx:Box>
</mx:Canvas>
<mx:Canvas id="Canvas1" label="Canvas1" showEffect="{moveLeftShow}" hideEffect="{moveRightHide}">
<mx:Box height="300" width="600" backgroundColor="#0033CC">
<mx:Label text="Screen 1" color="#FFFFFF" />
</mx:Box>
</mx:Canvas>
<mx:Canvas id="Canvas2" label="Canvas2" showEffect="{moveLeftShow}" hideEffect="{moveRightHide}">
<mx:Box height="300" width="600" backgroundColor="#0000CC">
<mx:Label text="Screen 2" color="#00FFFF" />
</mx:Box>
</mx:Canvas>
</mx:ViewStack>
</mx:Application>
Related examples in the same category