An introduction to flash mobile technology on android ios and blackberry
Download
1 / 28

Cross-Platform App Development with Flex Mobile - PowerPoint PPT Presentation


  • 170 Views
  • Uploaded on

An Introduction to Flash Mobile Technology on Android, iOS , and Blackberry. Cross-Platform App Development with Flex Mobile. Oswald Campesato HTML5 Canvas/CSS3 Graphics Primer Twitter: @ ocampesato. Stephen Chin Chief Agile Methodologist at GXS Twitter: @ steveonjava

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Cross-Platform App Development with Flex Mobile' - evonne


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
An introduction to flash mobile technology on android ios and blackberry

An Introduction to Flash Mobile Technology on Android, iOS, and Blackberry

Cross-Platform App Development with Flex Mobile

Oswald Campesato

HTML5 Canvas/CSS3 Graphics Primer

Twitter: @ocampesato

Stephen Chin

Chief Agile Methodologist at GXS

Twitter: @steveonjava

http://flash.steveonjava.com/


Flash and air on android ios and blackberry
Flash and AIR on Android, iOS, and Blackberry

  • Available on Androidand Blackberry Phones and Tablets

  • Does not run on iPhone or iPad

  • Works in the Browser

  • Limited Access to Device APIs

Adobe Flash

  • Available on Android, Blackberry, and iOS

  • Works on Smart Phones and Tablets

  • Deploys as a Native Application

  • Gives Full Access to Device APIs

Adobe AIR



Hello flash on 3 platforms
Hello Flash on 3 Platforms…


Blackberry playbook specs
BlackBerry Playbook Specs

  • “Enterprise Ready" Device

  • 7" Screen (9.7mm Thick)

  • HTML5 and FULL Flash 10.1

  • Hardware Accelerated Video

  • Supports HDMI (TV output)

  • Displays PPT and Documents

  • Front and Rear Cameras

  • 1 GHZ core and 1GB RAM

  • Q1/Q2 of 2011


Blackberry deployment
BlackBerry Deployment

  • Register for Blackberry App World Account

    • Free, but requires ID verification (driver's license)

  • Request code signing certificates

    • Takes 1-2 business days for a response

  • Install Blackberry SDK

    • Integrates with Flash Builder 4.5

  • Install Plug-in Update

    • Manual process right now

  • Setup device in Flash Builder

    • Turn on device debugging

    • Enable via USB or Wifi

  • Setup Flash Builder with 2 certificate files

Difficult Rating:

Moderate 


Android tablet flash devices
Android Tablet Flash Devices

  • Samsung Galaxy Tab

    • "enterprise ready" device

    • 7" screen

  • Motorola Xoom

    • First HoneyComb (3.1 device)

  • Samsung Galaxy Tab 10.1

    • Dual-core Tegra processor

    • 10.1", 1280x800 screen

  • Sony Tablet P (not yet available)

    • Dual 5.5" screens


Deploying to android
Deploying to Android

  • Turn on Device Debugging

  • Plug in via USB

    • And install necessary drivers

  • Deploy!

Difficult Rating:

Easy! 


Ios devices
iOS Devices

  • iPhone 3/3GS

    • 320x480 Display

  • iPhone 4/4S

    • 640x960 Retina Display

    • A4/A5 Processor

  • iPad 1/2

    • 1024/768 Display

    • A5 Processor


Deploying to ios
Deploying to iOS

  • Sign up for Apple's developer program

    • This costs $$$

  • Buy a Mac computer (or borrow a friend's)

  • Go through Apple's deployment process to create a certificate

    • Involves cert generation and other annoyances

  • Install in Keychain and export as a P12

  • Create an application profile and export it

  • Install cert and app profile in Flash Builder

  • Build app packaging in Flash Builder

    • Debug mode is quick (but slower performance)

  • Manually install via iTunes (install and sync to device)

    • Remember to uninstall previous app versions

  • Repeat process for each app you develop

Difficult Rating:

Painful 





Density explorer application
Density Explorer Application

<fx:Script>

<![CDATA[

[Bindable]

protectedvarapplicationDPI:Number;

[Bindable]

publicvardeviceDPI:Number;

]]>

</fx:Script>

<s:VGrouppaddingTop="20" paddingLeft="15" paddingRight="15" paddingBottom="15"

gap="20" width="100%" height="100%">

<s:Label text="Application DPI:"/>

<s:HGroup gap="30">

<s:RadioButton id="ad160" content="160"

click="applicationDPI = 160"/>

<s:RadioButton id="ad240" content="240" click="applicationDPI = 240"/>

<s:RadioButton id="ad320" content="320" click="applicationDPI = 320"/>

</s:HGroup>

<s:Label text="Device DPI: {deviceDPI}"/>

<s:HSlider id="dpiSlider" minimum="130" maximum="320" value="@{deviceDPI}" width="100%"/>

</s:VGroup>


Automatic resizing
Automatic Resizing

160ppi

240ppi

320ppi


Detecting orientation
Detecting Orientation

  • Can be done via:

    • Event Callback

      • stage.addEventListener(StageOrientationEvent.ORIENTATION_CHANGE, <function callback>);

    • States

  • StageOrientation Values

    • DEFAULT

    • ROTATED_LEFT

    • ROTATED_RIGHT

    • UPSIDE_DOWN

    • UNKNOWN


Flash air mobile apis
Flash/AIR Mobile APIs

  • Screen Orientation *

  • Multitouch *

  • Gestures *

  • Accelerometer

  • Camera

  • CameraRoll

  • GPS

  • Microphone

  • Audio

  • Video*

  • REST

  • JSON/XML

  • ViewNavigator*

  • CSS

  • Etc.

* APIs we will show examples of today


Mulititouch
Mulititouch

Gestures

Rotate

Swipe

Two Finger Tap

Pan

Zoom

Illustrations provided by Gestureworks (www.gestureworks.com)


Gestures via addeventlistener
Gestures via addEventListener

public class MultitouchImage extends Image {

public function MultitouchImage() {

addEventListener(TransformGestureEvent.GESTURE_ROTATE,

rotateListener);

addEventListener(TransformGestureEvent.GESTURE_ZOOM,

zoomListener);

Multitouch.inputMode = MultitouchInputMode.GESTURE;

}

protected function rotateListener(e:TransformGestureEvent):void {

rotation += e.rotation;

}

protected function zoomListener(e:TransformGestureEvent):void {

scaleX *= e.scaleX;

scaleY *= e.scaleY;

}}}


Gestures via events
Gestures via Events

protected function swipe

(e:TransformGestureEvent):void {

page = (page + e.offsetX +

pages.numElements) %

pages.numElements;

updateVisibility();

}

<s:VGroupgestureSwipe="swipe(event)”/>




Flex mobile views controls
Flex Mobile Views/Controls

  • ViewNavigatorApplication

  • Views

  • ViewNavigator

  • Splash Screen

  • Components:

    • ActionBar

    • Text Components

    • List, Scroller, and Touch Gestures




Development links
Development Links

  • Android SDK

    • http://developer.android.com/sdk/index.html

  • AIR 2.5

    • http://labs.adobe.com/technologies/air2/android/

  • Flex Builder 4.5 (Burrito)

    • http://labs.adobe.com/technologies/flashbuilder_burrito/

  • Flex Catalyst 5.5 (Panini)

    • http://labs.adobe.com/technologies/flashcatalyst_panini/

  • Flex 4.5 SDK (Hero)

    • http://labs.adobe.com/technologies/flexsdk_hero/

  • iPhone Packager

    • http://labs.adobe.com/technologies/packagerforiphone/


Blogs to read
Blogs to Read

  • Stephen Chin

    • http://flash.steveonjava.com/

  • Duane Nickull

    • http://technoracle.blogspot.com/

  • Christian Cantrell

    • http://blogs.adobe.com/cantrell/

  • Christophe Coenraets

    • http://coenraets.org/blog/

  • Serge Jespers

    • http://www.webkitchen.be/

  • Lee Brimelow (The Flash Blog)

    • http://blog.theflashblog.com/

  • Mark Doherty (FlashMobileBlog)

    • http://www.flashmobileblog.com/


Pro android flash
Pro Android Flash

Stephen Chin, Oswald Campesato, Dean Iverson, and Paul Trani

http://steveonjava.com/

  • Includes:

  • UI Controls

  • Media Support

  • Mobile Flex APIs

  • Android Market Deployment

  • Extensive Examples

Available Now!


ad