Sistemi Informativi Apache Flex Introduzione Tecnologia
Stefano Ditrani https://sites.google.com/site/csiflex/ Università della Basilicata 2011/2012
Organizzazione Lezioni
1. Introduzione Tecnologia
2. Strumenti di Sviluppo
3. Concetti Fondamentali: Come Iniziare
4. Concetti Fondamentali: Progettazione Applicazione Flex
Introduzione Tecnologia: Flex/Adobe Air 2 Topics
Introduzione
Adobe Flex Platform
Conclusioni
Introduzione Tecnologia: Flex/Adobe Air Introduzione
Perché Flex?
• Negli ultimi anni Adobe Flash come strumento per creare animazioni e RIA (Rich Internet Application), ma Flash – E’ più orientato ai designers – Non è lo strumento più adatto per creare RIA Soluzione: Adobe Flex Platform
• E’ la soluzione targata Adobe per lo sviluppo di RIA – Più orientata ai programmatori – E’ un Kit integrato di tecnologie per lo sviluppo – Obiettivo: Cross-platform/Multi-divices
Introduzione Tecnologia: Flex/Adobe Air 4 Adobe Flex Platform
Adobe Flex Platform
• Adobe Flash Platform è un insieme integrato di tecnologie di programmazione rilasciate nel 2004 basate da un consolidato ecosistema di supporto alla programmazione, business partner e da una grande comunità
Introduzione Tecnologia: Flex/Adobe Air 5 Adobe Flex Platform
Tools Framework Clients Servers
Flash Builder Adobe Flex Flash Player LiveCycle Data Services ES2
Flash Catalyst Adobe AIR BlazeDS
Introduzione Tecnologia: Flex/Adobe Air 6 Framework: Adobe Flex
Prime Versioni
• Flex è un framework SDK (open source) è un'infrastruttura di sviluppo basata su componenti per la distribuzione di RIA per i client runtime di Adobe – Prime versioni 2004 (Flex 1.0 e 1.5): applicazione Java EE – Flex 2.0: Action Script 3 e FlexBuilder 2 – Flex 3.0: Open Source (MPL), integrazione con AIR – Flex 4.0: migliore performance compilazione, effetti 3d, interfacciamento con scheda video – Flex 4.6 (Multi-Screen, Nuovi componenti Spark, Supporto allo sviluppo applicazione di grandi dimensioni) – • Donazione: Apache Software Foundation
Introduzione Tecnologia: Flex/Adobe Air 7
Framework: Adobe Flex
Linguaggi: MXML e Action Script 3.0
• MXML: Linguaggio di markup – file MXML seguono le regole dei file XML ben formati – Layout e comportamenti interfaccia utente (attraverso tag) – Per aspetti non visuali: accesso a dati in remoto, data bindings e comportamenti (behaviors) • Action Script 3: Object-Oriented – Elementi dei linguaggi object-oriented (classi, oggetti, ereditarietà)
– sviluppare logica lato Client Scheletro file mxml – Personalizzare e creare nuovi componenti -Dichiarazione documento xml
-MX:
Introduzione Tecnologia: Flex/Adobe Air 8 Framework: Adobe Flex Libreria di classi AS3 e MXML • Flex include una libreria di classi Action Script 3 che contiene componenti (contenitori e controlli), classi manager, classi data-service e classi per tutte le altre features – Componenti visuali inserimento/visualizzazione dati – Contenitori per gestione layout – Componenti non visuali (validazione dati, drag & drop, invio recupero dati server) – Componenti per il supporto per la creazione di applicazioni mobili e desktop
Introduzione Tecnologia: Flex/Adobe Air 9 Framework: Adobe Flex Libreria di classi AS3 e MXML • Tag MXML corrispondono alle classi ActionScript o alle proprietà delle classi
• Le applicazioni Flex vengono eseguite all'interno di un comune browser ma sfruttano la potenza del run time enviroment del Flash Player
• Molti prodotti correlati a Flex: Cairngorm, PureMVC, librerie di terze parti
Introduzione Tecnologia: Flex/Adobe Air 10
Development tools
Command line tools
• fdb: Un debugger per eseguire il debug delle applicazioni.
• asdoc: Uno strumento per estrarre documentazione da classi AS3 e generare file HTML
• mxmlc: compilatore a riga di comando – Il codice MXML e AS3 viene trasformato in un esclusivo codice Action Script e quindi compilato in un unico file SWF Librerie Flex
Action Script 3
MXML AS3 SWF
Introduzione Tecnologia: Flex/Adobe Air 11
Web Resource http://opensource.adobe.com/wiki/display/flexsdk/Flex+SDK
Adobe Flex Platform
Tools Framework Clients Servers
Flash Builder Adobe Flex Flash Player LiveCycle Data Services ES2
Flash Catalyst Adobe AIR BlazeDS
Introduzione Tecnologia: Flex/Adobe Air 12 Clients
Adobe Flash Player è il client runtime per il browser (SWF file)
Web browser • Cross-platforms (Windows, Mac OS, Linux, Android…)
• Installazione (plug-in, stand-alone)
• 1996: Macromedia Flash 1.0 (Addio al Flash Mobile 2011)
• Attualmente Flash Player 11 sia mobile che desktop (ottimizzazione nativa a 64-bit, Accelerazione grafica 2D/3D, Protezione contenuti, controllo dispositivi Mobili)
Introduzione Tecnologia: Flex/Adobe Air 13
Clients
Statistiche (fine 2010)
• 98% utenti internet hanno installato il Flash player
• 85% siti web più popolari utilizzano il Flash player
• 20+milioni installazioni su smartphones nei primi 6 mesi
• 36% di tutti gli smartphones supporterà il flash player entro 2011
*Addio al Flash mobile (novembre 2011)
Introduzione Tecnologia: Flex/Adobe Air 14 Clients Adobe Air è il client runtime per il desktop e i dispositivi mobili
AIR Web browse r
• Cross-platforms (Windows, Mac OS, Android, iOS, BlackBerry Tablet OS)
• Sviluppo delle Applicazioni AIR più semplice
– Flash/Flex/ActionScript – HTML/JavaScript/CSS/Ajax (Adobe AIR SDK) • SI integra con il Sistema Operativo e con i servizi web
• Distribuzione (file .air)
Introduzione Tecnologia: Flex/Adobe Air 15 Clients Adobe AIR è il client runtime per il desktop e i dispositivi mobili • AIR 1.0 (2008): supporto alla localizzazione e AIR SDK • AIR 1.5: aggiornamento web kit • AIR 2.6 (2006): anche per dispositivi android
• Attualmente AIR 3.0 (ottimizzazione nativa a 64-bit, Accelerazione grafica 2D/3D, Protected HTTP Dinamic Streaming, video HD, Protezione contenuti, controllo dispositivi Mobili), nuove API
Introduzione Tecnologia: Flex/Adobe Air 16 Clients Statistiche (fine 2010)
• 84+milioni smartphones e tablets che supportano AIR
• 1500+apps in Android nei primi due mesi
• 200+milioni smartphones e tablets per la fine del 2011
Introduzione Tecnologia: Flex/Adobe Air 17 Adobe Flex Platform
Tools Framework Clients Servers
Flash Builder Adobe Flex Flash Player LiveCycle Data Services ES2
Flash Catalyst Adobe AIR BlazeDS
Introduzione Tecnologia: Flex/Adobe Air 18 Data Service e server
Adobe LiveCycle Data Services ES2
• A livello server Flex si integra con i seguenti prodotti:
– PHP, Java, .NET
• Software lato server che offre data service fondamentali grazie a cui le applicazioni Flex possono interagire con dati e business logic di back-end secondo un modello più rapido e efficiente.
BlazeDS (open source): collega facilmente applicazioni Flex/AIR a infrastrutture di back-end
Introduzione Tecnologia: Flex/Adobe Air 19 Adobe Flex Platform
Tools Framework Clients Servers
Flash Builder Adobe Flex Flash Player LiveCycle Data Services ES2
Flash Catalyst Adobe AIR BlazeDS
Introduzione Tecnologia: Flex/Adobe Air 20 Development Tools
Flash Builder 4.5 (Standard/Premium)
• IDE basato su Eclipse – versione professional commerciale
– (versione standard free per studenti e Docenti)
• Test debug e deploy applicazioni Flex
• Refactoring, profiling
Introduzione Tecnologia: Flex/Adobe Air 21 Development Tools
Adobe Flash Catalyst
• Orientato ai designers per creare interfacce utente interattive senza dover scrivere una riga di codice (Integrazione con Fb)
Alternative open source
• Flash Develop
• Eclipse, NetBeans
Introduzione Tecnologia: Flex/Adobe Air 22
Riferimenti
Sito di riferimento per questo corso:
• https://sites.google.com/site/csiflex/
Libro di riferimento:
• Adobe Flash Builder 4 and Flex 4 Bible - David Gassner
Tutorial, Articoli, esempi:
• http://www.adobe.com/devnet/flex.html
Introduzione Tecnologia: Flex/Adobe Air 23