Department of Computer Science Institute for System Architecture, Chair for Computer Networks lication Development for Mobile and Ubiquitous Computing 10. Cross-Platform Development Dr. Ing. Thomas Springer Technische Universität Dresden Chair of Computer Networks
Lecture Structure lication Development Cross-Platform Development Adaptation and Contextawareness Java ME Android ios.net Compact Framework/ Windows Phone 7 OSGi Mobile Middleware Disconnected Operations Mobile Databases Locationbased Services Communication Mechanisms Mobile Internet Enabling Technologies and Challenges Slide 2
Why Cross-Platform Development? Strong fragmentation of market for mobile device platforms Market changes quickly High update rate Device features Platform APIs 3
Why Cross-Platform Development? Java ME Project Android Project ios Project Windows Phone Project Mobile Device Mobile Device Mobile Device Mobile Device Midlet Suite Midlet Suite....apk.apk....ipa.ipa....xap.xap... Optional Packets MIDP Profile CLDC Configuration, KVM Operating System lication Framework Libraries Linux Kernel Dalvik VM + Core libraries Custom Frameworks Cocoa Touch UIKit Media Core Services Foundation Mach/BSD Kernel Silverlight Model Frameworks XNA UI Model Kernel Hardware Foundation HTML/JavaScript Common Language Runtime Cloud Integration Hardware Hardware Hardware Hardware 4
Problem description High development effort Know-how for multiple platforms High update rates of technology Customers don t pay per platform but for project Short time to market Fast support of platform changes/new platforms High maintenance effort Manage multiple code bases Avoid inconsistencies Mobility Support 5
Write once, run everywhere? Cross-Platform Project Mobile Device Mobile Device Mobile Device Mobile Device Midlet Suite Midlet Suite....apk.apk....ipa.ipa....xap.xap... Optional Packets MIDP Profile CLDC Configuration, KVM Operating System lication Framework Libraries Linux Kernel Dalvik VM + Core libraries Custom Frameworks Cocoa Touch UIKit Media Core Services Foundation Mach/BSD Kernel Silverlight Model Frameworks XNA UI Model Kernel Hardware Foundation HTML/JavaScript Common Language Runtime Cloud Integration Hardware Hardware Hardware Hardware 6
How can we achieve it? Cross-Platform Project Mobile Device Mobile Device Mobile Device Mobile Device Midlet Suite Midlet Suite....apk.apk....ipa.ipa....xap.xap... Optional Packets MIDP Profile CLDC Configuration, KVM Operating System lication Framework Libraries Linux Kernel Dalvik VM + Core libraries Custom Frameworks Cocoa Touch UIKit Media Core Services Foundation Mach/BSD Kernel Silverlight Model Frameworks XNA UI Model Kernel Hardware Foundation HTML/JavaScript Common Language Runtime Cloud Integration Hardware Hardware Hardware Hardware 7
Challenges Heterogeneous Hardware Form factors Resources Device features (touch input, buttons, connectivity, sensors, ) Heterogeneous Software Platforms Execution environment Programming languages Platform APIs, UI Kit anatomy and programming model Tool chains Deployment and verification process User expectations Look and Feel Design guidelines Mobility Support 8
Terms and Definitions Device Platform A device platform is a combination of device hardware, operating system, runtime system, libraries, and frameworks forming a standard execution environment for applications on devices which run that platform. A device platform has a characteristic set of features: Specific look and feel (UI guidelines and interaction concepts) runtime defining app anatomy and lifecycle Developer tool chain (programming languages, libraries, APIs) Specific app distribution and deployment process Native is code which can be directly executed within the standard execution environment of the device platform. It has full access to the platforms libraries and frameworks, possibly also to operating system APIs and hardware features. 9
Terms and Definitions An is a specific type of applications created for and running on a particular device platform. A Native is an which is created for and can be deployed and started on a device platform whithout any further dependencies. A Mobile is typically created for and running on a mobile device platform. It s started from the home screen, supports graphically-oriented interactions and occupies the full screen. 10
Mobile Types Hybride Native Cross-Platform (+ Native Ext.) Interpreted Web Web browser Cross-Platform API Interpreter Device Platform 11
Cross-Platform Development roaches What to start with? Design Phase Implementation Phase Build Phase Execution Phase Mobile Device Model Source Executable Program 12
Cross-Platform Development roaches Model-driven Development Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Mobile Device Model Model-to-- Source Executable Program 13
Cross-Platform Development roaches Cross-compilation to native code Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Mobile Device Cross- / JIT- Machine Execution Model Model-to-- Source Executable Program 14
Cross-Platform Development roaches Support for abstract runtime Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program 15
Cross-Platform Development roaches Script languages Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program 16
Cross-Platform Development roaches Translate to other programming languages Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program 17
Cross-Platform Development roaches Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program 18
Translation roach Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Translation roach Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program 19
roach Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Translation roach Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program roach 20
Web-based roach Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Translation roach Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Executable Program Web-based roach roach 21
Hybrid roach Design Phase Implementation Phase Build Phase Execution Phase Model-to-Model- Translation roach Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Hybrid roach Executable Program Web-based roach roach 22
Model-driven roach Design Phase Implementation Phase Build Phase Execution Phase Model-driven roach Model-to-Model- Translation roach Source-to-Source-Translation ( ) Mobile Device Cross- / JIT- AOT- / JIT- Machine Execution Model Model-to-- Source Byte Hybrid roach Executable Program Web-based roach roach 23
Many tools and approaches 24
Example EMODE Model-Driven roach Abstract Design Design Phase Refinement Implementation/Build Phase Execution Phase Source M-M Abstract UI Model M-C Concrete UI Model Task Model M-C Executable Task Model (EMODE-Runtime Environment) JavaME M-M Functional- Core-Adapter Model M-C FCA-... other Platforms Concept Model M-M Context- Model M-C Context- Provider- M-M = Modell-to-Modell- M-C = Modell-to-- Step-wise desing Models for UI and application logic Integrated tool environment to consistently develop UI and application logic 25
Bedrock Translation roach JavaME as common code base Parameterized code to customize code for different platforms Source-to-Source Transaltion to various programming languages Transformed code can be further edited Compatibility libraties per platform to bridge API-gap No DIE, but translation scripts, compatibility lib and cross-compiler Implementation Phase Source-to-Source- Translation JavaME- Source JavaME- Source Java-Source (Android) C++-Source Maschinencode C#- Source ActionScript HTML5, JavaScript Realisation in Bedrock Buildphase -, Compatibility Libraries... Cross- Cross- JavaME- Bytecode BlackBerry- Bytecode Dalvik- Bytecode Maschinencode CIL- CIL- ActionScript- Bytecode Integration of Platform-SDKs... Execution Phase Execution Execution JavaME BlackBerry Android ios, Bada, Symbian, WinMobile, webos, BREW,... Windows Phone Windows Desktop (.NET) Flash Player Browser 26
Implementierungsphase Buildphase XMLVM Translation roach Abarbeitungsphase.NET- Quellcode (C#, VB,...) Java- Quellcode Kompilierung CIL- Bytecode Kompilierung Java- Bytecode MBEL XMLVM- CLR, -DFA (XML) BCEL XSL XMLVM- JVM (XML) XSL XMLVM-CLR (XML) BCEL MBEL CIL- Bytecode Java- Bytecode.NET- Plattform Java- Plattform (Xcode: Cross-Kompilierung zu Maschinencode; Ausführung) Objective-C- Quellcode ios Ruby- Quellcode Kompilierung Ruby(YARV)- Bytecode BCEL = Byte Engineering Library MBEL = Microsoft Bytecode Engineering Library Ruby DX XMLVM-DEX (XML) XSL JavaScript- Quellcode C/C++- Quellcode Browser Cross-Kompilierung... Python- Quellcode... Realisierung durch XMLVM roach using m:1:n language translation XML as common language for byte code based on Java Bytecode based on XML Stylesheets Compatibility libraries used to port apps (even from Android to ios) 27
Qt Translation roach Implementierungsphase Buildphase Abarbeitungsphase Qt C++- Quellcode Präprozessor C++- Quellcode Maschinencode Cross- Kompilierung... Maschinencode Ausführung... Ausführung Symbian, MeeGo, Maemo, Windows, Linux, Mac OS Qt C++ as source Virtual toolkit Cross-platform libraries allow access to many device specific features (camera, contacts, Maps, GPS, Sensors, etc.) Qt Quick allows declarative description of touch-based Uis Interpreted in special runtime engine Currenty only Symbian, Maeme and MeeGo supported (Prototype for Android) 28
Adobe Air roach Implementierungsphase Buildphase Abarbeitungsphase AOT-Kompilierung Maschinencode Ausführung ios ActionScript- Quellcode Kompilierung ActionScript- Bytecode (separat zu installierende AIR-Laufzeitumgebung)... Android, Windows, Linux, Mac OS (integrierte AIR- Laufzeitumgebung) BlackBerry Tablet OS TV Specific AIR runtime engine + libraries declaratively described in MXML (special extensions to support touch-based interactions) description compiled to ActionScript code 29
Rhodes Mobile roach Implementation Phase Build Phase Execution Phase HTML-, CSS-, JavaScript- Source (Browser-Engine of Platform, WebView) BlackBerry- Bytecode BlackBerry Ruby- Source ode ios One Cross-platform Project Ruby- Bytecode (bundled VM) Android WinMobile Ruby, HTML, CSS and JavaScript as common code base in one project lication bundled with lightweight web server + Rhodes Ruby Framework + Ruby VM 30
Google Web Toolkit (GWT) Web-based roach Implementation phase Buildphase Execution phase Java-Source (Client) Source-to-Source- Translation JavaScript-, HTML-, CSS- Source Browser (Client) Java-Source (GWT Servlet) Java- Bytecode Java- Plattform (Servlet Container / Google Engine) Supports development of client and server side code for Web-lications in Java Source-to-Source translation to HTML, JavaScript and CSS (High-leve Translator JavaScript optimized for various browsers Mobile support with specific extensions of GWT libraries (GWTMobile, GWT-Mobile-Webkit) 31
Phone Gap Hybrid roach Combination of Webbased and Translation approach Web-technologies to create UI + logic Native to access specific device features like sensors, camera, etc. Cross-platform API for each target platform (PhoneGap JavaScript API) Native UI widgets are not supported ios PhoneGap Bib (JavaScript) ios PhoneGap Bib (Nativ) (Nativer Wrapper ) ios-plattform-api Projekt for ios HTML, CSS, JavaScript PhoneGap Cross-Platform-API for JavaScript Android PhoneGap Bib (JavaScript) Android PhoneGap Bib (Nativ) (Nativer Wrapper ) Android-Plattform- API Projekt for Android 32
Comparision Tool Supported Device Platforms Programming Language roach Execution Env. Generic parts Native - Widgets Supported Platform- Features Bedrock Android, Antix Game Player, bada, BlackBerry, BREW, Flash, ios (iphone, ipad), JavaME, Nintendo DS / DSi / DSiWare, Sony PSP / PSP Minis, Symbian, webos, Windows Mobile, Windows Phone 7, Browser (HTML5) Java (JavaME) Source-to-Source- Translation to C++, Java, C#, ActionScript, JavaScript; Plattform-SDK for Cross- native, no Qt Symbian, Maemo, MeeGo, Windows, Linux, Mac OS C/C++ Cross- native, Yes XMLVM ios, Android,.NET-Plattform, Java-Plattform, weitere Zielsprachen: JavaScript, Python, C++, Objective-C Adobe AIR ios (iphone, ipad), Android, Blackberry Tablet OS, Desktop-PCs, TV Kony Rhodes Titanium Mobile Sencha Touch Google Web Toolkit PhoneGap Android, ios, J2ME, BlackBerry, Symbian, Windows Mobile, Windows Phone 7, webos, BREW; Tablets: ios, Android, BlackBerry, webos; Android, BlackBerry, ios (iphone, ipad), Windows Mobile, Windows Phone 7 Android, ios (iphone, ipad), BlackBerry, Titanium Mobile Web SDK: Browser ios (iphone, ipad), Android, BlackBerry (incl. PlayBook) Java, Ruby, Sprachen der.net-plattform ActionScript, MXML Bytecode- native Yes Bytecode- / AOT- (ios) Lua Bytecode- / Source-to-Source- Translation, Cross- (ios) Ruby, HTML, of CSS, JavaScript scripting languages Bytecode- Engine / native Engine / native Engine, hybrid,,, JavaScript approach Engine, yes JavaScript, (HTML, CSS) JavaScript-lication- Framework Any device with Web browser Java Source-to-Source- Translation to HTML, CSS, JavaScript ios (iphone, ipad), Android (Smartphones, Tablets), webos, Symbian, BlackBerry, Windows Phone, bada Native, HTML, CSS, JavaScript partly yes Web, No Web, No Hybride roach hybride, no partly 33
Summary Strong fragmentation of market for mobile device platforms Cross-Platform frameworks try to bridge the gap Large number of tools following manifold approaches Methodology Target platforms Native features anatomy User interactions No tool fulfills all requirements In sum: instead of Write once, run everywhere it s more Write once, run many Possible strategy for projects 1. Web to support large set of platforms 2. Native s in addition for most important platforms 34
References Dirk Hering: Analyse von Methoden und Werkzeugumgebungen zur plattformunabhängigen Entwicklung mobiler likationen, Diplomarbeit, TU Dresden, 2010 Kramer, Dean ; Clark, Tony ; Oussena, Samia: MobDSL: A Domain Specific Language for multiple mobile platform deployment. In: 2010 IEEE International Conference on Networked Embedded Systems for Enterprise lications (NESEA), 2010, S. 1 7 Hamann, Thomas ; Hübsch, Gerald ; Springer, Thomas: A Model- Driven roach for Developing Adaptive Software Systems. DAIS 2008, Proceedings Bd. 053 (LNCS), pp. 196 209, 2008 Kassinen, Otso ; Harjula, Erkki ; Koskela, Timo ; Ylianttila, Mika: Guidelines for the Implementation of Cross-platform Mobile Middleware. In: International Journal of Software Engineering and Its lications (IJSEIA) 4 (2010), Nr. 3, S. 43 57 Calvary, Gaëlle ; Coutaz, Joëlle ; Thevenin, David ; Limbourg, Quentin ; Bouillon, Laurent ; Vanderdonckt, Jean: A Unifying Reference Framework for multi-target user interfaces. In: Interacting with Computers 15 (2003), Nr. 3, S. 289 308 35
References Adobe AIR: http://www.adobe.com/products/air Bedrock: http://www.metismo.com Google Web Toolkit: http://code.google.com/intl/ de-de/webtoolkit Kony Platform: http://www.kony.com/platform PhoneGap: http://phonegap.com/ Qt: http://qt.nokia.com/products Rhodes: http://rhomoile.com Sencha Touch: http://www.sencha.com/products/touch Titanium Developer: http://www.appcelerator.com XMLVM: http://xmlvm.org 36