adobe flex 4. © logica 2010. all rights reservedno. 2 introduction flex en action autour de flex...
TRANSCRIPT
![Page 1: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/1.jpg)
ADOBE FLEX 4
![Page 2: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/2.jpg)
© Logica 2010. All rights reserved No. 2
• Introduction
• Flex en action
• Autour de Flex
• Logica
Le programme
![Page 3: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/3.jpg)
Introduction
![Page 4: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/4.jpg)
No. 4© Logica 2010. All rights reserved
Flex
Qu’est ce que Flex ?
Introduction
RDA
RIAInteractive
WebApp
WEB 1.0
WebAPP
![Page 5: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/5.jpg)
© Logica 2010. All rights reserved No. 5
• 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 ?
![Page 6: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/6.jpg)
© Logica 2010. All rights reserved No. 6
• 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 ?
![Page 7: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/7.jpg)
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 ?
![Page 8: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/8.jpg)
No. 8© Logica <YEAR>. All rights reserved
Entendue des installations
![Page 9: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/9.jpg)
Flex en action …
![Page 10: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/10.jpg)
© Logica 2010. All rights reserved No. 10
• Architecture
• Langages et Interface
• Données
Flex en action
![Page 11: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/11.jpg)
No. 11© Logica 2010. All rights reserved
Flex
• Machine virtuelle
• Monothread
• Modulaire
Architecture
OS
Navigateur
Flash Player
Flex
![Page 12: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/12.jpg)
No. 12© Logica 2010. All rights reserved
Langages
MXML
Action Script 3
![Page 13: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/13.jpg)
© Logica 2010. All rights reserved No. 13
• Basé sur le XML• Description de l’interface• Structure• Dessin (Sprite)
Langages - MXML
![Page 14: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/14.jpg)
No. 14© Logica 2010. All rights reserved
Interface – Décomposition d’un élément
Button
text = ‘Button’ text
Skin
text
![Page 15: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/15.jpg)
© Logica 2010. All rights reserved No. 15
• Permet de modifier le comportement en fonction de l’état
• Manière « élégant » et « flexible » de modifier l’interface
Interface - States
![Page 16: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/16.jpg)
© Logica 2010. All rights reserved No. 16
Interface - States
![Page 17: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/17.jpg)
No. 17© Logica <YEAR>. All rights reserved
Exemples
![Page 18: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/18.jpg)
No. 18© Logica <YEAR>. All rights reserved
Exemples
![Page 19: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/19.jpg)
© Logica 2010. All rights reserved No. 19
• 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
![Page 20: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/20.jpg)
© Logica 2010. All rights reserved No. 20
• 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
![Page 21: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/21.jpg)
© Logica 2010. All rights reserved No. 21
• Langage Objet
• « Fortement » typé
• Système de getter / setter
• Système d’attributs
Langages – Action Script 3
![Page 22: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/22.jpg)
© Logica 2010. All rights reserved No. 22
• Déclaration d’une classe
• Déclaration d’une variable
• Déclaration d’une fonction
• Getter et Setter
Langages – Action Script 3
![Page 23: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/23.jpg)
© Logica 2010. All rights reserved No. 23
• 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é)
Langages – Action Script 3
![Page 24: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/24.jpg)
© Logica 2010. All rights reserved No. 24
• Possibilité de lier l’interface à la donnée
• Simplicité à la lecture
• Simplicité à la programmation
Données - Bindings
Model
View
Controller
Model
Serveur
![Page 25: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/25.jpg)
© Logica 2010. All rights reserved No. 25
• Gestion « native »
• Facilité de manipulation
• Aide à la communication client / serveur
Données - XML
![Page 26: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/26.jpg)
© Logica 2010. All rights reserved No. 26
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
![Page 27: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/27.jpg)
Autour de flex
![Page 28: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/28.jpg)
© Logica 2010. All rights reserved No. 28
• Frameworks
• Utilisation d’un serveur
• Liens pratiques
Autour de Flex
![Page 29: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/29.jpg)
© Logica 2010. All rights reserved No. 29
• 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
![Page 30: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/30.jpg)
© Logica 2010. All rights reserved No. 30
• 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
![Page 31: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/31.jpg)
© Logica 2010. All rights reserved No. 31
• API : Flex 4
• Documentation : Flex Developer Center
• Tutoriaux : Adobe® Flex™ Tutorial
• Exemple d’interface : Tour de flex
• Tout le reste : ???
Liens pratiques
![Page 32: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/32.jpg)
Question ?
![Page 33: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/33.jpg)
LOGICA
![Page 34: ADOBE FLEX 4. © Logica 2010. All rights reservedNo. 2 Introduction Flex en action Autour de Flex Logica Le programme](https://reader036.vdocument.in/reader036/viewer/2022062511/551d9db4497959293b8d8fa5/html5/thumbnails/34.jpg)
© Logica 2010. All rights reserved No. 34
• Partie flex : Alexandre Jannotta
• Partie Logica : Nora Chaouchi
Contacts