Air on Mobile (2011)

AIR
on
MOBILE
Maso Lin
2011/4/18

人活得好好的
幹嘛寫手機APP？

那手機很多
關我什麼事
俺是閃客啊

ActionScriptHero.org

SmartPhone+Tablet > PC+NB
預計今年超越
2013達到2倍

日本MIXI
手機連線85%
電腦連線15%

AT&T
過去3年行動上網量
成長50倍

全球行手上網量
預估未來5年
將再成長26倍

• Flash CS5 (AIR2.0)

• Flash CS5.5 (AIR 2.6)

• Flash Builder4.5 (Spark mobile component)

• Android SDK

• 保護費 $25(終身)

• Android Phone/Pad若干

• ARMv7

• Android 2.2以上

• Mac電腦乙部(會比較方便)

• 保護費 $99(年)

• iPhone, iPad 少許

• iPod Touch 3代以上

• iPhone3Gs以上

• iPad

• iOS 4.0以上

• CertifiedDevices
http://www.adobe.com/flashplatform/
certified_devices/

Photo via Mike Chambers

可以玩哪些

Accelerometer

import flash.events.AccelerometerEvent;
import flash.sensors.Accelerometer;

var accelerometer:Accelerometer;
accelerometer = new Accelerometer();
accelerometer.addEventListener
(AccelerometerEvent.UPDATE, accUpdateHandler);

function accUpdateHandler(event:AccelerometerEvent):void
{
xSpeed -= event.accelerationX * 2;
ySpeed += event.accelerationY * 2;
}

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ﬂash/sensors/Accelerometer.html

Geolocation

import flash.events.GeolocationEvent;
import flash.sensors.Geolocation;

var geo:Geolocation;
geo = new Geolocation();
geo.addEventListener(GeolocationEvent.UPDATE,
geoUpdateHandler);

function geoUpdateHandler(event:GeolocationEvent):void
{
trace(event.latitude);
trace(event.longitude);

}

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ﬂash/sensors/
Geolocation.html

Multitouch : Touch Point

Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
addEventListener(TouchEvent.TOUCH_END, onTouchEnd);
addEventListener(TouchEvent.TOUCH_MOVE, onTouchMove);
function onTouchBegin(eBegin:TouchEvent) {
trace(eBegin.touchPointID);
trace(eMove.stageX);
trace(eMove.stageY);
}
function onTouchMove(eMove:TouchEvent) {
trace(eMove.stageX);
trace(eMove.stageY);
}
function onTouchEnd(eEnd:TouchEvent) {
trace(eEnd.touchPointID);
}

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ﬂash/events/TouchEvent.html

Multitouch : Gesture

Multitouch.inputMode = MultitouchInputMode.GESTURE;

addEventListener(TransformGestureEvent.GESTURE_ROTATE,onRotate)
addEventListener(TransformGestureEvent.GESTURE_ZOOM,onZoom)
addEventListener(TransformGestureEvent.GESTURE_PAN,onPan)
addEventListener(TransformGestureEvent.GESTURE_SWIPE,onSwipe)

function onRotate(e:TransformGestureEvent):void{
trace(e.rotation);
}
function onZoom(e:TransformGestureEvent):void{
trace([e.scaleX,e.scaleY])
}
function onPan(e:TransformGestureEvent):void{
trace([e.offsetX,e.offsetY])
}
function onSwipe(e:TransformGestureEvent):void{
}

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ﬂash/events/GestureEvent.html

StageWebView

import flash.media.StageWebView;

var webView:StageWebView = new StageWebView();

webView.stage = this.stage;
webView.viewPort = new Rectangle( 0, 0,
stage.stageWidth, stage.stageHeight );
webView.loadURL( "http://www.example.com" );
webView.loadString( "<html></html>" );

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ﬂash/media/
StageWebView.html#includeExamplesSummary

Microphone,Camera

http://help.adobe.com/zh_TW/AS3LCR/Flash_10.0/ﬂash/media/Microphone.html

CameraUI, CameraRoll
var deviceCameraApp:CameraUI = new CameraUI();
var imageLoader:Loader;

deviceCameraApp.addEventListener( MediaEvent.SELECT,
imageCaptured );
deviceCameraApp.addEventListener( Event.CANCEL,
captureCanceled );
deviceCameraApp.addEventListener( ErrorEvent.ERROR,
cameraError );

deviceCameraApp.launch( MediaType.IMAGE );

function imageCaptured( event:MediaEvent ):void
{
var imagePromise:MediaPromise = event.data;
imageLoader = new Loader();
imageLoader.loadFilePromise( imagePromise );
}
//CameraRoll.addBitmapData()

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/ﬂash/media/CameraUI.html

多工/Idle : flash.desktop.NativeApplication

硬體鍵 : Keyboard.BACK/Keyboard.MENU

畫面轉向：stage.addEventListener(Event.RESIZE,onResize)

先看個Demo

-Comb Over Charlie
http://www.youtube.com/watch?v=5rp7UNCWbyc

-iPhone Test
http://vimeo.com/21382542

原本做Web Flash用的效能技巧大都適用

除此之外…

多用點陣少用向量

點陣圖也盡量不要太大張

盡量不用:Filter, Blend modes, 透明等

mySprite.cacheAsBitmap=true;

mySprite.cacheAsBitmapMatrix=new Matrix();

Motion Graphic 可

Animation仍太弱

熟知各device的尺寸、長寬、解析度

以手指操作，而非游標

務必多放在device上實測

原有的熟悉語言

Web - Mobile連動

成熟的IDE工具

侷限在中高階手機

API 支援度

效能

參考資料
Top Mobile Internet Trends
http://www.scribd.com/doc/48589047/Top-Mobile-Internet-Trends-2011-from-KPCB

Developing AIR for Android with Flash Professional CS5
http://www.slideshare.net/chrisgriffith/developing-air-for-android-with-flash-professional-cs5-7562915

Mobile First by Luke Wroblewski
http://www.lukew.com/presos/preso.asp?26Rethinking

the Mobile Web by Yiibu by Bryan Rieger
http://www.slideshare.net/bryanrieger/rethinking-the-mobile-web-by-yiibuInternet

Trends 2010 by Morgan Stanley Research
http://www.slideshare.net/CMSummit/ms-internet-trends060710

ﬁnalABI Research
http://www.abiresearch.com/press/1684-Worldwide+Mobile+Subscriptions+Forecast+to+Exceed+Five
+Billion+by+4Q-2010Apple

iPhone and iPod touch Capture U.S.Video Game Market Share by Flurry.com
http://blog.ﬂurry.com/bid/31566/Apple-iPhone-and-iPod-touch-Capture-U-S-Video-Game-Market-Share

Q&A
http://maslin.blogspot.com

Air on Mobile (2011)

Recommended

Recommended

More Related Content

Similar to Air on Mobile (2011)

Similar to Air on Mobile (2011) (20)

Recently uploaded

Recently uploaded (20)

Air on Mobile (2011)