1/36

Lecture Mobile Application Development (119310)

Cross-Platform Development

2/36

Agenda

3/36

Why Cross-Platform?

center 40%

Source IDC

4/36

Puhhh!! We’re lucky only Android and iOS left?

But: 2 > 1 and things can change quickly

5/36

Types of Cross-Platform-Development

6/36

Types of Cross-Platform-Development

7/36

Transpiler

center

8/36

Program Transformation

center

source: program-transformation.org

9/36

Transpiler == Cross-Compiler?

10/36

Transpiler ≠ Cross-Compiler!

11/36

Transpiler Tools

12/36

XMLVM vs. J2OBJC

XMLVM J2OBJC
Creates Objective-C from Java code Creates Objective-C from Java code
supports also other languages and GUI-APIs only focuses on business logic an no GUI code, does not support other language
only has a small community and is relatively old is supported by Google and regularly updated

Drawbacks:

13/36

Hybrid Apps

center

14/36

Hybrid Apps

15/36

Example: Cordova

16/36

Cordova Development

17/36

Example Project Creation

$ sudo npm install -g cordova
 
$ cordova create MyApp de.hdm.myapp MyApp
 
$ cd MyAPP
$ cordova platform add android

$ cordova platform add ios
 
$ cordova run android
$ cordova run ios
18/36

Cordova Development

19/36

Cordova Technical Background - Connect JS with native code

Implements UIWebViewDelegate Protocol:

- (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest: 
(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSURL *url = [request URL];
...
if ([[url scheme] isEqualToString:@"gap"]) {/
//... Tell the JS code that we've gotten this command, and we're ready for another
        [theWebView stringByEvaluatingJavaScriptFromString:@"PhoneGap.queue.ready = true;"]; //...}
    /*If a URL is being loaded that's a file/http/https URL, just load it internally*/
    else if ([url isFileURL] || [[url scheme] isEqualToString:@"http"] || 
			 [[url scheme] isEqualToString:@"https"])
    {
        return YES;
    }
   ...
}
20/36

Cordova Technical Background - Return from native to JS

- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script
webview.loadUrl(”javascript:(function(){”+ 2 ”alert(’Call−Back’);})()”);
21/36

Cordova Pro & Contra

Pro Contra
Easy development with web technologies Debugging is more difficult
Support for many contemporary devices Performance drawbacks in comparison to real native applications
Provides development templates for most IDEs WebViews do not always support same features as platform browsers
OpenSource project with active community and commercial company support For commercial support PhoneGap can be used
Good for porting existing web applications to „native“ mobile app and for rapid prototyping Still many platform specific changes necessary
22/36

Appcelerator Titanium Mobile

23/36

Appcelerator Titanium Mobile Architecture

center

24/36

Titanium Mobile Pro & Contra

Pro Contra
Useful for rapid prototyping using JavaScript Only JavaScript language support for mobile apps
One simple SDK for developing desktop and mobile apps, supporting many device features Hard to debug
OpenSource project with active community and commercial company support -
Creates native hybrid apps Not always device independent API
25/36

Other hybrid app frameworks

26/36

Runtime Library Based Cross-Platform App Frameworks

27/36

Unity Game Engine

28/36

Adobe Flash Builder

29/36

Marmalade SDK

30/36

Xamarin

React Native

31/36

Other solutions

32/36

LibGDX

33/36

MobiDevelop’s RoboVM Fork

34/36

RemoteUI

35/36

Conclusion

36/36

Recap Questions