Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
EINFÜHRUNG INFLEX-MOBILE,SINGLE-SOURCING UNDCROSS-PLATFORM-DEVELOPMENTWW-Techday 16.12.2011Von Johannes Hohenbichler (Weig...
Was ist Flex Mobile   Baut auf Flex auf (letzte Präsentation)   Gibt es seit Flex 4.5 (Mai 2011)   Ist ein Framework zu...
Was ist Flex Mobile   Baut auf Flex auf (letzte Präsentation)   Gibt es seit Flex 4.5 (Mai 2011)   Ist ein Framework zu...
Neue Komponenten in Flex Mobile imVergleich zu Flex   BusyIndicator   SpashScreen   TabbedViewNavigatorApplication, Vie...
Sprache und VM   Flex Mobile: Wie bei Flex: ActionScript3 + MXML   Flex hat zwei Namespaces: mx und Spark   Spark: Die ...
Entwicklungsprozess   Flash-Builder IDE (gleiche IDE wie für normale Flex-    Applikationen, kommerziell, 60 Tage Trail)...
Single-Sourcing mit Flex Mobile   Dank Spark und der Möglichkeit in Flex Library-    Projekte zu erstellen kann eine meng...
Screenshots und Grenzen des Single-S.Single-Sourced – Die Desktop-Applikation im Browser
Screenshots und Grenzen des Single-S.Single-Sourced – Ohne weitere Anpassungen        Code ohne Anpassung auf Mobile lauff...
Screenshots und Grenzen des Single-S.Single-Sourced … und für Mobile angepasst        Besser: Anpassen für Mobile!        ...
Screenshots und Grenzen des Single-S.… auf dem Gerät
Screenshots und Grenzen des Single-S.    Validatoren – Handarbeit nötigObiges Defaultverhalten wäre fürmobile nicht brauch...
Grenzen des Emulators - Hardware                   Emulator kann Kamera nicht simulieren.                   Schade, denn e...
PAINKinderkrankheiten? Implementierungsstand des Flex Mobile SDK   Kein Comboboxen – ist zwar einbindbar, aber nicht    t...
Vorteile von Flex gegenüberAlternativen   Abstraktion von Hardware und Hardwarefunktionenen.   Schöne, gut verwendbare A...
Die KristallkugelWie geht es weiter mit Flex / Flex Mobile Flex - inzwischen ein Apache-Projekt Flash-Player Support für...
Alternativen für Cross-Platform-Development   Google Dart (10/2011 vorgestellt) – eigene    Programmiersprache  HTML5  ...
Weiterführend…   Multi-Platform-Skinning:    http://www.adobe.com/devnet/flex/articles/mobil    e-skinning-part3.html
Noch Fragen?
Nächste SlideShare
Wird geladen in …5
×

Einführung in Flex Mobile

2.349 Aufrufe

Veröffentlicht am

Einführung in Flex-Mobile, Single-Sourcing und Cross-Platform-Development

  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Einführung in Flex Mobile

  1. 1. EINFÜHRUNG INFLEX-MOBILE,SINGLE-SOURCING UNDCROSS-PLATFORM-DEVELOPMENTWW-Techday 16.12.2011Von Johannes Hohenbichler (WeigleWilczek GmbH)
  2. 2. Was ist Flex Mobile Baut auf Flex auf (letzte Präsentation) Gibt es seit Flex 4.5 (Mai 2011) Ist ein Framework zum Erstellen von Cross-Platform- Mobile-Applications
  3. 3. Was ist Flex Mobile Baut auf Flex auf (letzte Präsentation) Gibt es seit Flex 4.5 (Mai 2011) Ist ein Framework zum Erstellen von Cross-Platform- Mobile-ApplicationsTheoretisch: Code once, run everywhere
  4. 4. Neue Komponenten in Flex Mobile imVergleich zu Flex BusyIndicator SpashScreen TabbedViewNavigatorApplication, ViewNavigator ActionBar: navigator area, title area, action area Einiges mehr …
  5. 5. Sprache und VM Flex Mobile: Wie bei Flex: ActionScript3 + MXML Flex hat zwei Namespaces: mx und Spark Spark: Die „neuen“ Komponenten(Flex 4.0) bei denen sich zwischen Layout (Skins) und Model+Logik unterscheiden lässt Alle Komponenten Spark zur Verfügung (nicht alle sind Mobile-Ready!) Aus mx-Namespace (eigentlich) nur Charting Adobe AIR als Runtime Android: Runtime als Shared Installation iOS: Runtime in jedem Deployable (~10MB) Windows Phone 7: (Noch?) Nicht verfügbar
  6. 6. Entwicklungsprozess Flash-Builder IDE (gleiche IDE wie für normale Flex- Applikationen, kommerziell, 60 Tage Trail) Neues Mobile-Projekt mit Wizard (Zielplattformen, … wählen) Demo - Emulator • Fehlende Knöpfe des Emu unter Im Emulator ablauffähig Mac • Screen-DPI • Target-Device Demo – Emulator • Vorschau in der IDE • Was die IDE-Vorschau nicht kann Demo – On Device (Android) Demo – On Device (Android) • Installation über USB – Debugging aktivieren • Daten- / Netzwerkverbindung über WLAN
  7. 7. Single-Sourcing mit Flex Mobile Dank Spark und der Möglichkeit in Flex Library- Projekte zu erstellen kann eine menge Code single- sourced werden. Grenzen  MX-Komponenten nicht in Mobile verfügbar (Legacy-Code nach Mobile nicht so einfach)  Performance-Probleme wenn einfach der Flash-Player-Code verwendet wird (relativiert sich mit dual-core…)  Reuse von UI-Komponenten nur sehr beschränkt möglich  Skinning / Vererbung  Controller-Code größtmöglicher reuse
  8. 8. Screenshots und Grenzen des Single-S.Single-Sourced – Die Desktop-Applikation im Browser
  9. 9. Screenshots und Grenzen des Single-S.Single-Sourced – Ohne weitere Anpassungen Code ohne Anpassung auf Mobile lauffähig. Aber: Buttons ganz links nutzlos: Kein Touch-Event abfangbar. Auch viel zu klein für Touch-Bedienung. Performance eher schlecht! Die Komponenten sind nicht für Mobile Optimiert
  10. 10. Screenshots und Grenzen des Single-S.Single-Sourced … und für Mobile angepasst Besser: Anpassen für Mobile!  Nicht das s:DataGrid verwenden sondern eine s:List
  11. 11. Screenshots und Grenzen des Single-S.… auf dem Gerät
  12. 12. Screenshots und Grenzen des Single-S. Validatoren – Handarbeit nötigObiges Defaultverhalten wäre fürmobile nicht brauchbar: Würden denScreen um längen in der Horizontalensprengen… Anpassung durch Verändern desSkins für das FormsItem-Element (Leiderviel C&P)
  13. 13. Grenzen des Emulators - Hardware Emulator kann Kamera nicht simulieren. Schade, denn eigentlich hat mein NB eine Webcam… Ansprechen der Kamera sehr einfach möglich, da nur gegen die Flex-API programmiert werden muss. Das unterliegende System ist egal.
  14. 14. PAINKinderkrankheiten? Implementierungsstand des Flex Mobile SDK Kein Comboboxen – ist zwar einbindbar, aber nicht touchfähig – Der erste Eindruck kann täuschen! mx:HRule? <s:Line width="100%"> <s:stroke> <s:SolidColorStroke color="0x000000" weight="1"/> </s:stroke> </s:Line> Verschiedene Probleme mit dem prozentualen Breiten und Höhenangaben  screen.width und screen.height schaffen Abhilfe Emu unter Mac hat die Hardware-Emulationsknöpfe nicht Emu lässt sich nicht starten wenn der Firefox an ist (White Screen of Nothing)
  15. 15. Vorteile von Flex gegenüberAlternativen Abstraktion von Hardware und Hardwarefunktionenen. Schöne, gut verwendbare API für Hardwarefunkionen. Kein Fragmentierungsproblem? Code läuft auf Android-Phones und –Pads, iPhone, iPad, Blackberry-Playbook, Windows Phone 7 fehlt noch immer! Skinning, CSS macht einfache Anpassung an jeweilige Zielplattform möglich. Framework bietet sehr gute Optimierungen, was die Displayauflösung des Zielgerätes angeht. IDE ist hervorragend. Emulator und Debugger sind perfekt integriert.
  16. 16. Die KristallkugelWie geht es weiter mit Flex / Flex Mobile Flex - inzwischen ein Apache-Projekt Flash-Player Support für Mobile wird eingestellt – Nicht Adobe AIR  Flex Mobile geht weiter! Firma von PhoneGap übernommen durch Adobe (03.10.2011) Adobe-Labs Wallaby: .fla  HTML Google swiffy: .swf  HTMLPersönliche Prognose: Flash-Player wird auf lange Sicht verdrängt durch HTML5 und Konvertierungstools (.swf/.fla  HTML5) Flex Mobile (Adobe AIR) wird als Plattform stärker werden
  17. 17. Alternativen für Cross-Platform-Development Google Dart (10/2011 vorgestellt) – eigene Programmiersprache  HTML5 Natives HTML5 (JQuery Mobile …) Leon - http://www.leon.io/ … RhoMobile(Ruby+HTML) Appcelerator(PHP/Phyton/Ruby+HTML) PhoneGap – 3 Okt. Übernommen durch Adobe
  18. 18. Weiterführend… Multi-Platform-Skinning: http://www.adobe.com/devnet/flex/articles/mobil e-skinning-part3.html
  19. 19. Noch Fragen?

×