Flex中如何利用setInterval()和clearInterval()函数按照一定时间有规则的执行函数的例子

By Minidxer | April 4, 2009

接下来的例子演示了Flex中如何利用setInterval()和clearInterval()函数，按照一定时间有规则的执行函数。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Script>
  8.         <![CDATA[
  9.             import mx.controls.Alert;
  10.             import mx.controls.dataGridClasses.DataGridColumn;
  11.  
  12.             private var interval:uint;
  13.  
  14.             private function startInt():void {
  15.                 interval = setInterval(getTime, 1000); // 1 second
  16.  
  17.                 startButton.enabled = false;
  18.                 stopButton.enabled = true;
  19.             }
  20.  
  21.             private function stopInt():void {
  22.                 if (interval) {
  23.                     clearInterval(interval);
  24.                     Alert.show("Interval stopped.");
  25.  
  26.                     startButton.enabled = true;
  27.                     stopButton.enabled = false;
  28.                 }
  29.             }
  30.  
  31.             private function getTime():void {
  32.                 arrColl.addItemAt({date:new Date(), timer:getTimer()}, 0);
  33.             }
  34.  
  35.             private function date_labelFunc(item:Object, col:DataGridColumn):String {
  36.                 var dat:Date = item.date as Date;
  37.                 return dat.toTimeString();
  38.             }
  39.  
  40.             private function timer_labelFunc(item:Object, col:DataGridColumn):String {
  41.                 return numberFormatter.format(item.timer);
  42.             }
  43.         ]]>
  44.     </mx:Script>
  45.  
  46.     <mx:NumberFormatter id="numberFormatter"
  47.             useThousandsSeparator="true" />
  48.  
  49.     <mx:ArrayCollection id="arrColl" />
  50.  
  51.     <mx:ApplicationControlBar dock="true">
  52.         <mx:Button id="startButton"
  53.                 label="start interval"
  54.                 click="startInt();" />
  55.         <mx:Button id="stopButton"
  56.                 label="stop interval"
  57.                 enabled="false"
  58.                 click="stopInt();" />
  59.     </mx:ApplicationControlBar>
  60.  
  61.     <mx:DataGrid id="list"
  62.             dataProvider="{arrColl}"
  63.             verticalScrollPolicy="on"
  64.             width="300">
  65.         <mx:columns>
  66.             <mx:DataGridColumn dataField="date"
  67.                     headerText="date:"
  68.                     labelFunction="date_labelFunc"
  69.                     width="200" />
  70.             <mx:DataGridColumn dataField="timer"
  71.                     headerText="timer (ms):"
  72.                     labelFunction="timer_labelFunc"
  73.                     textAlign="right"
  74.                     width="100" />
  75.         </mx:columns>
  76.     </mx:DataGrid>
  77.  
  78. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Other | No Comments » | 1,217 views Tags: ,

Random Posts

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll