ADOBE FLEX 4

© Logica 2010. All rights reserved No. 2

• Introduction

• Flex en action

• Autour de Flex

• Logica

Le programme

Introduction

No. 4© Logica 2010. All rights reserved

Flex

Qu’est ce que Flex ?

Introduction

RDA

RIA InteractiveWebApp

WEB 1.0

WebAPP


• Rich Internet Application

• Avantages :• Pas d’installation• « Portable »• Fortement connecté• Récupération des données utilisateur

• Inconvénients• Pas d’installation• Fortement connecté• Récupération des données utilisateur

RIA ?


• Atouts majeurs

• Alléger le serveur pour les traitements de l’affichage

• Facilite la logique métier

• Entraîne vers une diffusion « multi-canal »

RIA ?

No. 7© Logica <YEAR>. All rights reserved

Microsoft Silverlight

• Avril 2007• Version 4• Visual Studio

JavaFX

• depuis Décembre 2008• Version 1.3

Flex, et les autres ?


Entendue des installations

Flex en action …


• Architecture

• Langages et Interface

• Données

Flex en action


Flex

• Machine virtuelle

• Monothread

• Modulaire

Architecture

OSNavigateur

Flash PlayerFlex


Langages

MXML

Action Script 3


• Basé sur le XML• Description de l’interface• Structure• Dessin (Sprite)

Langages - MXML


Interface – Décomposition d’un élément

Button

text = ‘Button’ text

Skin

text


• Permet de modifier le comportement en fonction de l’état

• Manière « élégant » et « flexible » de modifier l’interface

Interface - States


Interface - States


Exemples


• CSS • Modification rapide du style• Permet d’externaliser l’aspect de l’interface

• Skin• Modification profonde d’un élément• Permet de modifier le comportement graphique

Interface - Styles CSS et Skin


• Avantages• Interactivité de l’interface• Améliore l’expérience utilisateur

• Inconvénients• Alourdissement inutile• Piège de l’excès

• Utilisation• Automatique : xxxEffect = « Fade »• Manuelle : Définition de l’effet + Demande de lecture

Interface - Animations


• Langage Objet

• « Fortement » typé

• Système de getter / setter

• Système d’attributs

Langages – Action Script 3


• Déclaration d’une classe

• Déclaration d’une variable

• Déclaration d’une fonction

• Getter et Setter



• Ce qu’on a :• Langage Objet réflexif• Objet dynamiques• Définition d’une classe• Définition d’interface• Héritage simple (comme en Java)

• Ce qu’il manque :• Définition de classes abstraites• Pas de singleton (Construction privé)



• Possibilité de lier l’interface à la donnée• Simplicité à la lecture• Simplicité à la programmation

Données - Bindings

Model

View

Controller

ModelServeur


• Gestion « native »• Facilité de manipulation• Aide à la communication client / serveur

Données - XML


2 méthodes principales :

• HTTPService• Méthode classique• Permet d’établir un connexion HTTP entre le serveur et le client

• AMF (Action Message Format) ou RemoteObject• Méthode « avancée »• Obligation d’avoir un serveur adapté• Permet l’échange d’objets plus facilement

Données - Communication

Autour de flex


• Frameworks

• Utilisation d’un serveur

• Liens pratiques

Autour de Flex


• Cairngorm• Plus ancien des frameworks• Permet de bien diviser son application

• Pure MVC• Même fonction que Cairngorm• Aide au packaging de son application

• Spring Action Script• Spring java adapté à Flex• IOC• Utilitaire de communication

Frameworks


• Serveur HTTP simple

• Utilisation d’AMF• Blaze Data Service• Live Cycle Data Service• Granite Data Service• WebOrb

Comparaison entre les différentes solutions

Utilisation d’un serveur

http://artemgolubev.com/blazeds-vs-graniteds-vs-weborb-vs-livecycleds-for-business-applications-on-flex-and-java/


• API : Flex 4

• Documentation : Flex Developer Center

• Tutoriaux : Adobe® Flex™ Tutorial

• Exemple d’interface : Tour de flex

• Tout le reste : ???

Liens pratiques

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/index.html?filter_flex=4.1&filter_flashplayer=10&filter_air=1.5

http://www.adobe.com/devnet/flex/documentation.html



http://www.flex-tutorial.fr/





http://www.adobe.com/devnet/flex/tourdeflex.html

http://www.adobe.com/devnet/flex/tourdeflex.html

http://lmgtfy.com/?q=Flex+4

Question ?

LOGICA


• Partie flex : Alexandre [email protected]

• Partie Logica : Nora [email protected]

Contacts

mailto:[email protected]

mailto:[email protected]

ADOBE FLEX 4

Documents

Transcript of ADOBE FLEX 4