Flex中如何利用timer控制改变ViewStack当前选中Index

Download: main.mxml

1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
3. layout="vertical"
4. verticalAlign="middle"
5. backgroundColor="white"
6. creationComplete="init();">
8. <mx:Script>
9. <![CDATA[
10. private var timer:Timer;
12. private function init():void {
13. timer = new Timer(1000); /* 1000ms == 1second */
14. timer.addEventListener(TimerEvent.TIMER, onTimer);
15. }
17. private function onTimer(evt:TimerEvent):void {
18. var idx:uint = viewStack.selectedIndex;
19. var max:uint = viewStack.numChildren;
21. var newIdx:uint = ++idx % max;
22. viewStack.selectedIndex = newIdx;
23. }
25. private function startTimer():void {
26. if (!timer.running) {
27. timer.start();
28. }
29. }
31. private function stopTimer():void {
32. if (timer.running) {
33. timer.stop();
34. }
35. }
36. ]]>
37. </mx:Script>
39. <mx:ApplicationControlBardock="true">
40. <mx:Buttonlabel="Start timer" click="startTimer();" />
41. <mx:Buttonlabel="Stop timer" click="stopTimer();" />
43. <mx:Spacerwidth="100%" />
45. <mx:Labeltext="selectedIndex:" />
46. <mx:HSliderid="slider"
47. minimum="0"
48. maximum="3"
49. liveDragging="true"
50. snapInterval="1"
51. tickInterval="1"
52. change="viewStack.selectedIndex = event.value;"/>
53. </mx:ApplicationControlBar>
55. <mx:ViewStackid="viewStack" width="100%" height="100%">
56. <mx:VBoxbackgroundColor="haloBlue"
57. width="100%"
58. height="100%">
59. <mx:Labeltext="VBox 1" />
60. </mx:VBox>
61. <mx:VBoxbackgroundColor="haloGreen"
62. width="100%"
63. height="100%">
64. <mx:Labeltext="VBox 2" />
65. </mx:VBox>
66. <mx:VBoxbackgroundColor="haloOrange"
67. width="100%"
68. height="100%">
69. <mx:Labeltext="VBox 3" />
70. </mx:VBox>
71. <mx:VBoxbackgroundColor="haloSilver"
72. width="100%"
73. height="100%">
74. <mx:Labeltext="VBox 4" />
75. </mx:VBox>
76. </mx:ViewStack>
78. </mx:Application>