Breizh camp adobe flex et les mobiles

© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.

Michaël Chaize | Flash Platform Evangelist | www.RIAgora.com | @mchaizeFlex 4.5 et les applications multi-screen

Thursday, June 23, 2011

http://www.RIAgora.com

http://www.RIAgora.com

© 2010 Adobe Systems Incorporated. All Rights Reserved.

Innovation et interfaces riches

2


®

Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con!dential. 3

N’exposer pas ce qu’a"end le système


®

Copyright 2009 Adobe Systems Incorporated. All rights reserved. Adobe con!dential. 4

Exposer ce qu’a"end l’utilisateur

5 mins 20 secs

Augmenter la productivité et améliorer la prise de décision


© 2010 Adobe Systems Incorporated. All Rights Reserved. 5

Customer care @ Adobe


© 2010 Adobe Systems Incorporated. All Rights Reserved. 6

Adobe Hendrix

15%solve a case

+10%customer

satisfaction

1day training



Adobe Flex

7


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.

Flex SDK

Flex Class Library

MXML ActionScript

Debuggers

How Flex Works in the Browser

Compile

SOAP HTTP/S AMF/S RTMP/S

Web Server

Existing Applications & Infrastructure

J2EE Application Server

Adobe Data ServicesXML/HTTPREST

SOAP Web Services

Browser

Flash Player

Flash Builder IDE


©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.

Flex & Java

&

Richness / Fast / Open-source / Industrialization



Le multiscreen introduit de nouveaux dé!s techniques pour les développeurs d’applications


© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential. 11

Technology Partners

Open Screen Project: Adobe et plus de 70 partenaires

Content Partners


© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con!dential.

Native Mobile Application Development Model

NativeApp

NativeApp

NativeApp

NativeApp

Additional OS’s

A costly, inefficient development model



Introducing a new mobile development paradigm

Additional OS’s

AIR

Flex Application

One Tool, One Language, One Codebase

Any Platform

Common codebase



Platforms, browsers, and devices

In-browser

Outside the browser

Set-top boxes (Future)

Mobile Platforms



Adobe Flex 4.5

15

4.5


SPARK COMPONENT MODEL

FLEX FRAMEWORK 4

ActionScript MXML

GraphicsLayout

AnimationParts

States

Component Skin

CSS properties

BehaviorLogicData

http://www.lafabrick.com/labz/skins/jellySkin/





Mobile Applications in Flex 4.5

17

s:TabbedViewNavigatorApplications:ViewNavigatorApplications:Application



<s:ViewNavigatorApplication> life cycle

18

views.ListEmployees views.DetailsEmployee views.ListEmployees

DATA DATA

persisted in memory

subset

view destroyed view created

view destroyed view created

“BACK” bu!on



Un problème technique: la densité des écrans

19

150 x 40 pixel bu"on

Desktop monitor@100 dpi

= 1.5” x 0.4”

Galaxy Tab@160 dpi

= 0.9” x 0.25”

Droid 2@240 dpi

= 0.6” x 0.17”

iPhone 4@320 dpi

= 0.46” x 0.13”

Un même nombre de pixels pour différentes tailles physiques



Flex 4.5 et la mise à l’échelle automatique

20

<Application applicationDPI=“160”> <Button width=“160” height=“40”/></Application>

160 dpi 240 dpi 320dpi

Scaled 1.5x Scaled 2x



Flex 4.5 and smartphones/tablets

21

BlackBerry PlayBookAndroid tablets Apple tablets



Demo

22



SPRING BLAZE DS INTEGRATION PROJECT

FLEX AND JAVA


JAVA rockstar

JAVA + FLEX 4 rockstar

JAVA + FLEX 4.5HYPER ROCK STAR



Les Flexeurs à Rennes

26

Réunion Lundi à la Cantine Rennaise

18h30 - 20h30

Les frameworks MVC



Michaël Chaize & resources

27

@mchaize

RIAgora.com Flex.orgdeveloper.adobe.com

Tour de Mobile Flex




Breizh camp adobe flex et les mobiles

Technology

adobe systems incorporated

adobe flex

adobe et

adobe hendrix

mobile flex

flex framework

flex works

mobile applications