Adobe重大發表...

今天Adobe在Labs放出了Flex 3跟AIR(Adobe Integrated Runtime,也就是Apollo更名後的名字)的最新Bate版,另外配合這次發表,Flash Player也有更新了...

Flex 2.0.1 Hotfix 2

Adobe發布了Flex 2.0.1 Hotfix 2,修正了Flex 2.0.1的一些bug,有在使用Flex的朋友記得更新呀~

kuler...

不會配色嗎?可以試試kuler...
目前有網頁版跟apollo版...
不過我看起色票還真是沒感覺...

JavaFX Script...

目前Java社群最火熱的消息就是Sun公布了他們的RIA方案~JavaFX Script...
相較於微軟(Microsoft)的silverlight,我對JavaFX的關注度還比較高一點,畢竟之前我是寫Java的(VB也有啦,不過我專四拋棄它轉投Delphi了,後來就專注Java了...),JavaFX開出來的需求很簡單,只要有JRE1.5以上就好,比較起FlashPlayer9的安裝率,我想應該不相上下吧,這背後的意義就是你寫的程式,只要發布馬上就可以跑,果然是我們常常聽到的Java口號~~"Write once, run anywhere!!"...
仔細研究一下JavaFX,它是Java跟VRML的組合,有了VRML的加持,補強Java UI的部份,目前開出來的開發工具除了官方的NetBeans之外,就是Eclipse了,目前也都有資源可以下載使用了,可以參考JavaFX的資源網站~openjfx...
大戰準備開始啦,目前RIA三大廠(Adobe,Sun,Microsoft)的底牌都開出來啦,又是選邊站的時候了嗎?

asSQL...

asSQL是一個AS3 Driver to MySQL,利用這個介面就可以直接存取MySQL就不用透過Server side的程式了,目前只提供Local端的方式連接,第一個想到的就是Apollo可以直接用,不過想到就是安全性的問題,或者其他配套的問題,不過還是看好發展性...

FLVCheck Tool....

這是Adobe官方的FLVCheck Tool,顧名思義就是拿來檢查利用其他非Adobe產品轉出來FLV的格式,包含metdata,timestamps,message headers是否符合目前Adobe的標準,這樣來確保使用上不會有問題...

Flex/AS3 3D Engine demo...

今天發現了這個網站Outsmart Labs,他們正在研究開發Flex/AS3 3D Engine,已經有demo可以看,很有趣,連裡面的Flex組件都可以照常使用,這可是不像某購物台在介紹電腦產品時放放影片檔一樣唬人喔,是可以自己操作的...

Flash CS3初玩心得...

本來想寫長篇大論,但是如果是照大家都知道的特點寫就沒意思了,算了,寫自己用的感覺就好...
Flex用久了就只會寫程式,所以只對程式撰寫上多玩了一下,感覺比Flash 8好多了,不管是程式碼提示,還有我最愛的程式碼整理跟檢查語法,另外就是Compiler的速度真的快很多...
另外就是增加獨立Debug的功能區,用起來很直覺,資源監控上還蠻完整的,這部份就大大加分,好太多了,其他與其他產品整合沒機會玩到,所以就不多說了...

Flex即將Open Source...

今天中午嗑便當的時候在MXNA上看到一大票Flex即將Open Source的消息...
應該是在今年度Adobe會逐漸將Flex Open Source,採Mozilla Public License(MPL)的方式...
Open的內容如下:

• MXML Compiler
• AS3 Compiler
• Flex Command Line Debugger
• View Source Utilities
• Web Tier Compiler Modules
• Automated Testing

沒有Open的如下:

• Flash Player
• Flex Builder
• LiveCycle Data Services(就是之前的Flex Data Services)
• Charting Component

可以想像的到以後會有免費的Flex IDE工具可以用,一大堆延伸的技術被發展出來...
Adobe這招厲害,Open後靠社群發揚光大,然後再用商業力量推廣,最後就是開發市場上的市佔率...
Anyway,這個消息還是很令人興奮呀!!!
PS1.資料來源MXNA,rewindlife.com
PS2.找到官方消息網頁,請參考這裡...

Flex Component Kit for Flash CS3

在Flash CS3推出後陸續就可以看到Flash CS3跟Flex整合的工具推出了...
現在這個工具Flex Component Kit for Flash CS3不得不講,它是用來將Flash CS3設計出來的組件輸出SWC給Flex整合使用,在這裡就已經可以想像到Flex有這個利器的幫助所創造出來的介面會多多采多姿了...
不過在使用上要注意的是以下幾點:
1.需要Adobe Extension Manager 1.8
2.需要Flex 2.0.1 patch for CS3 Compatability
3.在Flash CS3開發的必須是AS3格式的程式輸出的SWC檔...
4.當然其他基本的工具都要有(Flash CS3,Flex,Flash Player9...)
另外可以參考這個線上會議的介紹,很詳細的介紹跟Demo,中午嗑便當的時候可以看看...

Flash CS3資源...

最近特別懶惰,工作完後回到家就往床上報到了...
有些消息還是得注意一下...
自從上個月底Adobe發表CreativeSuite 3(CS3)後陸續就看見相關產品的蹤跡了...
雖然都還沒有開賣跟完全開放試用版下載,但是還是陸續發表...
今天看到了Flash CS3的文件放出來了,詳細可以參考Flash resources,裡面很多文件都有線上版跟PDF版,資源相當豐富...
另外還有跟Flex整合的Flex 2.0.1 patch for Flash CS3 Professional compatibility

Red5...

Red5是Open source的Flash Media Server(FMS),現在最新的版本是0.6 rc2...
在多方考量下,決定將之前開發的FMS相關程式移轉到Red5上...
Red5是Java base的,所以我又把以前寫java程式環境建構起來(腦袋的java compiler也需要換換..)..
開發環境如下:
*Server-side部分
 -Java JDK 6
 -eclipse 3.2.2
  -Subclipse(SVN plug-in)
  -QuantumDB(Database access plug-in)
  -XMLBuddy(XML edit plug-in)
*Client-side部分
 -Flex 2 Builder
*DataBase部份
 -MySql 5.0.26
其實Flex 2 builder也可以是plug-in的形式存在在eclipse中,因為Flex 2 builder本來就是以eclipse為基礎開發的,我最早學習Flex 2的時候也是這樣子弄,但後來我還是移除掉重新安裝獨立的版本,因為開發環境比較單純,因為我的eclipse已經裝了一堆plug-in...
大概講一下怎麼部署Red5,透過SVN(網址:http://svn1.cvsdude.com/osflash/red5/java/server/trunk)就可以直接取出Red5到電腦上,然後必須先透過Ant部署/建構(red5 root資料夾內的build.xml),這樣就完成基本的環境建構了...
接下來就可以寫測試程式,跟開始移轉FMS程式到Red5上了,下面有個網站可以參考...
http://www.joachim-bauch.de/index.html/en
在tutorials裡面就有Red5的教學文章(包含建立第一隻程式,跟從FMS移轉到Red5..)
基本上Red5的中文資源真的很少,我英文又破,所以花很多時間在看文件跟資料上,學海無涯呀...

Flex 2.0.1 SDK Hotfix 1...

Flex 2.0.1 SDK Hotfix 1釋出了...
修正了一些Bug,主要如下:
1.DataGrid
2.CellRenderer
3.Tree
4.其他修正

FLV MetaData Viewer...

想看FLV的MetaData嗎?除了自己寫程式去撈外就是找工具用了...
上次抓附加MetaData資訊的工具(FLVMDI)的網站另外有個工具也很讚...
就是 FLV MetaData Viewer (FLVMDV),可以在檔案內容裡面看到FLV的MetaData...
這樣要判斷FLV的資訊就方便許多...
當有好用的工具就會野心很大的想,有沒有可以把所有相關影音資訊秀出來的工具呀?這樣就不用自己去猜他背後的編碼格式是什麼了...

Apollo小玩心得...

這兩天找空小玩了一下Apollo,寫了幾個小程式來試看看...
基本上跟寫Flex程式沒多大差別,我也將以前的程式移轉Apollo上,目前是沒遇到問題,所以看起來是沒有上手問題...
不過畢竟是alpha 1,所以還是有些問題...
<mx:Html>標籤大概是這一次alpha上最受注目的項目之ㄧ,不過利用它寫出來的程式還是有問題,我遇到的問題如下:
*多國語言顯示與輸入的問題:這部份我沒有詳細研究不過我想Apollo應該還是會以unicode為主,但是遇到某些網頁(包含正體中文,簡體中文,日文)還是會出現問題,輸入部分我用新注音完全無法輸入,不知道是alpha 1版的關係,還是我程式沒寫好...
*字型顯示和CSS問題:這個跟unciode網頁應該也有相關的問題,遇到某些網頁排版會死的很慘,目前支援度看來還有待改進...
*沒有內嵌Flash player:瀏覽到含有Flash的網頁都無法顯示,這部份是Apollo一直強調整合的部份,但是在Alpha 1上沒看到,有點可惜(PDF好像也沒有,這也是強調重點之ㄧ)...
*文件要另外開來看,沒有跟Flex 2 builder整合,會不會因為只是Alpha 1所以沒做...
*建立Apollo專案的時候還需要自己手動設定run/debug的方式,不然預設會跑Flex專案編譯,這點就很奇怪,不知道是我安裝的問題還是其他問題,都已經建立Apollo專案了,怎麼還要自己手動調,怪怪的...
不過Apollo終於掀開神秘的面紗出現在面前,看來未來這幾個月會很好玩呀!!!

Apollo alpha 1 開放下載啦...

Adobe的Apollo終於放出了alpha 1版了...
目前可以下載到的包含Runtime,SDK,文件,開發套件for Flex Builder 2.01和範例程式...
要來好好玩一下啦...
另外Apollo for Adobe Flex Developers Pocket Guide這本書在Adobe Labs也放了整本書的pdf版上去,真是驚奇,是不給歐萊禮賣這本書了嗎?乾脆就免費大放送的政策真是讚呀...

*Adobe Apollo（Adobe Labs）
*Apollo:Applications:Samples（Adobe Labs）
*Apollo for Adobe Flex Developers Pocket Guide（Adobe Labs）

Apollo for Adobe Flex Developers Pocket Guide...

看MXNA的時候發現了Apollo for Adobe Flex Developers Pocket Guide這本書的完整版!!!
馬上抓下來存檔,晚上要K的書又多一本啦!
Adobe Lab的Apollo網頁已經把DownLoads跟Documentation兩區準備好啦...
看來快啦!!Apollo~~~

Flv MetaData...

這兩天用Flex開發Flv的播放程式...
由於沒有利用Flash Media Server,所以要取得Flv的基本資訊就要靠Flv的MetaData...
找到一個Open Source的工具FLVMDI可以附加MetaData到Flv裡面,也支援command模式,這樣利用Script大量輸出會比較方便...

Skinning & Scale-9

開始進入令我頭痛的章節...
先來看Skinning,照字義翻就是皮膚,用來改變組件外觀的...
以Flex Quick Starts的例子來看是用Button組件,裡面包含三個屬性(ownSkin, upSkin, and overSkin)來定義Skins,你可以在<mx:Button>裡面定義這三個屬性,也可以透過CSS利用<Style>區塊來定義Button的Skins...
這三個屬性(ownSkin, upSkin, and overSkin)也描述了Button組件對於滑鼠的三種行為,每個UI組件包含的Skins不盡相同,所以詳細還是得要查手冊...
再來看Scale-9,Scale-9是在Flash8裡面出現的,強調在作縮放的時候,會保持外型不變,它是將圖像切割成九個區塊來定義屬性,Scale-9要用Embedding的技巧來內嵌資料,Scale-9有四個參數(scaleGridTop, scaleGridBottom, scaleGridLeft, and scaleGridRight)來做調整...
之前有看到一個用Flex做Theme的網站(Scalenine),就是大量利用Scale-9的技巧來做,這才是專業呀,看來自己還需要的努力還很多...

奇怪的XML...

之前開發一個展示程式時遇到一個問題...
我利用Flex透過Web Service跟後端程式利用XML做資料交換....
另外在一個Flash程式上也會讀到相同一份XML資料...
問題來了,我Flex的程式是最早完成的,所以測試都沒問題,
但是Flash的程式就是沒有辦法讀到同一份XML...
當下以為我Flash程式寫錯了,所以進入漫長的Debug階段...
最後在手賤的情況下發現了bug在哪,原來是XML的編排有問題...
下面有兩段XML碼:
<?xml version="1.0" encoding="utf-8"?>
<catalog>
<item itemId="1">
<name>item1</name>
</item>
<item itemId="2">
<name>item2</name>
</item>
</catalog>
<?xml version="1.0" encoding="utf-8"?><catalog><item itemId="1"><name>item1</name></item><item itemId="2"><name>item2</name><item></catalog>
兩段XML有時麼不一樣呢?答案是沒有,只是有換行跟空白的差別而已...
但是很奇怪的是,第一種有空白有換行的Flex讀的到,Flash就不行了,所以後來全部改用第二種又臭又長的方式...
我本來以為是我用的文字編輯器自己幫我加了一些標籤進去所以造成無法讀取XML,但是很奇怪Flex又讀的到,很玄,問題解決了,但我還是不知道為什麼...

Repeater...

Repeater是一個Runtime Object用來建構重複的組件...
基本MXML語法如下:
<mx:Repeater Properties Events>
<UIComponent區塊>
<mx:Repeater/>
屬性裡面最常用到的就是dataProvider,透過Data Binding的技巧就可以取得資料來源,另外測試了幾個屬性:
count:限制Repeater產生的組件個數,
startingIndex:從第幾個資料來源開始產生組件,
currentItem:回傳目前被抓取的項目(回傳Object)
currentIndex:回傳目前被抓取的項目的索引(回傳Int)

Transitions & States

Transitions顧名思義就是轉換,而且是應用在States轉換之間...
來研究一下Transition這個Class,基本的MXML與法如下:
<mx:Transition id="myTransition" fromState="*" toState="*">
<effects區塊>
</mx:Transition>
<mx:Transition>標籤裡面有兩個屬性fromState,toState表示你希望產生效果的States切換來源跟目的,*表示所有情況都要用...
effects區塊就參照mx.effects這個Package的說明,在Flex Quick Starts裡面是利用Parallel這個effects...
在有些effects的Class裡面說到會有包含children的項目,像Parallel就可以使用的子Class有Move,Resize,Sequence...等,這部份請參考Help文件的說明...

States 續...

詳細來研究States...
States的應用其實很簡單,利用Design面板其實就可以做到大部分的處理了...
但是有些地方還是需要寫程式會比較方便...
比如說我有插入Hbox/Vbox組件做畫面配置,在Design面板就會看不到,那就需要寫程式處理了...
利用<mx:AddChild>的relativeTo屬性來決定你要放置新的UI組件位置與BaseState的舊組件的關係...
另外States的組成可以是樹狀的,完全是看妳basedOn哪個State...

States...

Flex的States很像是Flash的的Stage...
用來切換目前的程式狀態...
你可以用來定義哪些功能配合顯示哪些States...
你也可以像Flash一樣定義States轉場...
更不用說像Flash一樣的轉場特效照樣可以使用(請參考mx.effects Package)...
Flex Quick Starts裡面談States的部份很簡單,程式碼也只是用MXML就達到了效果...
不過我還是稍微改寫了一下,以符合實際應用的情況...
以下是程式碼片段:
private function doChangeStates(evt:Event):void{
currentState = currentState == 'Register' ? '':'Register';
}
透過這個Function就可以透過click event去判斷目前所在的States是哪個,然後做切換...
利用Function的寫法的好處就是可以擴充跟Copy&Paste(Reuse啦,想到哪去...)...

Apollo的第一本書...

這個月是Apollo最值得關注的一個月,在Adobe的計畫裡三月應該要有測試版可以玩....
所以每天都在注意開放下載沒,還沒看到消息倒是看到了Apollo有了第一本書...
Apollo for Adobe Flex Developers Pocket Guide
作者是Mike Chambers.
出版社是動物書商(個人覺得:D)歐萊禮.
網路上也找的到試讀的章節了,講File System API...
大概讀了一下,越來越有Apollo要來了的實際感覺了...
之前接過一個案子要利用Zinc + Flash/Flex開發一個展示程式...
Debug起來真是痛苦,寫程式要寫兩段配合是在Flash/Flex開發用還是經過Zinc編譯過後用...
雖然Zinc提供的API已經相當強大好用,但是寫起程式來工具的使用還是綁手綁腳的...
Apollo的出現就統一用Flex Builder 2開發了,這樣開發/Debug上就會流暢順利許多...
Apollo...快來吧~~

Flex Quick Starts 中文版...

原來...
Flex Quick Starts有正體中文版....
平常都只會找英文資料而已,我記得我之前找都還是會轉到英文網頁去呀...
不知道何時提供的,不過也讓入門的門檻低一點啦,畢竟英文我也很爛...哈...
看了一下中文版的,最新的還是只有英文網頁有,不過資料相當充足了...
連結如下:
1.Flex Quick Starts 正體中文網頁
2.Flex Quick Starts 英文網頁

User interface 序...

自己寫了多年的程式,但對於目前多變化UI的處理一籌莫展...
認識我的都知道,程式ok,美工別找我,我是那種幫忙寫Flash程式連基本的畫面處理都堅持要用ActionScript處理的人,寫程式比較快嘛 :D...
在進入RIA的時代後,從後端程式拉到前端來就不得不面對這個自己最弱的一環...
Flex的UI組件很強大,所以要學的還很多呢...
先介紹兩個網頁...
1.Adobe Flex 2 Component Explorer
2.Flex 2 Style Explorer
第一個網頁最好能看到直覺到看到Flex寫出來的程式馬上知道是哪些組件兜起來的,我就還不行,所以要猛看...
第二個網頁是新版的Flex 2 CSS Explorer,CSS在Flex中(應該說所有網頁程式中)很重要,現在的程式視覺處理部份第一眼就決定這個程式好不好的比重太高了,畫面處理不好大概也沒多少人想用,所以CSS就很重要了(當初我打死不碰的一塊= =,報應來了...)
知道組件後接下來就是怎麼用的問題了...
這可學問大了,個人覺得Flex 2很大的精華就在這裡...

Flex Quick Starts的Building a simple user interface介紹了基本的user interface相關的議題...
* Using controls
* Using containers
* Styling your components
* Adding effects
* Creating states
* Defining state transitions
* Using tooltips
* Controlling the cursor

把範例程式跟說明看一看應該基本的應用就可以上手了...

Handling events 續...

續Handling events 思考到的問題...
下面有兩個程式片斷
第一種:
private function doChange():void{
bt.label="Change!";
}

<mx:Button id="bt" label="Click!" click="doChange()"/>
第二種:
private function doChange(evt:Event):void{
bt.label="Change";
}

<mx:button id="bt" label="Click!" click="doChange(event)"/>
兩段程式碼可以做到一樣的事情,就是把button組件的lable換掉,
個人習慣是第一種,但是在event based programming的觀念裡面還是要傳遞event才方便後續處理.
如下程式碼:
function doChange( evt:Event ){
trace("evt: ", evt );
if( evt.target == "btn1" ){
//do something
}
}
所以ActionScript有這樣的彈性,應用上更靈活,個人使用上還是比較在乎啥時候的時機啥時用比較好,所以還是讓自己學乖一點寫寫正統的程式碼會比較好,基礎打穩點再說...
感謝Jeremy老師的在RIADEV的回答...

Handling events

今天主要從Adobe的Flex Developer Center裡的Flex Quick Start下手...
針對各個議題研讀並了解後改寫程式,熟習自己習慣的撰寫模式...

Handling events
event的處理有三種~
* Registering an event handler in MXML
* Creating an inline event handler in the MXML definition
* Registering an event listener through ActionScript

自己習慣是利用第一跟第三種,
第一種利用組件自己的觸發事件
程式碼片段如下:
private function doChange():void{
bt.label="Change";
}
然後在組件Button裡面註冊一個click="doChange()"就好了...

第三種動態註冊我要監聽的事件
程式碼片段如下:
在application中加入creationComplete event,以便程式建立時執行init(),
private function init():void{
addListeners();
}

private function addListeners():void{
//將button "bt"呼叫一個CLICK事件,利用onChange()處理
bt.addEventListener(MouseEvent.CLICK,onChange);
}

//接受event做處理
private function onChange(evt:Event):void{
bt.label="Change!";
}
在組件Button裡面就可以不需要呼叫click事件了..
至於何時利用的時機個人覺得如下...
1.如果只是做畫面(ui)上處理的,第一種跟第二種event就很好用了.
2.第三種在做event control時必用,在Design Pattern裡面Singleton是常用的設計模式,所以大量使用這種方式註冊、監聽、廣播事件是很正常的.

第一PO~

自己知道RIA也有幾個月了...
這段時間試著利用Flash,Flex,Flash Media Server寫了幾個程式...
深覺自己程度不足,所以決心從基礎打起...
利用此blog來記錄順便做筆記...