十分钟开发一个调用Activity的PhoneGap插件

      在HybridApp开发中，很多业务我们是没有办法通过HTML5+js实现的，比如调用第三方的包含Activity的jar包，一些必须使用原生代码才能实现的功能，比如复杂的UI的效果，调用通讯相关的协议栈，第三方支付sdk等。这种情况我们需要通过写cordova插件的方式，包装android原生代码为插件，供上层javascript调用。本文讲解一个调用Activity并返回Activity结果的cordova插件例子，帮助大家掌握cordova plugin的开发 。

     Cordova插件是通过cordova plugin add （插件包名需要在cordova plugins官方注册，或插件代码存放的git地址）添加，通过cordova plugin rm 插件包名删除。一个插件主要文件包括插件配置文件plugin.xml，插件描述文件package.json，平台相关的资源和源码，可以包括图片，xml，java源码，jar包，so静态库等。下面是我做的android图案锁屏cordova插件的目录结构。

插件目录结构

     

       可以看到这个插件支持ios和android平台，包含源码和图片资源，还是挺复杂的。

       我们今天介绍的不会这么麻烦了，只是简单的调用Activity，先看config.xml

配置文件config.xml代码

<?xml version="1.0" encoding="UTF-8"?><plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"    id="com.qianmi.cordova.demoapp"    version="0.0.3">    <name>DemoPlugin</name>    <description>Qianmi <span style="font-family: Arial, Helvetica, sans-serif;">DemoPlugin </span><span style="font-family: Arial, Helvetica, sans-serif;"> Plugin</description></span>    <license>Apache 2.0</license>    <keywords>Qianmi,<span style="font-family: Arial, Helvetica, sans-serif;">DemoPlugin</span><span style="font-family: Arial, Helvetica, sans-serif;"></keywords></span>  <js-module src="www/demo.js" name="demo">    <clobbers target="cordova.plugins.demo" />    <!--js中调用的名字啊 -->  </js-module>       <!-- android -->    <platform name="android">        <config-file target="res/xml/config.xml" parent="/*">            <feature name="DemoApp">                <param name="android-package" value="com.qianmi.cordova.demoapp<span style="font-family: Arial, Helvetica, sans-serif;">" /></span>            </feature>        </config-file>           <source-file src="src/android/DemoApp.java" target-dir="src/com/qianmi/cordova/demoapp /></span>    </platform></plugin>

插件www/js的代码

var argscheck = require('cordova/argscheck'),    utils = require('cordova/utils'),    exec = require('cordova/exec');var DemoApp = function () {};//ExitApp<pre name="code" class="javascript">DemoApp<span style="font-family: Arial, Helvetica, sans-serif;">.exit = function () {</span>

console.log('----exit'); exec(null, null, "DemoApp", "demoAction", [null, null, null]);};module.exports = DemoApp;

插件java代码

     重点的插件java代码（只是示例啊，不完整的）给Activity传值，接受返回结果，回传给js都在这里了

public class LockPattern extends CordovaPlugin {private static final String TAG = "LockPattern";private static final String NICK_NAME = "nickName";private static final String MODE = "mode";public static final int REQUEST_CODE_SET_LOCK_PATTERN = 10001;public static final int REQUEST_CODE_VERIFY_LOCK_PATTERN = 10002; private CallbackContext mCallbackContext;@Overridepublic boolean execute(String action, JSONArray args,CallbackContext callbackContext) throws JSONException {Log.i(TAG, action + "   " + args);mCallbackContext = callbackContext;Intent intent = new Intent().setClass(cordova.getActivity(),LockPatternActivity.class);intent.putExtra(MODE, LockPatternActivity.MODE_STEP_1);intent.putExtra(NICK_NAME, nickName);this.cordova.startActivityForResult(this, intent,REQUEST_CODE_SET_LOCK_PATTERN);return false;}@Overridepublic void onActivityResult(int requestCode, int resultCode, Intent data) {Log.i(TAG, "---onActivityResult:" + requestCode + "   " + resultCode);switch (requestCode) {case REQUEST_CODE_SET_LOCK_PATTERN:if (Activity.RESULT_OK ==  resultCode && null != mCallbackContext) {mCallbackContext.success(LockPatternUtils.loadFromPreferences(cordova.getActivity()));}break;}}}

一个cordova 插件就这么简单，大家可以轻松的从js调用activity了