2011年10月27日 星期四

動畫設計師(Designer) 製作Apps

對於動畫設計師(Designer), 開發手機程式, 一定是苦惱事情. 盡管掌握傳統開發方式, 把UI 介面和動畫設計完全整合, 也是一大難題, 不時經由程式員(Programmer) 恊助一同處理, 開發成本十分高昂.
  • 傳統開發 iOS App
      - 首要必須一部MAC OS X 電腦
      - 安裝Xcode 開發平台
      - 學會Objective-C 語言
  • 傳統開發 Android App
      - 安裝Eclipse 開發平台
      - 學會Java 語言

現在, 動畫設計師可以使用Adobe Flash, 直接開發手機程式, 不求人幫助下輕鬆完成. 技巧純粹過去製作Flash 動畫方法, 在時間軸(Timeline) 設定即可, 十分簡單.
  • 開發Adobe AIR
     - 安裝Adobe Flash Professional CS5.5
     - 學會Action Script 3.0 (兩三個指令足夠運作)
     - 發佈Android, BlackBerry Tablet OS 和 iOS 

以下為大家介紹一個iPad App 範例, 及講解一些注意事項.



提升速度功能 - Cache as Bitmap
Cache as Bitmap 功能對於提升畫面速度, 有顯著效果, 它在每一個Movie Clip 的屬性值可以設定. 但我們不是每一個Movie Clip 都啟動它, 因為一些情況下, 會出現反效果, 使速度減低.


  • 啟動Cache as Bitmap 情況:
    若Movie Clip 內是靜態內容, 而整個Movie Clip 又會移動的話 (如範例的背景移動), 我們應使用Cache as Bitmap 功能

  • 不應啟動Cache as Bitmap 情況:
    若Movie Clip 內容包含影像不斷更新 (如範例的蝴蝶), 請不要啟動Cache as Bitmap, 還要把它放至獨立的圖層(Layer) 中. 它們不應包含在任何Movie Clip 內, 避免影響其他已啟動Cache as Bitmap 的Movie Clip, 作不必要的連續渲染

呼叫父系(parent) Movie Clip
在Action Script 2.0 時代, 我們可以輕易使用this._parent 呼叫上一層的Movie Clip, 在Action Script 3.0 同樣可以簡單的呼叫. 我們把this.parent 回傳定義為MovieClip 類別, 然後便可以呼叫stop(), play(), gotoAndStop() 及gotoAndPlay().
(this.parent as MovieClip).gotoAndPlay("home");

按鈕事件
因為Action Script 3.0 統一事件處理手法, 我們必須定義Movie Clip 名字, 然後addEventListener 給它, 當用戶按下便會發動事件.
function btn1ClickHandler(event:MouseEvent):void{
 (this.parent as MovieClip).gotoAndPlay("about");
}
btn1.addEventListener(MouseEvent.CLICK, btn1ClickHandler);


開啟瀏覽器
過去Flash 連結至雅虎, 我們會寫getURL("http://yahoo.com");, 現在我們可以這樣寫:
navigateToURL(new URLRequest("http://yahoo.com/"));



大家可以 [下載], 然後一齊看看. 製作自己的手機Apps.
若發佈iOS App 作實機(iPhone/iPad) 測試, 請參考以下教學.

注意事項: 請確定已更新Adobe Flash Professional CS5.5 及Adobe AIR 2.7 或以上, 若不更新發佈時會出現問題.

沒有留言: