xebia adobe flash mobile applications

©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Adobe Flash Platform: update for XEBIAMichaël Chaize | EMEA Platform Evangelist


Michaël Chaize

2

@mchaize

RIAgora.com

Qui êtes-vous ?

© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Flash Platform - A complete system for web innovation

Rich Internet Applications ?

®

Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe confidential. 6

Rich User Experiences: Opportunities for internal users

®


Rich User Experiences: Opportunities for internal users

5 mins 20 secs

Increase productivity & improve decision making

®


NATO

®


NATO

From a system-centric view to a user-centric application.


First-class interfaces

FLASH PLAYER 10.1

Consumer Electronics

Personal Computers

Mobile Phones


Partenaires technologiques

Open Screen Project

Diffuseurs de contenu


Flash Player 10.1

Flash Player 10.1

Google TV


■ Brings full Flash Player feature set to devices

■ New Features:

■ Multi-touch & gestures

■ Accelerometer

■ Screen orientation

■ Mobile text input

■ Device capabilities discovery

■ Globalization support (GSLib)

■ Mobile settings manager

■ Global error handling

Flash Player 10.1

ADOBE AIR 2.0

ADOBE AIR 2.0

Flash Player 10.1+ WebKit+ SQLite+ Desktop APIs---------------------= Adobe AIR

ADOBE AIR 2.0

Xplatform runtimeDrag & Drop files / DesktopLocal system accessMultiple windowsTransparent applicationsNative Process, UDP, USB...

DETECT AND BROWSE

USB STORAGE

UDP Network Protocols

PEER 2 PEER

Documents and Processes

OS INTEGRATION

ADOBE FLEX 4

Basics

Flash Builder IDE

Flex SDK

Flex Class Library

MXML ActionScript

Compile

SOAP HTTP/S AMF/S RTMP/S

Web Server

Existing Applications & Infrastructure

J2EE Application Server

LC Data ServicesXML/HTTP

REST

SOAP Web Services

Browser

Flash Player

OLD COMPONENT MODEL

FLEX FRAMEWORK 3

GraphicsLayoutAnimationPartsStatesBehaviorLogicData

Component / Skin

SPARK COMPONENT MODEL

FLEX FRAMEWORK 4

ActionScript MXML

GraphicsLayout

AnimationParts

States

Component Skin

CSS properties

BehaviorLogicData


Mobile applications with the Flash Platform


Flash Player 10.1

Flash Player 10.1

Google TV


Adobe AIR 2.5 = native applications = multiple screens


§ Flash Player 10.1 + SQLite

§ New APIs:

§ Multi-touch & gestures

§ Geolocation

§ cut/copy/paste

§ tel:, mailto:, maps:, video:

§ Camera

§ Microphone

§ StageWebView

§ Device Debugger

§ cacheAsBitmapMatrix

AIR 2.5 on smartphones, tablets, TV...

ADOBE FLEX “HERO”

© 2010 Adobe Systems Incorporated. All Rights Reserved.

Mobile Applications in "Hero"

32

s:TabbedMobileApplication s:MobileApplications:Application

© 2010 Adobe Systems Incorporated. All Rights Reserved. 1

MobileApplication and TabbedMobileApplication

§ View stack metaphor

§ View

§ ViewNavigator / TabbedViewNavigator

§ Built-in mobile navigation experience

§ Action bar

§ Back button

§ Transitions

§ APIs

33


ViewNavigator API

§ navigator.pushView();

§ navigator.popView();

§ navigator.popToFirstView()

§ navigator.activeView;

34 2


ActionBar

<s:View xmlns:fx=http://ns.adobe.com/mxml/2009 … title=”Expenses"> <s:navigationContent> <s:Button icon="@Embed('assets/home.png')"/> </s:navigationContent> <s:actionContent> <s:Button label=”+"/> </s:actionContent> </s:View>

35 3

navigationContent titleContent actionContent


Components that have Mobile Skins

§ Button

§ CheckBox

§ DataGroup

§ Group/HGroup/VGroup/TileGroup

§ Image/BitmapImage

§ Label List

§ RadioButton/RadioButtonGroup

§ Scroller

§ TextArea

§ TextInput

36


View Lifecycle

§ Alternative option: destructionPolicy=“none”

37

View becomes active

ViewCreated

Another view becomes active

View DestroyedUser navigates back to view

View Recreated

data

3B


Mobile ItemRenderers

§ MobileItemRenderer

§ MobileIconItemRenderer

<s:MobileIconItemRenderer

labelField="lastName"

messageField="title"

iconField="picture"

decoratorClass=”phoneIcon">

38 4


FLEX ON MOBILE DEVICES

ADOBE FLEX “HERO” WITH

FLASH BUILDER “BURRITO”

2008 Adobe Systems Incorporated. All Rights Reserved.

Flex/JSP architecture

UI LAYER

SERVERPRESENTATION/SERVICES/DAOLAYER

DATABASE/STORAGE LAYER

listEvents.jsp

Java servlet container (tomcat, WAS…)

JDBC

Web browser

JAVA classes/services

Webapp (WAR)

EventService.java public getEvents()

WSDL

XML on HTTP(s)

AMFPublished in December 2007

XML5000 rows ?1.1Mo 29Ko

ADOBE FLEX 4

Remoting AMF


LiveCycle Data Services ES

LiveCycle Data Services is a set of Java EE components and APIs used to:

Create data-intensive RIAs with less code, less risk, and accelerated time to market due to an innovative client-server programming model

Integrate RIAs with existing applications, back-end data, and JEE infrastructure

Easily integrate RIAs with LiveCycle document and process services

Enable collaboration, offline AIR and real-time data streaming applications to be built in a scalable and reliable manner with robust publish and subscribe messaging

Generate PDF documents from RIAs that include graphical assets


Data Management

RPC Services

Messaging

ServiceAdapters

Data Synchronization

Off-line Applications

Data Paging

Web Service

HTTP Service

Remote Object Service

Publish & Subscribe

Collaboration

Real Time Data Push

Proxy Service

Web-tier Compiler

Portal Deployment

RIA-PDF Generation

LiveCycle

ColdFusion

Hibernate

SQL

JMS

Java

Custom…


Blaze DS

BlazeDS is a set of Java EE components and APIs, and a subset of LiveCycle Data Services:

- Free and open source.

- High performance data transfer for more responsive applications using AMF

- Real-time server push over standard HTTP

- Full pub/sub messaging that extends existing messaging infrastructure


Data Management

RPC Services

Messaging

ServiceAdapters

Data Synchronization

Off-line Applications

Data Paging

Web Service

HTTP Service

Remote Object Service

Publish & Subscribe

Collaboration

Real Time Data Push

Proxy Service

Web-tier Compiler

Portal Deployment

RIA-PDF Generation

LiveCycle

ColdFusion

Hibernate

SQL

JMS

Java

Custom…


LCDS.war

§ Structure of the WAR file:

§ +WEB-INF/classes To place your Java classes

§ +WEB-INF/lib Hosts the JAVA libraries of LCDS

§ +WEB-INF/�ex Hosts the XML con�guration �les§ Remoting-con�g.xml Destinations to Java classes for remoting

§ Messaging-con�g.xml Destinations for messaging

§ Data-Management-con�g.xml Destinations to Java assemblers

§ Proxy-con�g.xml Destinations to HTTP services

§ Services-con�g.xml Channels con�gurations

A file named « LCDS.war » is provided to start your Flex/Java projects.


Java and ActionScript value objects

Java VO ActionScript VO


Java and ActionScript types

STRING STRING

BOOLEAN BOOLEAN

INT, SHORT, BYTE INT

DOUBLE, FLOAT, LONG NUMBER

CALENDAR, DATE DATE

OBJECT OBJECT

COLLECTION ARRAYCOLLECTION

OBJECT[] ARRAY

ORG.W3C.DOCUMENT XML OBJECT

NULL NULL

2008 Adobe Systems Incorporated. All Rights Reserved.

Flex/Java classic architecture

UI LAYER

SERVERPRESENTATION/SERVICES/DAOLAYER

DATABASE/STORAGE LAYER

LiveCycle Data Services

Java servlet container (tomcat, WAS…)

JDBC

Web browser

JAVA classes/services

Webapp (WAR)

RPC services Messaging Data Mgt

WSDL

AMF over HTTPs

JAVA <-> AMF

EventService.java public getEvents()

ADOBE FLEX 4

Spring BlazeDS Integration

ADOBE FLEX 4

Messaging


Channels

Flex client

Servlet-based endpoints

AMF Endpoint

HTTPEndpoint

StreamingAMFEndpoint

NIO-based endpoints

NIOAMFEndpoint

NIOHTTPEndpoint

RTMPEndpoint

MessageBrokerServlet

Socket Server (LCDS only)

MessageBroker

Remoting

HTTPProxy

Message

Data Management


Publish/Subscribe Messaging

Message

Service

LiveCycle DS / Blaze DS

Endpoint

PublisherSubscriber

§RTMP

§AMF

§HTTP

§Client A

§Client B

§Client C


Data Push - Messaging

Message

Services

LiveCycle DS / Blaze DS

Adapter Y

Adapter X

Messaging

System Y

Messaging

System X

EndpointJMS

ProviderJMS Adapter

PublisherSubscriber

§RTMP

§AMF

§HTTP

ADOBE FLEX 4

Data ManagementServices


Data Management Services


DataService

DAOObjectAdapter

HibernateAdapter

JDBCAdapter

Hibernate

RDBMS

CFCAdapter ColdFusion

Endpoint

Client A

Client B

Client C


Data Management Benefits

1. Automatic Client to Middle-Tier Synchronization

§ Change Tracking

§ Automatic invocation of remote services

2. Highlander Principle: there is only one instance of a given entity in memory at any given time

3. Conflict resolution

4. Offline Synchronization (thanks to Adobe AIR)

5. Lazy loading

6. Paging

7. Cross-client synchronization


Today’s LiveCycle Data Services

58

Flex Client Flex Client Flex Client

LCDS

Java Classes

Thing1.classThing2.classThing3.class


Tomorrow’s LiveCycle Data Services

59

LCDS

NET

??.?????.?????.???

Java Classes

Thing1.classThing2.classThing3.class

.NET C# Classes

Thing1.dllThing2.dllThing3.dll

IIS Plugin.NET RemotingMessagingMSMQ Messaging

.NET AdapterRemotingMessagingData Mgmt

.NET

Ada

pter

Flex Client Flex Client Flex ClientJava Client Android ClientHTML5/JS Client ObjC Client

LCDS NEXT


Devices & Clients <HTML>JavaScript / AJAXiOS

preview in January 2011

LiveCycle Collaboration Service

IN-CONTEXT COLLABORATION

2010 Adobe Systems Incorporated. All Rights Reserved. 62

LCCS SDK Offers Both High-Level Components and Foundation Classes

High-level Components

Foundation Classes

Pods

RTC UI Components

Shared Managers Shared Model

Session(Connection, Authentication, Reconnect/Failover, RMI Routing)

Audio Pub / SubWebcam Pub / Sub File Pub / Sub Shared Cursors

Users AV Streams

Files RoomPub / Sub Messaging + Permissions

Shared Collection Baton

Shared Property UserQueue

Roster WhiteBoard Chat FileShare Note WebCam


Server Integration

§ Create and Delete Rooms

§ Manage your Users’ Authentication

§ Publish and Subscribe to Messages

§ Variety of different Languages

Java PHP ColdFusion

Ruby C#Python Groovy


LIVE COLLABORATION

LCCS


Flash Platform - A complete system for web innovation

xebia adobe flash mobile applications

Technology

adobe confidential

adobe flash platform

adobe airadobe air

adobe flex hero withflex

mobile applications

flash player feature

flex framework

systemcentric view