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

 


  
 
<?xml version="1.0" encoding="utf-8"?>
 

  
 
<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
 

  
 
    layout="vertical"
 

  
 
    verticalAlign="middle"
 

  
 
    backgroundColor="white"
 

  
 
    creationComplete="init();">
 

  
 
 

  
 
  <mx:Script>
 

  
 
    <![CDATA[
 

  
 
      private var timer:Timer;
 

  
 
 

  
 
      private function init():void {
 

  
 
        timer = new Timer(1000); /* 1000ms == 1second */
 

  
 
        timer.addEventListener(TimerEvent.TIMER, onTimer);
 

  
 
      }
 

  
 
 

  
 
      private function onTimer(evt:TimerEvent):void {
 

  
 
        var idx:uint = viewStack.selectedIndex;
 

  
 
        var max:uint = viewStack.numChildren;
 

  
 
 

  
 
        var newIdx:uint = ++idx % max;
 

  
 
        viewStack.selectedIndex = newIdx;
 

  
 
      }
 

  
 
 

  
 
      private function startTimer():void {
 

  
 
        if (!timer.running) {
 

  
 
          timer.start();
 

  
 
        }
 

  
 
      }
 

  
 
 

  
 
      private function stopTimer():void {
 

  
 
        if (timer.running) {
 

  
 
          timer.stop();
 

  
 
        }
 

  
 
      }
 

  
 
    ]]>
 

  
 
  </mx:Script>
 

  
 
 

  
 
  <mx:ApplicationControlBardock="true">
 

  
 
    <mx:Buttonlabel="Start timer" click="startTimer();" />
 

  
 
    <mx:Buttonlabel="Stop timer" click="stopTimer();" />
 

  
 
 

  
 
    <mx:Spacerwidth="100%" />
 

  
 
 

  
 
    <mx:Labeltext="selectedIndex:" />
 

  
 
    <mx:HSliderid="slider"
 

  
 
        minimum="0"
 

  
 
        maximum="3"
 

  
 
        liveDragging="true"
 

  
 
        snapInterval="1"
 

  
 
        tickInterval="1"
 

  
 
        change="viewStack.selectedIndex = event.value;"/>
 

  
 
  </mx:ApplicationControlBar>
 

  
 
 

  
 
  <mx:ViewStackid="viewStack" width="100%" height="100%">
 

  
 
    <mx:VBoxbackgroundColor="haloBlue"
 

  
 
        width="100%"
 

  
 
        height="100%">
 

  
 
      <mx:Labeltext="VBox 1" />
 

  
 
    </mx:VBox>
 

  
 
    <mx:VBoxbackgroundColor="haloGreen"
 

  
 
        width="100%"
 

  
 
        height="100%">
 

  
 
      <mx:Labeltext="VBox 2" />
 

  
 
    </mx:VBox>
 

  
 
    <mx:VBoxbackgroundColor="haloOrange"
 

  
 
        width="100%"
 

  
 
        height="100%">
 

  
 
      <mx:Labeltext="VBox 3" />
 

  
 
    </mx:VBox>
 

  
 
    <mx:VBoxbackgroundColor="haloSilver"
 

  
 
        width="100%"
 

  
 
        height="100%">
 

  
 
      <mx:Labeltext="VBox 4" />
 

  
 
    </mx:VBox>
 

  
 
  </mx:ViewStack>
 

  
 
</mx:Application>
 

 
本文转自:http://blog.minidx.com/2009/01/29/2040.html