formation flex yasmine hammamet
TRANSCRIPT
Adobe Flex Mobile
Formation ANDROID Yasmine Hammamet 10 -11 Mars 2012
Prsent Par : Mariem ZaoualiGmail: zaouali.meriam@gmail .comWordpress: zaoualimeriam.wordpress.com
Who am I ?
Elve Ingnieur en 4me Gnie Logiciel INSAT Ancienne Prsidente du Club LibertySoft (club des logiciels libres lINSAT) Chef dAtelier dAdobe Flex Mobile lIAC et Responsable Magazine Exprience Android: depuis Janvier 2011 Exprience Adobe Flex: depuis Septembre 2011
Challenges
Lexplosion des terminaux est un dfi pour les dveloppeurs
Write Once Run Everywhere
One Tool, One Language, One Codebase
Flex Application
Adobe AIR
A complete System for Web Innovation
Adobe Flex
Il est un framework open SourceIl a tait dvelopp par Macromedia en 2004 puis rachet par Adobe en 2006. Le framework sujet de latelier est le FLEX 4.5.
Il offre la possibilit de dvelopper rapidement des applications pour beaucoup plus de priphriquesEn vitant de reproduire lapplication from scratch et de devoir maitriser les diffrents langages de dveloppement (java, objective-c..).
Il permet le dveloppement des applications Desktop et RIAOn peut rendre des applications toute faites desktop ou web des applications pour mobile et vice versa.
Adobe Flex
Adobe Integrated Runtime
The Adobe Air runtimes enables developpers to use HTML, Javascript Adobe flash professional Software and AS3 to build Web Application that run as a standalone application client without the constraints of the browser.
Adobe Flex
Adobe Integrated Runtime
AIR Flash
HTML
AIR APIs(geolocation, accelometer..)
Operating System(Linux, Windows, Mac OS..)
How does Flex work?
Flash Builder IDEFlex SDK MXML AS3 Flex Class Lib
How does Flex work?
Adobe AIR Ou Browser (Flash Player)
Web Server XML/HTTP REST SOAP Web Services BlazeDS J2EE App Server
Existing Application and Infrastructure
Flex Mobile Application
Structure : a series of viewsindividual screens of UI Above the views sits the Action Bar, containing the title of the current view and one or more controls for navigation, search, or other actions
Flex Mobile ApplicationViews utilisant le principe de la pile navigator.pushView() navigator.popView() navigator.popToFirstView()
Flex Mobile Application
Flex Mobile Application
GPS Golocalisation est supporte addEventListener(GeolocationEvent.UPDATE, callbackFunction); GelocationEvent Altitude Heading horizantalAccuracy Latitude Longitude Speed Timestamp verticalAccuracy
Flex Mobile Application
Accelerometer APIs Accelerometer.isSupported addEventListener(AccelerometerEvent.UPDATE, callbackFunction) AccelerometerEvent accelerationX accelerationY accelerationZ timestamp
Flex Mobile Application
Multitouch Multitouch Event TOUCH_MOVE, TOUCH_OUT, TOUCH_OVER
Gesture GESTURE_ROTATE, GESTURE_ZOOM, GESTURE_TWO_FINGER_TAP Camera Access
Flex Mobile Application
Native App Integration Open Email, Browser, Maps, Phone or SMS navigateToURL(new URLRequest(mailto:[email protected])); navigateToURL(new URLRequest('http://www.coenraets.org')); navigateToURL(new URLRequest('http://maps.google.com/')); navigateToURL(new URLRequest('tel:1234567890')); navigateToURL(new URLRequest('sms:1234567890'));
Local DB API SQL Lite var stmt:SQLStatement = new SQLStatement(); stmt.sqlConnection = sqlConnection; stmt.text = "INSERT into foo values(:bar)"; stmt.parameters[":bar"] = textInput.text; stmt.execute();
Flex Mobile Application
Remote Data Android Permission Required: Standard Flex Networking Libraries HTTPServices WebService RemoteObject
Flex Mobile Application
AS3
Flex Mobile Application
Bonnes Pratiques Mobile Dev
Avec ActionScript3
Utiliser Capibilities.screenDPI pour rcuprer PPI du priphrique (qt de point par pixel carr (wikipdia)) Convertir les inches, milimetres au pixels:function millimterToPixel(mm:Number):unit{ return Math.round(Capabilities.screenDPI)*(mm/25.4)); }
Bonnes Pratiques Mobile Dev
Avec ActionScript3
Pourquoi utiliser les pixels?
Parce quon pourra exploiter convenablement lespace fourni de lcran du priphrique Pour avoir des dimensions physiquement prcises
Bonnes Pratiques Mobile Dev
Avec ActionScript3
Positionner un boutonvar button:Sprite = new Sprite(); button.graphics.beginFill(0xCC0000); button.graphics.drawReet(0,0, milimiterTopixel(.75), milimiterTopixel(.45)); button.graphics.endFill(); addChild(button);
Bonnes Pratiques Mobile Dev
Avec Flex Framework, cest plus facile