An introduction to flash mobile technology on android ios and blackberry
This presentation is the property of its rightful owner.
Sponsored Links
1 / 28

Cross-Platform App Development with Flex Mobile PowerPoint PPT Presentation


  • 109 Views
  • Uploaded on
  • Presentation posted in: General

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

Download Presentation

Cross-Platform App Development with Flex Mobile

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


Flash tooling

Flash Tooling


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 


Device screen characteristics

Device Screen Characteristics


Screen resolution vs density

Screen Resolution vs. Density


Density in flex applications

Density in Flex Applications

1

2

3

4

5


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)”/>


Android scrapbook example

Android Scrapbook Example


Sketch example

Sketch Example


Flex mobile views controls

Flex Mobile Views/Controls

  • ViewNavigatorApplication

  • Views

  • ViewNavigator

  • Splash Screen

  • Components:

    • ActionBar

    • Text Components

    • List, Scroller, and Touch Gestures


Flex mobile controls demo

Flex Mobile Controls Demo


Video example

Video Example


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!


  • Login