圖2-1 設置文檔類
請注意,我們輸入的是類名,而不是文件名。所以這里不需要輸入擴展名 .as。如果這個類包涵在一個包中,那么就需要輸入類的完整路徑——例如:com.friendsofed.chapter2.Test。
程序動畫
下面,再來學習一些 AS 3 編程的基本原理。如果你已經選擇好了一個開發環境,那么就出發吧。讓我們進入 ActionScript 動畫世界。
動畫的執行過程
幾乎所有的程序動畫都包括幾種不同的執行過程。對于逐幀動畫來說,意味著創建和存儲一組連續的位圖,每一幀都是一幅圖像,只需要進行顯示即可,見圖 2-3。
圖2-3 逐幀動畫
當我們在 Flash 中使用圖形或元件時,事情就發了微妙的變化。這時,Flash 不會為每一幀創建和存儲新的位圖。對于每一幀而言,Flash 存儲的是舞臺上每個對象的位置,大小,顏色等等。比如,一個小球在屏幕上移動,每一幀只存儲小球的在該幀上的位置,第1幀小球的位置在左邊第10個像素,第2幀也許就在第15個像素,等等。Flash 播放器(Flash Player)讀取這些信息,再根據這些信息的描述來渲染舞臺并顯示該幀。根據這些變化擴展一下流程圖,見圖 2-4。
圖2-4 渲染并顯示幀
我是這樣描述一個動態程序動畫的,見圖2-5。
圖2-5 腳本動畫
如圖2-5所示,沒有第1幀、第2幀的概念,腳本動畫通常只由一幀完成。下面我們就來看看動畫的執行過程。
首先,建立初始化。舞臺中放入一個影片剪輯,再創建補間動畫,或使用代碼來描述整個場景。總之,最后都要對該幀進行渲染及顯示。
然后,應用自定義規則。規則可以像“讓球向右移動5像素”這樣簡單,也可以是由幾十條復雜的三角函數組成。使用自定義規則會產生新的描述再根據這些描述進行渲染及顯示,并不斷地應用這個規則。
請注意,同一規則被一遍又一遍地執行,而不是對第1幀用一套規則,而對第2幀又使用另一套規則。所以難度就在于,一套規則要處理所有可能出現的情況。要是球向右移動得過遠,超出了舞臺怎么辦?你的這套規則就要解決這個問題。是否還希望用戶通過鼠標來操作小球?那么你的規則也要把它考慮進去。
聽起來很復雜,其實不然,這里所說的“規則”,實際上就是 ActionScript 代碼。每套規則都可由一行或多行代碼組成。下面是小球向右移動5像素的例子:
ball.x = ball.x 5;
這句話是說無論小球 X 坐標(水平軸)在哪里,都在原來的 X 位置上增加5像素,并把該坐標作為它的新 X 坐標。也可簡化為:
ball.x = 5;
“ =”操作符:把右邊的值與左邊的變量相加,相加的結果再賦值給該變量。以下是更多的高級規則,日后會學到:
var dx:Number = mouseX - ball.x;
var dy:Number = mouseY - ball.y;
var ax:Number = dx * spring;
var ay:Number = dy * spring;
vx = ax;
vy = ay;
vy = gravity;
vx *= friction;
vy *= friction;
ball.x = vx;
ball.y = vy;
graphics.clear();
graphics.lineStyle(1);
graphics.moveTo(ball.x, ball.y);
graphics.lineTo(mouseX, mouseY);
這段現在看不懂沒關系,大家只要知道 Flash 會在每一幀中生成這段代碼,并不斷地執行。
怎樣讓它循環執行?看看我第一次的嘗試,這也是很多 AS 初學者都會犯的錯誤。這是在很多程序設計語言中都存在的循環結構,如 for 和 while。用循環結構使代碼重復執行,這就是我曾寫的那段:
for (i = 0; i < 500; i ) {
ball.x = i;
}
看起來相當簡單。變量 i 從 0 開始,所以小球 X 坐標移動到 0——舞臺最左邊。i 讓i 的值每次增長1,即:0~1~2~3~4…,每次這個值都會做為 ball.x 的值,把小球從左向右移動。當值為500時,表達式 i<500 值為假(false),循環結束。
如果你也犯過同樣的錯誤,就會知道,小球沒有在舞臺上發生移動——只是一下子出現在了舞臺的右邊而已。為什么沒有移動到中間的那些點上?其實它移動了,只是我們沒有看到,因為我們沒有讓 Flash 去刷新屏幕。圖2-6 為另一個流程圖,看看實際都發生了什么。
圖2-6 為什么循環結構無法產生動畫
實際上我們使用自定義規則使球移動到指定位置,并創建了500次新的場景。但在循環結束之前沒有給出顯示,這是因為 Flash 只在每一幀結束后才進行一次刷新,這點很重要。以下是 Flash 進入幀的動作順序:
|
新聞熱點
疑難解答