[索引頁]
[源碼下載]

積少成多Flash(4) - ActionScript 3.0 實例之Hello World, 時鐘, 計時器

作者：webabcd


介紹
通過3個簡單的示例，對使用 Flash ActionScript 3.0?開發程序有個感性的認識

• Hello World - 演示最基本的交互。即按個按鈕，就會在 UI 上顯示對應的信息
• 時鐘 - 演示如何做最基本的動畫處理。即對時鐘的時,分,秒針做旋轉動畫
• 計時器 - 演示稍微復雜一點的交互。即一個計時器，可以對其做啟動,暫停,停止的操作

1、Hello World
UI上放置一個名為lblMsg的Label，一個名為txtName的TextInput，一個名為btnHello的Button
Greeter.as // 包名稱要與文件的目錄結構對應，類名稱要與文件名對應?
package code?
{?
????????/*?
???????? * 打招呼類?
???????? */?
????????public class Greeter????
????????{?
????????????????/*?
???????????????? * 打招呼方法?
???????????????? * @param name????????????????名稱?
???????????????? * @return???????????????????????? 打招呼的結果?
???????????????? */?
????????????????public static function sayHello(name:String = "World"):String????
????????????????{?
????????????????????????return "<font color='#FFFFFF'>Hello: " + name + "</font>";?
????????????????}?
????????}?
} ? Hello.as // 包?
package?
{?
????????// 導入相關的類?
????????import flash.display.MovieClip;?
????????import fl.events.ComponentEvent;?
????????import flash.events.TimerEvent;?
????????import flash.utils.Timer;?
????????import flash.text.TextField;?
????????import flash.display.SimpleButton;?
????????import flash.events.MouseEvent;?
????????import flash.events.Event;?
????????import flash.utils.getTimer;?
????????import code.Greeter;?????????
?????????
????????public class Hello extends MovieClip?
????????{?????????????????
????????????????// 構造函數?
????????????????public function Hello()?
????????????????{?
????????????????????????InitHello();?
????????????????}?
?????????????????
????????????????/*---- Hello 的 Demo 開始 ----*/?
????????????????function InitHello()?
????????????????{?
????????????????????????// 給 Label 組件的 htmlText 屬性賦值?
????????????????????????lblMsg.htmlText = Greeter.sayHello();?

????????????????????????// 為對象增加事件處理器（第一個參數：事件類型；第二個參數：事件處理器，也就是一個方法）?
????????????????????????txtName.addEventListener(ComponentEvent.ENTER, sayHello);?
????????????????????????btnHello.addEventListener(ComponentEvent.BUTTON_DOWN, sayHello);?
????????????????}?
?????????????????
????????????????function sayHello(e:ComponentEvent):void????
????????????????{?
????????????????????????lblMsg.htmlText = Greeter.sayHello(txtName.text);?????????
????????????????}?
????????????????/*---- Hello 的 Demo 結束 ----*/?
????????}?
} ?
2、時鐘
在UI上畫3個MovieClip，分別對應時,分,秒針，分別取名為arrowHour,arrowMinute,arrowSecond
Hello.as // 包?
package?
{?
????????// 導入相關的類?
????????import flash.display.MovieClip;?
????????import fl.events.ComponentEvent;?
????????import flash.events.TimerEvent;?
????????import flash.utils.Timer;?
????????import flash.text.TextField;?
????????import flash.display.SimpleButton;?
????????import flash.events.MouseEvent;?
????????import flash.events.Event;?
????????import flash.utils.getTimer;?
????????import code.Greeter;?????????
?????????
????????public class Hello extends MovieClip?
????????{?????????????????
????????????????// 構造函數?
????????????????public function Hello()?
????????????????{?????????????????????????
????????????????????????InitClock();?
????????????????}?
?????????????????
????????????????/*---- 時鐘的 Demo 開始 ----*/?
????????????????private var timer:Timer;?
????????????????function InitClock()?
????????????????{?
????????????????????????// 實例化計時器，其參數為 tick 的間隔?
????????????????????????timer = new Timer(1000);????
?????????
????????????????????????// 指定 onTick() 方法來處理 Timer 事件?
????????????????????????timer.addEventListener(TimerEvent.TIMER, onTick);?

????????????????????????// 啟動計時器?
????????????????????????timer.start();?
????????????????}?????????????????
?????????????????
????????????????function onTick(event:TimerEvent):void?
????????????????{?????????
????????????????????????// 實例化 Date ，返回宿主服務器的當前時間?
????????????????????????var now:Date = new Date();?
?????????????????????????
????????????????????????// rotation - 對指定對象做順時針旋轉的角度數?
????????????????????????arrowHour.rotation = now.getHours() * 30 + (now.getMinutes() / 2);?????????????????
????????????????????????arrowMinute.rotation = now.getMinutes() * 6 + (now.getSeconds() / 10);?????????
????????????????????????arrowSecond.rotation = now.getSeconds() * 6;?????????????????
????????????????}?
????????????????/*---- 時鐘的 Demo 結束 ----*/?
????????}?
} 3、計時器
在UI上放置4個動態文本，分別對應時,分,秒,毫秒，分別取名為txtHour,txtMinute,txtSecond,txtMillisecond。再放置3個按鈕，分別對應計時器的啟動,暫停,停止操作，分別取名為btnPlay,btnPause,btnStop
Hello.as // 包?
package?
{?
????????// 導入相關的類?
????????import flash.display.MovieClip;?
????????import fl.events.ComponentEvent;?
????????import flash.events.TimerEvent;?
????????import flash.utils.Timer;?
????????import flash.text.TextField;?
????????import flash.display.SimpleButton;?
????????import flash.events.MouseEvent;?
????????import flash.events.Event;?
????????import flash.utils.getTimer;?
????????import code.Greeter;?????????
?????????
????????public class Hello extends MovieClip?
????????{?????????????????
????????????????// 構造函數?
????????????????public function Hello()?
????????????????{?
????????????????????????InitTimer();?
????????????????}?
?????????????????
????????????????/*---- 計時器的 Demo 開始 ----*/?
????????????????// 計時器需要顯示的 時,分,秒,毫秒 變量?
????????????????var hour:Number = 0;?
????????????????var minute:Number = 0;?
????????????????var second:Number = 0;?
????????????????var millisecond:Number = 0;?
?????????????????
????????????????// 計時器是否在計時?
????????????????var running:Boolean = false;?
?????????????????
????????????????// 播放器加載的總時長?
????????????????var playerLength:Number = 0;?
????????????????// 計時器暫停的總時長?
????????????????var pauseLength:Number = 0;?
????????????????// 計時器計時的總時長?
????????????????var timerLength:Number = 0;?
?????????????????
????????????????function InitTimer()?
????????????????{?
????????????????????????// 設置暫停按鈕初始為隱藏狀態?
????????????????????????btnPause.visible = false;?
?????????????????????????
????????????????????????// addEventListener(EventType.EVENT_NAME, eventResponse) - 為對象添加事件監聽器?
????????????????????????//???????? EventType.EVENT_NAME - 事件類型?
????????????????????????//???????? eventResponse - 事件處理器（響應該事件的方法）?
????????????????????????// 為 3 個按鈕增加 Click 事件的事件處理器?
????????????????????????btnPlay.addEventListener(MouseEvent.CLICK, clickHandler);?
????????????????????????btnPause.addEventListener(MouseEvent.CLICK, clickHandler);?
????????????????????????btnStop.addEventListener(MouseEvent.CLICK, clickHandler);?
?????????????????????????
????????????????????????// 每次進入此幀時的事件處理器?
????????????????????????// 因為本例就 1 幀，速率為 30 fps，所以每 1/30 秒會觸發一次此事件?
????????????????????????this.addEventListener(Event.ENTER_FRAME, enterFrameHandler);?
????????????????}?
?????????????????
????????????????function clickHandler(event:MouseEvent):void?
????????????????{?
????????????????????????// event.target - 觸發此事件的對象?
????????????????????????switch(event.target)?
????????????????????????{?
????????????????????????????????case btnPlay:?
????????????????????????????????????????playTimer(); // 啟動計時器?
????????????????????????????????????????btnPlay.visible = false;?
????????????????????????????????????????btnPause.visible = true;?
????????????????????????????????????????break;?
????????????????????????????????case btnPause:?
????????????????????????????????????????pauseTimer(); // 暫停計時器?
????????????????????????????????????????btnPlay.visible = true;?
????????????????????????????????????????btnPause.visible = false;?
????????????????????????????????????????break;?
????????????????????????????????case btnStop:?
????????????????????????????????????????stopTimer(); // 停止計時器?
????????????????????????????????????????btnPlay.visible = true;?
????????????????????????????????????????btnPause.visible = false;?
????????????????????????????????????????break;?
????????????????????????}?????????
????????????????}?
?????????????????
????????????????function enterFrameHandler(event:Event):void?
????????????????{?????????????????????????
????????????????????????if (running)????
????????????????????????{?
????????????????????????????????// 當前計時器需要顯示的時間?
????????????????????????????????var goTime:Number = getTimer() - pauseLength - timerLength;?
?????????????????????????
????????????????????????????????// 從總的毫秒時間中解析出時間的 時,分,秒,毫秒 部分?
????????????????????????????????// Math.floor(val:Number) - 返回小于等于指定數字的最接近的整數?
????????????????????????????????hour = Math.floor( goTime/3600/1000 );?
????????????????????????????????minute = Math.floor( (goTime/3600/1000 - hour) * 60 );?
????????????????????????????????second = Math.floor( ((goTime/3600/1000 - hour) * 60 - minute) * 60 );?
????????????????????????????????millisecond = Math.floor( goTime - (second + minute*60 + hour*3600) * 1000 );?
?????????????????????????????????
????????????????????????????????// 在 UI 上顯示格式化后的時間?
????????????????????????????????txtSecond.text = formatNumber(second);?
????????????????????????????????txtMinute.text = formatNumber(minute);?
????????????????????????????????txtHour.text = formatNumber(hour);?
????????????????????????????????txtMillisecond.text = formatNumber2(millisecond);?
????????????????????????}?
????????????????}?
?????????????????
????????????????// 停止計時器。相當于暫停計時器，然后數據歸零?
????????????????function stopTimer():void?
????????????????{?
????????????????????????txtHour.text = "00";?
????????????????????????txtMinute.text = "00";?
????????????????????????txtSecond.text = "00";?
????????????????????????txtMillisecond.text = "000";?
?????????????????????????
????????????????????????// 計時器總的啟動時長?
????????????????????????timerLength = getTimer() - pauseLength;?
?????????????????????????
????????????????????????pauseTimer();?
????????????????}?
?????????????????
????????????????function playTimer():void?
????????????????{?
????????????????????????// 計時器總的暫停時長?
????????????????????????pauseLength += getTimer() - playerLength;?
?????????????????????????
????????????????????????running = true;?
????????????????}?
?????????????????
????????????????function pauseTimer():void?
????????????????{?
????????????????????????// getTimer() - 播放器（swf）被加載后，所經過的時長。單位：毫秒?
????????????????????????playerLength = getTimer();?
?????????????????????????
????????????????????????running = false;?
????????????????}?
?????????????????
????????????????// 格式化 時,分,秒，返回長度為兩個字符的字符串?
????????????????function formatNumber(n:Number):String?
????????????????{?
????????????????????????if( n < 10 )?
????????????????????????????????return ("0" + n.toString());?
?????????????????????????
????????????????????????return n.toString();?
????????????????}?
?????????????????
????????????????// 格式化 毫秒，返回長度為三個字符的字符串?
????????????????function formatNumber2(n:Number):String?
????????????????{?
????????????????????????if( n < 10 )?
????????????????????????????????return ("00" + n.toString());?
????????????????????????else if (n < 100)?
????????????????????????????????return ("0" + n.toString());?
?????????????????????????
????????????????????????return n.toString();?
????????????????}?
????????????????/*---- 計時器的 Demo 結束 ----*/?
????????}?
}
OK
[源碼下載]


本文轉自webabcd 51CTO博客，原文鏈接：http://blog.51cto.com/webabcd/342188，如需轉載請自行聯系原作者

總結

以上是生活随笔為你收集整理的积少成多Flash(4) - ActionScript 3.0 实例之Hello World, 时钟, 计时器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。