The document discusses cross-platform mobile application development. It provides information on mobile operating systems like Android, iOS, Windows Phone OS, Symbian OS, and others. It then discusses cross-platform applications which can be built using a single codebase that runs on multiple platforms. There are two main types: native cross-platform apps which are coded for each platform, and hybrid apps which are built using HTML, CSS, and JavaScript and then wrapped in a native container. Popular frameworks for developing hybrid apps include PhoneGap, React Native, and Flutter. The document also provides details on how hybrid mobile apps work, comparing characteristics of native and hybrid apps, and discussing the PhoneGap framework in more depth.

1. CROSS PLATFORM APPLICATIONS
DEVELOPMENT
Handled By
Dr.T.Abirami
Associate Professor
Department of IT
Kongu Engineering College

2. Mobile Operating Systems(OS)
• OS is a software interface that is responsible for
managing and operating hardware units and
assisting the user to use those units.
• The main function of mobile operating system is to
allow smartphones, tablets, PDAs and other
handheld devices to run applications and programs.
• It manages mobile multimedia functions, mobile and
internet connectivity, touch screen controls,
Bluetooth connectivity, GPS navigation, cameras,
speech recognition, and more
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

3. Mobile OS
• Android OS (Google Inc.)
• Bada (Samsung Electronics)
• BlackBerry OS (Research In Motion)
• iPhone OS / iOS (Apple)
• MeeGo OS (Nokia and Intel)
• Palm OS (Garnet OS)
• Symbian OS (Nokia)
• webOS (Palm/HP)
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

4. Mobile OS
Android Operating System :
• Android is an open-source mobile OS
developed by Google and launched in 2008.
• Android is a Linux-based OS that uses Linux 2.6
Apple iOS
• Apple iOS is a closed-source code mobile phone
OS developed by Apple in 2007;
• it is used by Apple-only products (iPhone, iPod,
and iPad).
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

5. Symbian Operating System
• Symbian OS is an open-source mobile OS written
in C++ programming language developed by
Symbian Ltd. in 1977;
• it is mostly used by Nokia phones.
Windows Phone Operating System
• Windows phone OS is a closed-source code mobile OS
developed by Microsoft Corporation and used by
multiple smart devices (personal digital assistants,
smartphones, and touch devices).
• Windows phone OS is based on a compact version of
.Net framework, which gives it an advantage in
developing .Net-oriented mobile applications
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

6. Mobile OS
• https://en.wikipedia.org/wiki/Comparison_of
_mobile_operating_systems
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

7. How to Set Up and Configure Your Phone
• Select a language.
• Insert the SIM card and enter your PIN.
• Select a Wi-Fi network.
• Transfer from another device.
• Set up/login to Google account (optional)
• Protect your phone.
• Set up notifications.
• Set up Google Assistant.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

8. SIM: Subscriber Identity Module or Subscriber
Identification Module
• SIM is an integrated circuit that securely
stores the international mobile subscriber
identity (IMSI).
• It is a portable memory chip
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

9. What is CROSS PLATFORM
APPLICATIONS?
• Mobile App developers can build applications
that can run on different platforms with one
single code system.
• In computing, cross-platform software is
computer software that is implemented on
multiple computing platforms.
• For example, a cross-platform application may
run on Microsoft Windows, Linux, and macOS.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

10. What are cross-platform apps?
• cross-platform apps work on multiple
operating systems with a single code base.
There are 2 types of cross-platform apps:
1. Native Cross-Platform Apps
2. Hybrid ‘HTML5’ Cross-Platform Apps
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

11. Native Cross-Platform Apps
• A native app is a program that has been coded in a
specific programming language, for devices having
specific OS.
• For instance, Objective C is preferred programming
languages used for iOS or Java for Android Phones
• Mobile operating system has its own SDK (Software
Development Kit) to create mobile apps. These SDKs
also have preferred programming languages which are
supported by the OS vendor.
• Apps created with these languages using the official
SDK are called as “native apps”.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

12. Mobile Develop Environment
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

13. Native Programming Pros:
• Most control over the device
• Low-level coding for cutting edge technologies
that are added on to the device
• Fastest access to latest and greatest features
through your language
• Fastest in execution bottom line
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

14. Native Programming Cons:
• Slowest to develop
• Most costly development method
• Takes highest skilled and specialized app
developers to build for iOS and Android
• High barrier to entry
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

15. Hybrid cross-platform Apps
• Hybrid apps or Cross-platform development
Apps are coded in one language that can run
on multiple platforms.
• Hybrid applications are web applications (or
web pages) in the native browser, such as
UIWebView in iOS and WebView in Android.
• Hybrid apps are developed using HTML, CSS
and Javascript, and then wrapped in a native
application using platforms like Cordova.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

16. Programming Languages for
Hybrid Apps
Xamarin and C#
• Developed by Microsoft, C# (pronounced C
sharp) is another object-oriented
programming language.
• Microsoft eventually acquired the Xamarin
framework, which allows app developers to
program using C#.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

17. JavaScript Languages
• The most popular hybrid languages use
JavaScript frameworks.
• It’s kind of a general-purpose programming
language for multiple use cases.
• React Native
• Appcelerator
• Cordova/PhoneGap
• Dart and Flutter.
Programming Languages for
Hybrid Apps
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

18. Cross-platform apps tools
• Cordova or PhoneGap (HTML+JavaScript)
• React Native
• Flutter
• Ionic
• AppCelerator (C#/.Net)
• Xamarin (Objective-C)
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

19. https://www.mindk.com/blog/react-native-vs-ionic-phonegap-cordova/
https://www.optasy.com/blog/phonegap-vs-react-native-
which-platform-choose-building-your-mobile-app-and-why
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

20. Why Hybrid App?
• Single code base for all platforms means
write once and run anywhere but for native
app scenario, we need to build and maintain
separate app and code for each platform
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

21. Dr.T.Abirami, Department of IT ,
Kongu Engineering College

22. Parameter Native Apps Cross-Platform Apps
Cost High cost of
development
Relatively low cost of
development
Code Usability Works for a single
platform
Single code can be used
on multiple platform, for an
easy portability
Device Access Platform SDK ensures
access to device’s API
without any hindrance
No assured access to all
device APIs
UI Consistency Consistent with the UI
components of the
device
Limited consistency with
the UI components of the
device
Performance Seamless performance,
given the app is
developed for the
devices OS
High on performance, but
lags and hardware
compatibility issues are not
uncommon
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

23. Dr.T.Abirami, Department of IT ,
Kongu Engineering College

24. PhoneGap / Cordova PhoneGap
PhoneGap is an open source solution
for building cross-platform mobile apps
using Web technologies like HTML,
JavaScript, and CSS.
Cordova used to be called PhoneGap.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

25. Frameworks for Hybrid App
development
• Cordova is an open-source mobile development
framework.
• Cordova Plugin helps to access device features.
• It allows to use standard web technologies for
cross-platform development.
• Applications execute within wrappers targeted
to each platform.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

26. PhoneGap Working
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

27. How PhoneGap Works?
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

28. Device interaction View
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

29. PhoneGap application Build
Process
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

30. PhoneGap Build Process
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

31. Dr.T.Abirami, Department of IT ,
Kongu Engineering College

32. Basic Components
• WebView:
– It provides user interface of a Cordova
application and it can also be a component for
some platforms within a larger, hybrid
applications.
– These applications mix the WebView with the
native application components.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

33. Web App:
• It is simply a webpage that is created
using HTML, CSS and JavaScript. By default, a
local file
• i.e., index.html is used to refer to CSS,
JavaScript, media files and other resources
that are required to run the application.
• The app is mainly executed in
a WebView within the native application
wrapper that are distributed to the app stores.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

34. Web App
• This container consists a key file
i.e., config.xml that are responsible for
providing the information about the app.
• Cordova creates an app, in which the web app
is initialized in a WebView i.e., HTML
Rendering Engine.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

35. Plugins:
• Plugins are defined as an integral part of the
Cordova ecosystem
• It provides an interface for the Cordova and
the native components for communicating
with each other.
• It also provides an interface for bindings
standard device APIs. It allows you to invoke
the native code from JavaScript.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

36. Plugins:
• It provide access to device capabilities in the
application such as camera, battery, contacts
etc.
• By using these plug-ins, the developers can
easily link the JavaScript code to native code
that is running in the backend.
• There are several third-party plugins are
available that provide additional bindings to
the features that are not necessarily available
on all platforms.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

37. HISTORY
YEAR WORK
2009 Nitobi creates PhoneGap
2011 Nitobi donates PhoneGap code to
Apache Software Foundation
2012 Project maintained by Apache is
renamed Cordova
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

38. Apache Cordova
Apache Cordova is a set of device APIs that allow a
mobile app developer to access native device
function such as the camera or accelerometer from
JavaScript.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

39. platforms where we can develop
apps using Cordova
• Android
• iOS
• Windows
• Firefox OS
• Blackberry
• Tizen
• Web OS
• Symbian
• Ubuntu Dr.T.Abirami, Department of IT ,
Kongu Engineering College

40. ADVANTAGES OF PHONEGAP
• Supports 7 Platforms (Apple, Android,
Windows, Blackberry, Symbian, Bada, webOS)
• Single Standards compliant UI language
(HTML5, CSS, Javascript)
• OpenSource
• Support Packages Available for Developers
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

41. Advantages of Apache Cordova
• It is an open-source platform.
• It is easy to learn and used for developing a cross-platform
application.
• It provides flexibility to build apps for multiple platforms
without learning new programming languages.
• Development of applications in Cordova is fast because it
transforms into app that is supported by other platforms.
• It is very quick to prototype.
• It consists the set of pre-developed plugins that provide
access to the device's camera, GPS, file system.
• There are many community add-ons that provides several
libraries and frameworks.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

42. Disadvantages of Apache Cordova
• It is not optimal for large apps because hybrid
apps are slower than native ones.
• Because of running its code in the web view,
its performance become slow.
• It is not suitable for game application
development, because it needs some higher-
end plugins that are currently not available.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

43. Web VS PhoneGap project
Web project
– Every page is loaded by changing the url.
– Each page works like a standalone application
PhoneGap project
• Project is an application, just like the desktop
applications.
• So there should be only one main window that
contains all resources/controls/data
• index.html should be the startup page of your
PhoneGap application.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

44. PhoneGap Platform Support
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

45. Dr.T.Abirami, Department of IT ,
Kongu Engineering College

46. • https://books.google.co.in/books?id=HllmW5f
j6HwC&printsec=frontcover#v=onepage&q&f
=false
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

47. Hybrid Application Frameworks
• AppCelerator Titanium
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

48. AT&T Workbench and Antenna Volt
• It helps extend existing enterprise application
services to iPhone through secure web apps
hosted in a managed environment.
• It enables companies to deploy enterprise
applications in a highly-secure manner
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

49. BlackBerry Webworks
• It is an application platform that enables
developers to create standalone applications
using modern and standardized web
technologies.
• WebWorks applications can be fully-featured
“Super Apps” through their ability to integrate
with native BlackBerry and PlayBook features.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

50. Strobe Corp
• It is a mobile application delivery networks
that utilizes PhoneGap build to package native
applications using their frameworks
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

51. Tiggr
• It is a Web-based mobile apps builder or a
mobile RAD (Rapid Application Development)
tool.
• It is a cloud-based mobile apps builder
• It enables developers to build mobile Web and
native apps very quickly.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

52. IBM Worklight for Mobile App
Development
• Worklight is an open, comprehensive and advanced
mobile application platform and framework used to
develop HTML5, hybrid and native mobile applications.
• Worklight also helps run and manage these software
mobile applications.
IBM Worklight framework is made up of these four main
components:
• IBM Worklight Studio.
• IBM Worklight Device Runtime Components.
• IBM Worklight Server.
• IBM Worklight Console.
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

53. Development Paths
• Cordova provides you two basic workflows to
create a mobile app
• Cross-platform (CLI) workflow
• Platform-centered workflow
Dr.T.Abirami, Department of IT ,
Kongu Engineering College

54. Getting Started with Development
Integrated Development Environment
– Java IDE like Eclipse or IntelliJ for Android
– Xcode for iOS
Mobile Platform SDK
Apache Cordova
Mobile Devices
– Recommended for deployment/testing
– Emulators are alternative but not a true test
Dr.T.Abirami, Department of IT ,
Kongu Engineering College