Built-in Physics Engine

在CS5中，Flash加入了Physcis Engine的組件，這對於designer來說是一個非常大的喜訊。以前designer要把物件在timeline上模擬真的物理反應，只能逐個keyframe慢慢調整，既花時間又不準確。現在，designer只要把movieclips設定為 “Physics Object”，再設定其他參數，如重量、velocity等等，然後就可以讓CS5 計算物件之間的物理反應，最後為所有Physics Object產生一條timeline。只要把timeline play一下，就可以看到了真正的物理反應!

當然，timeline是不dynamic的，即不能根據user input (如滑鼠標)作出反應。再者，現在應該都未support 3D Physcis，畢竟Flash IDE還是停留在2D的空間呢，不過相信這會是下幾個版本內會發生的事。先看看demo吧:

iPhone Packager

上一篇文章都提過，Flash CS5 可以直接publish出iphone格式執行檔。即代表Flash Developer可以加入iPhone App的開發團隊，在App Store上面賺賺錢了!

FLA會變成XML 格式

Flash終於放棄了用binary的fla檔了!!! 這有甚麼好處!? 如果你曾經做過Flash程式的開發，並且用SVN這些version control的軟件，就會知道有多麻煩了。因為FLA很多時都會被改被save，一save過了，不理有沒有改過東西，FLA檔都會被更新，然後SVN就會當它有更改過，下次commit上SVN時，因為binary檔做不到code diff，因此整個FLA也會上載到SVN server，浪費時間及空間。但當變成XML格式的檔案後，version control就可以發揮功用了!

和Flash Builder結合，而且有更強的Built-in Actionscript Editor

Flash built-in的 Actionscript Editor不好用就人所共知，因此很多人都寧願用其他editor，例如Flash Develop，貪它提供了code hint、auto complete、trace variable等這些好功能。現在Flash CS5終於醒覺了， 這是一個好的IDE至少要有的元素吧!

Flash 能成為RIA界的一哥，”易用易學”是他成功的重要因素。可是如果要讓Flash更成功，我覺得有幾個地方還可以改善的:

設定devlopment framework

Flash的好處是很易用，code 放在哪兒也可以跑得到。但是這卻造就成很多沒有質素的Flash 程式及程式員。Stanley看過了很多不同人做的Flash-based website的source code，很多都爛得可怕…有的code 在timeline，有的code在不知多少層內的movieclip內的keyframe上，trace code 難得要命。如果Flash可以提供一個development framework或一個standard，令每個developer的code structure也差不多，相信會令Flash 的development更加健康。

更多的UI components

Flash 內建的UI components太少了，如果在Flash做form-based的程式，所有UI都要自己寫，太花時間。如果可以把Flex那豐富UI components library也port過來一起用，那是多麼的幸福哦。而且Flash正在開始要攻入手機市場，可以的話，應該要為手機平台做些針對手機使用UI components吧!

我想: 現在寫定一個iPhone UI library for Flash也是差不多時候了!

Open Screen Project

Adobe 正在進行一個叫 Open Screen Project的項目，它的內容主要是想把Flash Player 可以建立在不同的裝置上，如電視機、桌面電腦、手機等，因此以Open Screen為名，希望可以透過Flash平台包容不同大小的screen device，並且為所有平台提供一致的互動性及用戶體驗。

Open Screen Project 官方網頁: http://www.openscreenproject.org/

Flash Professional CS5 – Packager for iPhone

Flash publish出來的程式也很流暢啊~

另一方面，快將推出的Flash CS5，早前已經表明過會包含iPhone Packager，即是你只要把Flash程序寫好，就可以直接把程序publish到iPhone程式的格式，之後就可以上載到App Store供別人下載。到時候，還需要花時間學習複雜的Objective C 麼? 就算是designer，以後都有機會加入寫手機程式的行列了! 雖然iPhone 的Safari已決定不會讓Flash Player 跑，但有iPhone Packager 卻令我更歡喜!

Packager for iPhone: http://labs.adobe.com/technologies/flashcs5/appsfor_iphone/

作為Flash Developer的一群，這些對我們都是莫大的喜訊，而我自己也很看好這個發展方向。首先，Flash 開發用戶群廣，有programmer又有designer，而且Flash 發展了這麼多年，很多人都已經懂得寫ActionScript，learning curve又低。以手機開發為例，手機型號那麼多，各有不同的OS及screen size，如果還要針對性為每個手機寫一個程式，都不知寫多少個版本才行了，所以很明顯這對手機或其他平台的程式發展必定有利。

另外，Flash open source community也十分活躍。現時已經有很多很好用又利害的library讓我們使用，如3D Engine、Physics Engine等等，因此要做各式各樣的程式或遊戲，在網上找一找已經有很多東西可以用，大大加快程式的開發時間!

雖然好處多多，但我覺得還有一些決問題還是要考慮的。我們都知道Flash Lite其實推出了也有很多年，可是為何Flash Application在手機上還是這樣不普及呢? 其中一個原因可能是以前的手機一開始沒有預載到Flash Lite Player吧，一般用戶又怎會懂去找Flash Lite安裝在手機上呢? 另一個問題，就是根本沒有Flash Application下載。可是，Apple的App Store已經告訴了我們解決辦法，就是讓community的一群也可以參與程式開發，然後放到online store讓人下載。如果Ovi Store或Android Market也可容許Flash Application，相信用戶將可以享受更加多姿多彩的程式吧!

說不定，facebook的restaurant city、開心農場會在不久將來出現在手機上了 =]

JigLibFlash同時簡也整合了papervision3D、away3D 及 sandy3D的支援，針對不同3D engine的愛好者使用，它提供的API也十分易用易明，令我很欣賞這份細心。

以下這個是Stanley測試時做的demo:

>> 放大來看

是否很有趣呢~? 有興趣可以下載source code 來玩玩~ 要用Flash CS4 compile才行哦!
>> JigLibFlash Demo (480kb)

有用連結:
JigLibFlash Startup Guide
JigLibFlash Offical Website
JigLibFlash Documentation

下載Flash OOP程式範例 >> flash_sharing_lesson2_demo.zip

說真的，之前兩年裡埋頭於RIA的領域中所得的經驗，真是要說大半天也說不完! 從UI的規劃，以至Class要如何按排，我都有我自己一套非常嚴格的標準! 我看過很多人做過的Flash Site的source code，大部份人都沒有思考過優化的問題。要知道”優化”二字包含甚廣，如performance，work flow，team co-operation，UI structure，coding structure等範疇，programmer都可以著手加以改善，可是到google上找，也沒看到有人能夠深入的探討這樣的問題。那麼，就由我來吧!

今天的Sharing只是一個introduction，是讓聽眾們了解RIA的踏腳石~ 餘下的Sharing還有兩節，一節談優化，一節談Visual Effect Programming。又是時候準備powerpoint了~

Wonderfl 主頁

用戶的code及compile了後的結果

除此之外，網站還加入了web 2.0的元素! 例如你可rate別人寫的code，rate 用戶等等功能，使用戶更加有心在這個平台上做出出色的作品，互相分享! 另外，最有用的就是code search的功能，例如你不知道”ColorTransform”如何使用，你可以來wonderfl找找code reference看，這對於學actionscript是十分有幫助的!

不過有一點要說的是，因為沒有了Flash IDE的關係，所有的UI上的東西都要寫code來generate出來了，而且這個工具只有對actionscript很了解的人才懂用啦。

最近作者還加入了Papervision3D 2.0的支援，想看更多Papervision3D 2.0的範例嗎? 快去看看啊!

以下是一些傑出的作品~

「PV3Dその3」　に　グーグル検索を交えてみた。forked from V3Dその3 – wonderfl build flash online

最近，這個技術開始被人融合到Flash的平台上，再加上papervision3D 這些3D engine，已經可以做出令人驚嘆的Flash Application了。

以上這兩個demo 都是利用web cam，加上一個特別的標記做出來的:

Demo中使用的標記

在Flash中，標記的形狀、大小、扭曲程度會被計算，並且計算出平面的距離及角度，得出這些資訊後玩甚麼都可以了~

更利厲的就是已經有位日本programmer Saqoosha 做了相關的library，叫FLARToolKit，有興趣可以看看哦:
http://www.libspark.org/wiki/saqoosha/FLARToolKit/en

相關連結:
http://www.boffswana.com/news/?p=392
http://09.aid-dcc.com/

http://www.prettyloaded.com/

Coke Zero By Coca-Cola

The Da Vinci Code 電影

在開始前，我希望大家可以先安裝一個很好用的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

連結: http://apps.yahoo.com/-2DHMuY4e

PaperVisualizer - Chat Mode

PaperVisualizer主要有以下幾個目的:

• 讓你結交更多朋友
• 提供一個中央的地方，了解朋友最近做過的事 (updates)
• 可以像Twitter一樣，可以追隨(follow)你有興趣認識的人
• 把朋友的資料(profile data)有趣地歸納及顯示出來

有興趣請試試吧，我花了整個星期去做的呢!

甚麼是YQL?

YQL全寫是Yahoo! Query Language。YQL的syntax與SQL差不多，可以利用select, from, where 等語法搜索(search)、過濾(filter)或結集(aggregate) Yahoo! 內部或外部豐富數據。主要好處是可以用一個統一的語言取得數據，這樣的話，程式員就不用每次查看documentation或學習新的API，這對於Yahoo! 平台的開放是很重要的。還有在performance的考慮上也有幫助，例如我們只需要用一個single YQL call可以取得本來要multiple call的數據，大大減少latency。

甚麼是YAP?

YAP全寫是Yahoo! Application Platform。它有點像facebook application平台，可以讓程式員在Yahoo! 上建立自己的程式。其他用戶可以選擇安裝這些YAP，並且把它們放到自己的Yahoo! Profile page, Frontpage, Yahoo! Mail等等。

PaperVisualizer - Nickname Mode

PaperVisualizer - Gender Mode

PaperVisualizer - Birthday Mode

PaperVisualizer - Detail View