View
 

PhoneGap Plugins

Page history last edited by Ari Lacenski 2 weeks, 6 days ago Saved with comment


 

Overview

PhoneGap has two components 

 

  1. PhoneGap JavaScript API which exposes native functionality to the JavaScript running in the browser (some kind of WebView)
  2. Platform-specific native code which is invoked from the PhoneGap JavaScript API

 

The PhoneGap core libraries are designed to handle common tasks supported by most devices:

 

  1. Access geolocation from the PhoneGap JavaScript API
  2. Access contacts from the PhoneGap JavaScript API
  3. Invoke a call

 

PhoneGap's API makes those common phone functions available to JavaScript.

 

Limitations

(Heavy Weight Lifting, Background Processing, Complex Business Logic)

 

Writing Javascript to do heavyweight data processing will typically be much slower than writing native code for the device and serving the results to a front-end. Also, if we want to do some background processing (e.g. background services in Android), Javascript cannot achieve it. Similarly, if we implementing a very Complex Business Functionality, a preference would be given to the native language.

 

Say for example, If you want to implement a DropBox client using PhoneGap. DropBox client does heavy weight lifting by being continuously in the background, listening for file changes and synching file changes. Such Operation can not be done by PhoneGap's APIs.

 

For such complex tasks, its best to delegate the responsibility to native code.

 

Solution

(Extend PhoneGap Framework)

 

The solution to go beyond is natural, do what PhoneGap did to expose the common Phone functionality to Browser code (Javascript). 

 

This is done in following manner

 

  1. Have a Custom Native Component. 
  2. Have a Custom Javascript API

 

Note this native component would be built for each platform you plan to support. All these native components needs to adhere to the Custom JavaScript API.

 

 

Overall Architecture

 

 

 

In order to write PhoneGap Plugin for each Platform, you have to write two components

 

  1. JavaScript Component, which will expose the Custom Native Component
  2. Native Component, which does the heavy lifting 

 

Catch about different Platforms

Before it comes as a surprise to you, let me clarify some things.

 

Say you are developing a PhoneGap Plugin for 2 platforms: iOS and Android.

One might assume that we need to churn out:

 

  1. A single JavaScript file that will be used on both iOS and Android
  2. One Java file for Android
  3. One .h and One .m for iOS

 

However, in reality you will need to churn out:

 

  1. One JavaScript file for Android, along with a Java file for Android
  2. A different JavaScript file for iOS, alone with pair of .h and .m file for iOS

 

Both JavaScript files can (and should) have the same interface for the developer who consumes it, but the implementations of each interface would be different.

 

How to Write Plugins for All Platforms?

 

 

Regardless of which platform you begin developing with, here are some things to keep in mind when designing your plugin:

 

PluginResult.execute() is your core native function

The JavaScript that you will write in your JS plugin will need to call Phonegap.exec(successCallback, failCallback, pluginName, action, [args]). That's a JavaScript function, found in phonegap-version.x.x.js (1.4.0 at the time of this writing), that expects a function named "execute" on the native plugin side.

 

Phonegap.exec() is your core JS function

If your plugin is very simple, it may only need to define one call to Phonegap.exec() on the JS side. However, it's perfectly acceptable to have many different Phonegap.exec() calls, possibly each with its own pair of success and error callbacks. At that point, it's a good idea to write your PhoneGap.execute() function to expect one of a variety of action arguments. 

 

How to Install Plugins for All Platforms?