2010/5/9

Flash CS5 Accelerometer 範例

Mark Doherty 貼了一段CS5 accelerometer api功能的demo影片

Device Central CS5 - Accelerometer from Mark Doherty on Vimeo.

In this video we look at the Accelerometer API in Flash Player 10.1 and AIR and the integration with Device Central CS5


以下分享一下這個範例的原始碼及心得:


accelerometer就是我們常俗稱的g-sensor,用來測量重力的sensor。
一般來說這種accelerometer都會給三個軸向的數值,分別為x,y,z,且都會是正~負的一個範圍,例如1~-1, 100~-100這種的。
而Flash提供的是1~-1的範圍。以面對手機瑩幕來看,水平線為X,垂直線為Y,穿透瑩幕的縱向為z

在Flash中使用acceleration api其實沒什麼困難,設好update event後,就會持續收到訊號,訊號內容有三個值
accelerationX
accelerationY
accelerationZ
各別都是1 ~ -1的一個值,拿這些值來做應用即可

以下範例是做了一個小鋼珠在桌面滑來滑去的動態,除了用AccelerometerEvent外,另外多加了些摩擦力、慣性的模擬。

在電腦要測的話,可開啟Device Central CS5的3D模擬面板試玩。

最後有一點要注意,Accelerometer的靈敏度,甚至軸向,有時在不同的device上會有所不同,所以一些參數會需要因不同的機子調整,例如這個範例我在iPhone及Nexus One上測試,其X軸的正負值就完全相反,sensor回傳event的靈敏度也不太相同。

以下為範例code:


Flash CS5 multi-touch 範例

Mark Doherty貼了一段Flash CS5 multi-touch的範例影片

Device Central CS5 - Flash Professional Integration from Mark Doherty on Vimeo.

In this video we look at the debugging capabilities using Device Central for mobile projects. The application, PhotoTouch by Maso Lin, demonstrates the multi-touch support added to the tool for testing your applications.


以下我分享一下這個範例的原始碼及心得…



Flash目前提供的multi-touch api大致可分成兩種:
.TouchEvent--直接取得各個點的事件
.TransformGestureEvent--只取多點所形成的gesture結果

先說說TransformGestureEvent,它可得到rotate, zoom, pan, swip等事件,如果你的需求是這些的話,用這個就可以了。
TransformGestureEvent另一個好處是,使用macbook/pro開發時,直接在觸控板上做這些gesture,這個api是可以收到訊號的,這樣就可以在電腦上實測了。

而TouchEvent的使用時機,我個人覺得是在TransformGestureEvent無法滿足時再用就可以了。
例如做一個動作遊戲,需要在畫面上做出虛擬手把時 (左邊十字方向鍵,右邊是攻擊、跳…等),就必需要用TouchEvent

最後有一點要注意是,Flash 目前只支援到2點觸控,再多的話就收不到了。 待測...

以下是範例code,大致上是把所有的event列出來而已,並應用在一張照片上,讓它可以zoom in/out、旋轉 ,雙指pan做移動…等