Flash 物件導向的應用技巧 – 上編: 環境設定
filed in Flash on Dec.31, 2008 (2,405次檢視)
在這一個單元,Stanley主要會教大家一些基本的環境設定動作,讓你可以準備在Flash上使用物件導向的概念。
在開始前,我希望大家可以先安裝一個很好用的Flash ActionScript Editor,叫FlashDevelop。它是一個open source的editor,和Microsoft的Visual Studio內的editor差不多,提供auto-complete,code hint之類的功能,比使用Flash IDE入面的editor,效率可以提升十倍有多!
下載頁: http://www.flashdevelop.org/community/viewforum.php?f=11
事不宜遲,現在我們開始吧!
1. 設定Folder structure
首先,我們先建立一個folder,用來放置我們的Flash程式,我把folder叫”MyApp”。
然後在”MyApp”中,再建立一個叫”classes”的folder,之後我們所有的actionscript都會放到入面了。
2. 利用FlashDevelop建立新project
現在,我們可以在FlashDevelop中,建立一個新project。
打開了FlashDevelop後,點上面menu的”Project”,再選”New Project”。在”installed Templates”中選ActionScript 3 Empty Project,並且輸入project名字,及位置(在步驟1建立的folder),然後按”OK”。成功後,你會在”MyApp” folder中見到一個.as3proj的檔案,以後double click它就可直接打開project。
3. 設定FlashDevelop
現在,我們要告訴FlashDevelop我們的class 檔會放在那兒,做了這個步驟,你往後就可以享受FlashDevelop的威力了。
點選”Project”,再選”Properties”。在”Classpaths”這個tab中,按下”Add Classpath”,並選取之前建立的”classes” folder。
4. 建立fla檔
打開Flash IDE (我用的是Flash CS3),並建立一個新的AS 3.0 Flash 檔。同樣,我們也要設定classpath,否則之後compile時,就會因找不到相對的class檔而出現error。
按”File”,再選”Publish Settings”。點選”Flash”這個tab,再按”Settings”。不勾選”Automatically declare stage instances” * ,同時也加入Classpath,輸入”./classes/”,即是第一步建立的”classes” folder。
ok了後,把Flash檔儲好,我叫它為MyApp.fla。
* Automatically declare stage instances: 如果點選了,Flash會自動幫你在class中declare movieclip入面的其他movieclip,看似很方便,實則破壞了class的結構。即是在class中不declare 子movieclip的variable name也可成功compile,如果是另一個人接手,根本不會知道variable是在那兒decalre,代表甚麼。因此我的習慣是不選它。
5. 寫第一個class
接下來,我們可以開始寫我們的第一個class了。在AS 3.0中,引入了document class,即是我們可為場景define一個class。
現在先回到FlashDevelop,並在”classes” folder下建立以下的folder structure及檔案:
* 請留意這命名方法叫reverse domain naming convention,想了解更多可以看這網頁:
http://brajeshwar.com/2005/class-naming-convention-reverse-domain/
至於MyApp.as 的內容如下,目的是當stage建立時output “Hello World” 字句:
package com.frogiology.tutorial {
import flash.display.MovieClip;
public class MyApp extends MovieClip{
public function MyApp() {
trace("Hello Word");
}
}
}
儲存好MyApp.as後,就要把Flash的stage連接到剛才寫的class。
先在stage上任意click一下,在下面properties的panel上,在”Document class”一欄上填上: “com.frogiology.tutorial.MyApp”,即是剛才define的class。
儲存好fla檔後compile,你就會見到在output panel上出現了”Hello World”字句! 恭喜你! 我們成功寫好第一個class了!
於下一個單元,我將會以一個簡單的例子,跟大家分析做Flash的流程,如何define classes等重要概念,不要錯過啊!
>> 下載本單元demo







March 19th, 2009 on 4:06 am
期待你的中篇及下篇呀! ^_^
September 25th, 2009 on 9:55 am
程度太低不是太懂@@
December 26th, 2009 on 7:56 pm
謝謝您
這篇讓我很受用
February 6th, 2010 on 10:53 am
好清楚哦~..感謝唷@@!
很期待進階的文章咧~..
可以請問..當在寫CLASS時..一般會習慣先在FLASH IDE撰寫.測試完畢後..再將CODE改寫到.as嗎?..
感覺這類的文章..好少唷~..
February 6th, 2010 on 1:45 pm
才不是呢,直接寫到.as file 嘛
February 7th, 2010 on 12:15 pm
直接寫到.as file..
比如說..想針對FLA的一個movieclip做複雜的效果..
也是就直接寫在.as file裡的丫@@?..
February 10th, 2010 on 12:35 am
是啊,為什麼你會這樣問?~
寫在timeline上,其實是自找麻煩,而且不能用OO Programming的優點啊!