Cordova Custom Plugin, Plugman, commands for create plugin, plugin.xml, javascript, native interface

yotube
0

Plugman is use to create custom plugin, there is three main page of plugin plugin.xml, javascript code(www) and native code(src).


Install plugman

$ npm install -g plugman

# Create a plugin

$ plugman create --name HyperTrackWrapper --plugin_id cordova-plugin-hypertrack --plugin_version 0.1.0

# Setup platforms

$ cd HyperTrackWrapper

$ plugman platform add --platform_name ios

$ plugman platform add --platform_name android

# Create a package.json file for npm

$ plugman createpackagejson .


npm adduser

npm publish /path/to/your/plugin



The plugin repository must feature a top-level plugin.xml manifest file.

<?xml version="1.0" encoding="UTF-8"?>

<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"

       id="cordova-plugin-device" version="0.2.3">

   <name>Device</name>

   <description>Cordova Device Plugin</description>

   <license>Apache 2.0</license>

   <keywords>cordova,device</keywords>

   <js-module src="www/device.js" name="device">

       <clobbers target="device" />

   </js-module>

   <platform name="ios">

       <config-file target="config.xml" parent="/*">

           <feature name="Device">

               <param name="ios-package" value="CDVDevice"/>

           </feature>

       </config-file>

       <header-file src="src/ios/CDVDevice.h" />

       <source-file src="src/ios/CDVDevice.m" />

   </platform>

</plugin>


The top-level plugin tag's id attribute uses the same reverse domain format to identify the plugin package as the apps they're added to.

The js-module tag specifies the path to the common JavaScript interface.

The platform tag specifies a corresponding set of native code, for the ios platform in this case.

The config-file tag encapsulates a feature tag that is injected into the platform-specific config.xml file to make the platform aware of the additional code library.

The header-file and source-file tags specify the path to the library's component files.



The JavaScript Interface:-

The JavaScript interface provides the front-facing interface, making it perhaps the most important part of the plugin. You can structure your plugin's JavaScript however you like, but you need to call cordova.exec to communicate with the native platform, using the following syntax:


           cordova.exec(function(winParam) {},

            function(error) {},

            "service",

            "action",

            ["firstArgument", "secondArgument", 42, false]);


Here is how each parameter works:


function(winParam) {}: A success callback function. Assuming your exec call completes successfully, this function executes along with any parameters you pass to it.


function(error) {}: An error callback function. If the operation does not complete successfully, this function executes with an optional error parameter.


"service": The service name to call on the native side. This corresponds to a native class, for which more information is available in the native guides listed below.


"action": The action name to call on the native side. This generally corresponds to the native class method. See the native guides listed below.


[/* arguments */]: An array of arguments to pass into the native environment.

       window.echo = function(str, callback) {

           cordova.exec(callback, function(err) {

               callback('Nothing to echo.');

           }, "Echo", "echo", [str]);

       };


       window.echo("echome", function(echoValue) {

           alert(echoValue == "echome"); // should alert true.

       });




Native Interfaces:-

Once you define JavaScript for your plugin, you need to complement it with at least one native implementation.

Tags

Post a Comment

0Comments
Post a Comment (0)

#buttons=(Accept !) #days=(20)

Our website uses cookies to enhance your experience. Learn More
Accept !
To Top