The following example shows how you can execute code at regular intervals using the Timer class. It also shows you how you can create timers that repeat continuously as well as timers which only execute a [...]]]> In previous examples, we saw how to use the setInterval() and setTimeout() methods to create simple timers.

The following example shows how you can execute code at regular intervals using the Timer class. It also shows you how you can create timers that repeat continuously as well as timers which only execute a specific number of times.

Full code after the jump.

The following example shows a very simple timer which runs continuously every 1000 ms (1 second):

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/20/creating-timers-using-the-timer-class/ -->
<mx:Application xmlns: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);
                timer.addEventListener(TimerEvent.TIMER, timer_timer);
                timer.start();
            }

            private function timer_timer(evt:TimerEvent):void {
                var tmr:Timer = evt.currentTarget as Timer;
                var obj:Object = new Object();
                obj.currentCount = tmr.currentCount;
                obj.delay = tmr.delay;
                obj.repeatCount = tmr.repeatCount;
                obj.running = tmr.running;
                arrColl.addItemAt(obj, 0);
            }
        ]]>
    </mx:Script>

    <mx:ArrayCollection id="arrColl" />

    <mx:DataGrid id="dataGrid"
            dataProvider="{arrColl}"
            width="100%"
            rowCount="10"
            verticalGridLines="false"
            verticalScrollPolicy="on">
        <mx:columns>
            <mx:DataGridColumn dataField="currentCount" />
            <mx:DataGridColumn dataField="repeatCount" />
            <mx:DataGridColumn dataField="delay" />
            <mx:DataGridColumn dataField="running" />
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

View source is enabled in the following example.

The following example shows a timer which runs exactly 5 times, and then dispatches a timerComplete event:

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/20/creating-timers-using-the-timer-class/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white"
        creationComplete="init();">

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;

            private var timer:Timer;

            private function init():void {
                timer = new Timer(1000, 5);
                timer.addEventListener(TimerEvent.TIMER, timer_timer);
                timer.addEventListener(TimerEvent.TIMER_COMPLETE, timer_timerComplete);
                timer.start();
            }

            private function timer_timer(evt:TimerEvent):void {
                var tmr:Timer = evt.currentTarget as Timer;
                var obj:Object = new Object();
                obj.currentCount = tmr.currentCount;
                obj.delay = tmr.delay;
                obj.repeatCount = tmr.repeatCount;
                obj.running = tmr.running;
                arrColl.addItemAt(obj, 0);
            }

            private function timer_timerComplete(evt:TimerEvent):void {
                var tmr:Timer = evt.currentTarget as Timer;
                Alert.show(tmr.currentCount + " of " + tmr.repeatCount, "Timer complete");

                // Call the Timer instance's timer event handler.
                timer_timer(evt);
            }

            private function resetTimer():void {
                arrColl = new ArrayCollection([]);
                timer.reset();
                timer.start();
            }
        ]]>
    </mx:Script>

    <mx:ArrayCollection id="arrColl" />

    <mx:ApplicationControlBar dock="true">
        <mx:Button label="Reset" click="resetTimer();" />
    </mx:ApplicationControlBar>

    <mx:DataGrid id="dataGrid"
            dataProvider="{arrColl}"
            width="100%"
            rowCount="10"
            verticalGridLines="false"
            verticalScrollPolicy="on">
        <mx:columns>
            <mx:DataGridColumn dataField="currentCount" />
            <mx:DataGridColumn dataField="repeatCount" />
            <mx:DataGridColumn dataField="delay" />
            <mx:DataGridColumn dataField="running" />
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

View source is enabled in the following example.