發表文章

目前顯示的是有「Flash 教學」標籤的文章

FlashDevelop 3.0.x 開發環境安裝及使用(二)

圖片
另一個使用 FlashDevelop 的開發流程是利用Flash 來建立資源(圖形、影片片段等)而用 Flex SDK 來編譯程式:  1.使用 Flash 建立圖形及內嵌的資源(如字型、聲音)  2.使用 Flash 發佈 SWC library 檔。  3.將 SWC 加入到 FlashDevelop 專案。  4.使用 FlashDevelop 結合 Flex SDK 編譯你的專案。 元件設計    首先,假設你是扮演視覺設計師的角色。你要做的就是將 Flash 影片中要使用的元件設計好。然後,必須在各個需要供程式操作的元件中加入與該元件與該元件結合的類別。如下圖(特別注恴:fla 文件類別設定要留白,不要與任一個 Class 結合)  並且在發佈設定的 Flash 頁籤勾選要匯出 SWC。然後,按下發佈按鈕。Flash 會將SWC 發佈到與 .swf 檔案同一目錄。將此一SWC 交給程式設計人員。 程式設計 1.建立一個 AS3 專案。(記得讓它自行產生目錄) 2.將 SWC 複製到專案的 lib 目錄下。然後,在 SWC 按右鍵勾選目 Add to Library。 3.開始在 Main.as 寫程式,使用 SWC 內的元件。(你不一定要將主程式命名為 Main.as ,如果是多個類別同時存在時,只要在進入點的 Class 按右鍵,選取 Always Compile 即可) package { import flash.display.MovieClip; import jason.test.Square; /** * @author Jason Chen */ public class Main extends MovieClip { public function Main():void { var sq:Square= new Square(); addChild(sq); sq.x = 100; sq.y = 100; sq.width = 50; sq.height = 50; } } } 4.如果你要該 swf 產生在不同目錄,或用不同名稱,你可以在 project-> Properties 設定其輸出檔案路徑名稱。 5.最後,在 FlashDevelop 使用 Project->test movie 測試其執行結果。 如此...

FlashDevelop 3.0.x 開發環境安裝及使用(一)

圖片
最近一直在找一個比較好用,而且免費的 flash 開發工具。最後,發現了 FlashDevelop。對我來講,比較可惜的是-它並不是 Eclipse 的 Plug-in,或者類似的開發環境,而必須另外再熟悉它。但是,它的確符合了免費好用的條件。以下就來介紹如何使用它。 一、下載 主網頁 http://www.flashdevelop.org/wikidocs/index.php?title=Main_Page 下載網頁 http://www.flashdevelop.org/community/viewforum.php?f=11 二、安裝 安裝之前,先需要安裝 Flash Player 9 ActiveX runtime;另外,如果使用 Flex SDK 作編譯,也需要安裝 JRE 1.6 以上,和 Flex SDK。它們的下載網頁分別在 JRE http://java.sun.com/javase/downloads/index.jsp ownloads/index.jsp Flex SDK http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3 (它只需要解壓即可) FlashDevelop 它的安裝相當簡單,基本上只需要執行下載後的執行檔,選取安裝路徑,其他幾乎都是下一步(next)接下一步就完成了。 三、設定 安裝完成後,有一些基本的設定要設(假設已安裝好 JRE ,並已解壓 Flex SDK): a.先啟動 FlashDevelop b.設定 flex SDK 路徑:在選單上選取 Tools->Program settings(或直接按 F10)在以下畫面設定。 c.選擇 FlashViewer Plug in 同以上畫面選取 FlashViewer ->External player path。選取的路徑是你的 Flex SDK 安裝目錄之下的 [Flex_SDK_Install_Path]\runtimes\player\10\win\FlashPlayer.exe d.在選單上選取Tools->Flash Tools -> Documentation Generator ->Settings 如圖3 設定的路徑為 [Flex_SDK_Inst...

Flash 動畫的基本概念(一)

開始學習用 Flash 繪製製動畫之前,一定要先了解以下的相關概念: 一、向量圖形與點陣圖: 向量圖 指的是繪畫過程的筆畫都留存下來,利用數學向量運算來呈現所繪製的結果。 所以,它可以被逐筆被回復,比較容易依比例放大縮小,而不容易失去原有的真實感。在 Flash 當中直接繪製的圖形就是向量圖,所以當它被放大並不會失真。而且一般 而言,它所佔的記憶體空間比較小。 點陣圖 指的是圖形最終的樣子是以一點一點的方式被記錄下來,一般的照片就是一個點陣圖最佳的例子。一般而言,它所佔的空間比較大,而且放大時會失真,圖形變成如同加了馬賽克。 二、動畫原理 動畫和電影一樣是利用人類視覺暫留的錯覺,來讓間隔極短的不連續圖片看起來像是連續的動作一般。我們在 Flash 中製作動畫,也是一樣的原理。所以,請在開始使用Flash這個工具前,先了解以下的名詞: 影格 所謂的影格,就是我們上一段所說的”不連續的圖片”中的一張。例如:1 秒鐘顯示12張影片,用專業一點的說法就是一秒中有十二個影格。也就是說為了要顯示那一秒鐘的動畫要畫十二張圖形。而每一張圖顯示的時間只有 1/12 秒。 關鍵影格與一般影格  當然,你也不用一聽說一秒要畫十二張圖,就想說算了,不學了!也沒那麼可怕啦!這是因為影格當中,還有分成一般影格與關鍵影格。在以前,手工繪製卡通影片的年代,關鍵影格就是需要由”關鍵性”大師所繪製,而一般影格就是由還未”出師”的阿榮在畫的(歹勢嘸知阿榮的師兄叫啥名,不過阿榮也是還未”出師”)!為什麼要這樣區分呢?因為關鍵影格通常指是在動作有所轉折的那些影格,所以如果沒畫好,會影響整個畫面的流暢度;而一般影格,則只是銜接二個關鍵影格間的圖片。所以,還沒”出師”的阿榮只要跟著描,做一點小變化就可以了。  現在用電腦作畫,每個人都是大師!所以要畫關鍵影格,中間的一般影格,就留著讓電腦幫忙產生”補間動畫”就可以。以上這樣,應該就可以大致了解”一般影格”、”關鍵影格”、”補間動畫”這三個名詞了吧?! 圖層 圖層是指將遠近或上下的物件,因為它們的移動或變化的頻率、速度不同,為了避免太多的重畫或相互干擾,所以在電腦上將它們分別畫在不同的圖層。以往手工繪製的年代則是用透明的賽璐璐來製作不同圖層的效果。  "山月隨人歸",在繪製時,就可以利用不同的圖層來繪製山、月、人。人在最上層,移動最快,其次是山...

ActionScript 類別與Flash 的MovieClip 結合(二)-元件類別

圖片
 Flash 元件庫中的元件可以與 ActionScript 的類別結合,用 ActionScript Class 的屬性和方法來控制產生元件所產生實體物件的行為。其具體做法是: 在偏好設定,指定 ActionScript Code 存放位置。參閱 http://richjason.blogspot.com/2009/07/actionscript-flash-movieclip.html 。 建立一個 *.as 的 ActionScript 類別檔案,在指定的目錄下。 在元件庫選取要與 ActionScript 類別結合的元件。 按下滑鼠右鍵選取元件屬性。 在連結的部份勾選〔匯出給ActionScript 使用〕,並輸入要與該元件結合的類別名稱。如圖所示。   該元件所產生的實體即與所指定的 class 結果,Class 的程式碼即可操作該影片的行為及屬性。

ActionScript類別 與 Flash 的 MovieClip 結合(一)-文件類別

圖片
Flash 是目前網路上製作動畫最重要的工具,當 Flash 的影片片段與 ActionScript 的 Class 結合在一起之後,會讓物件導向的種種觀念更容易被理解。  在 Flash CS3 以後,使用 ActionScript 3.0 更加強物件導向的概念。ActionScript 不僅可與影片片段結合,更可以與整個 fla 檔案(文件)作結合。當你將 class 與 flash 文件結合後,也就是說,你可以完全將 ActionScript 寫到外部的 *.as 類別檔中,幾乎不用將程式寫在 Flash 的影格內。文件載入後,就會自動執行該 Class 的建構功能(Constructor),再去創造出各種所需要的元件。之後由此展開整個 Flash 影片中的各項功能。如此,將每一個元件(包含文件)都和一個外部的 *.as 結合,而在各個 class 中分別處理自己的屬性、方法、事件。我想這應該是比較好的 Flash 程式寫法吧!  要將 Class 與影片片段結合作法如下,首先你必須指定 ActionScript 程式碼要存放的路徑: 在選單上選取 編輯/偏好設定 ,再選 ActionScript/ActionScript 3.0 設定 按鈕。 利用 +- 號按鈕來增減ActionScript 類別路徑。你可以設定相對路徑,或者絕對路徑。第三個準星的符號,就是給你選絕對路徑用的。 這樣設定完才能確保 Flash 知道到哪裏去找 ActionScript。 接下來先剛才指定的目錄中建立一個 AS 的 Class 檔。它的檔名和Class 名稱一致,副檔名為 .as。 在選單上選取 檔案/新增 ,再選 ActionScript 檔案 。 開啟空白檔案後,建立簡單一個類別(class),程式如以下列表一,完成後存檔離開。 package cyberstar.test;$${$$ import flash.display.MovieClip;$$/**$$* @author JASON$$*/$$public class TestMain extends MovieClip$${$$public function TestMain()$${$$trace("start");$$}$$}$$} (列表一) 回到 fla 檔案,點選舞台上空白處,在文件...