在這一個單元，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都會放到入面了。

設定Folder structure

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。

在FlashDevelop上建立一個新project

3. 設定FlashDevelop

現在，我們要告訴FlashDevelop我們的class 檔會放在那兒，做了這個步驟，你往後就可以享受FlashDevelop的威力了。

點選”Project”，再選”Properties”。在”Classpaths”這個tab中，按下”Add Classpath”，並選取之前建立的”classes” folder。

在FlashDevelop中設定classpath

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。

設定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及檔案:

Document Class

* 請留意這命名方法叫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。

填上document class

儲存好fla檔後compile，你就會見到在output panel上出現了”Hello World”字句! 恭喜你! 我們成功寫好第一個class了!

於下一個單元，我將會以一個簡單的例子，跟大家分析做Flash的流程，如何define classes等重要概念，不要錯過啊!

>> 下載本單元demo