sencha touch下添加自定义cordova plugin的方法

首先，至于sencha touch和cordova环境的配置方法就不赘述了，可以查看官方API。

sencha 2.3.1Api：http://docs.sencha.com/touch/2.3.1/

cordova 3.3 Api：http://docs.phonegap.com/en/3.2.0/guide_cli_index.md.html#The%20Command-Line%20Interface;

创建一个Sencha touch  Android工程；

1.创建sencha APP工程

CMD切换到sencha touck的SDK目录下，执行sencha generate app Exemple0121 d:/example;

其中Exemple0121为你的工程名字， d：/example为保存工程的路径名字；

此时在D:/example下有了Exemple0121工程，目录下还木有cordova的配置项，

2.完成cordova平台初始化

a.切换到D:/example下执行sencha cordova init，完成cordova的初始化，

得到标准的cordova工程平台

b.配置android工程。

修改cordova的平台配置，找到sencha工程路径下的cordova.local.properties目录，用notepad++或者UE打开，

将默认的cordova.platforms=ios修改成你需要的，例如android平台改为，cordova.platforms=android；

切换到工程的cordova路径下，执行cordova platform add android;

c.生成android APP.

执行sencha app build native,执行成功以后会在cordova/platforms路径下生成android文件夹，这个就是需要的android工程了，可以通过eclipse导入工程，完整路径为:

D:\example\cordova\platforms\android。工程结果如下：

导入系统插件。

第一步，添加系统插件

首先插件的编写方法，不在赘述。

cordova插件的主要代码结构为：将插件的js代码放置在assets/www/plugins目录下，同时配置cordova-plugin.js申明js插件接口，然后将插件的java接口代码放置到src路径下，在manifext文件下申明java插件接口。

sencha touch下仍保留这种结构思想，但是构建方法稍有不同，我们先导入一个系统的插件作为样例，

将cmd切换到cordova目录下，执行cordova plugin add org.apache.cordova.console，添加系统插件console.

这时候在plugins目录下就可以看到console插件了，然后重新build工程，退回example路径执行sencha app build native;

第二步 创建自己的插件系统。

编写好自己的myplugin.java和myplugin.js两个文件，参见cordova自定义插件编写方法;将console的文件夹复制一份，改名为myplugin，文件夹下内容有：

在src/android/路径下添加插件java代码， myplugin.java代码如下：

package org.apache.cordova.myplugins;
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaPlugin;
import org.json.JSONArray;
import org.json.JSONException;

public class MyPlugin extends CordovaPlugin{

	private String TAG = "MyPlugin";

	//excute函数必须继承，其中action是js插件接口调用的java函数名称，args为需要传递的参数json数组。
	@Override
	public boolean execute(String action, JSONArray args,
			CallbackContext callbackContext) throws JSONException {
		// TODO Auto-generated method stub
		Log.d(TAG,"ACTION IS "+ action);
		return super.execute(action, args, callbackContext);
	}
	
}

在www/下添加插件js代码，myplugin.js的代码如下：

var exec = require('cordova/exec');
var MyExport = {};
	
	//具体的Export函数可以自行定义
	MyExport.handler = function() {
	}

	MyExport.handler.tojava = function(successCallback, errorCallback, options) {
		return exec(successCallback, errorCallback, "MyPlugin", "JScallAD", []);
		//MyPlugin为对应的Java接口名称；可以定义为任务字符，但需要与java接口的配置文件一致。
		//JScallAD为MyPlugin接口下对应的函数名称，即MyPlugin.java中excute下的action字符串；
		//successCallback为java端执行成功的回调，
		//errorCallback为java端执行错误的回调。
		//[]为需要传递的json字符串，即MyPlugin.java中excute下的args
		
	}
	module.exports = MyExport;

第三步，修改配置文件

a、修改插件js端配置参数，myplugin目录下的package.json文件修改为：

{
    "version": "0.1",//插件版本号
    "name": "org.apache.cordova.myplugin",//插件id
    "cordova_name": "MyPlugin",//插件在cordova下的名称，与myplugin.js中exec的接口名称，保持一致
    "description": "Cordova My Plugin",//修饰名称，意义暂不明，任意定
    "license": "Apache 2.0",//照抄
    "keywords": [
        "cordova",
        "myplugin"//添加一个自己插件的简称，意义暂不明，先与js接口名称保持一致
    ],
    "engines": []
}

b、修改build需要的配置文件，myplugin目录下的plugin.xml文件：

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

<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
           id="org.apache.cordova.myplugin"
			//插件id号，与package.json保持一致
			//版本号，与package.json保持一致
      version="0.1">

    <name>MyPlugin</name>//插件在cordova下的名称，与myplugin.js中exec的接口名称，保持一致
    <description>Cordova My Plugin</description>//插件描述，与package.json保持一致
    <license>Apache 2.0</license>
    <keywords>cordova,myplugin</keywords>//与package.json保持一致
    <repo>https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git</repo>
    <issue>https://issues.apache.org/jira/browse/CB/component/12320644</issue>

	//插件js接口文件配置信息，插件在android
	<js-module src="www/myplugin.js" name="myplugin">//src="www/myplugin.js"为已经写好的js文件路径，“myplugin”暂不明，与js中调用的类名保持一致
        <clobbers target="myplugin" />//插件在js中调用的类名，
    </js-module>
	
	//android平台配置信息
    <!-- android -->
    <platform name="android">
        <config-file target="res/xml/config.xml" parent="/*">
            <feature name="MyPlugin">//插件在java端的接口名称，与之前文件中的接口名称保持一致
                <param name="android-package" value="org.apache.cordova.Plugins.MyPlugin"/>//该插件接口对应的java代码路径
            </feature>   
        </config-file>
        
		//该插件需要的权限申明，根据需要自行定义
        <config-file target="AndroidManifest.xml" parent="/*">
            <uses-permission android:name="android.permission.RECORD_AUDIO" />
            <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
        </config-file>
		
		//源文件的路径和目标文件路径，src为已经编写好的java代码路径，target-dir为需要生成的android工程中该java源码路径，与上面的java代码路径保持一致
        <source-file src="src/android/MyPlugin.java" target-dir="src/org/apache/cordova/Plugins" />
        
    </platform>   

</plugin>

注：在真实工程案例中，请删除以上代码中的注释文字，以免出错

第四步，添加插件：

切换至example/cordova路径下执行：cordova  plugin add plugins/myplugin，如果配置没有错误，

重新Build工程，在example路径下执行：sencha app build native，插件配置OVER.

插件测试

在example路径下找到app.js文件，找到app启动入口函数，调用自定义插件的函数接口，myplugin.handler.tojava(null,null,null),

	launch: function() {
        // Destroy the #appLoadingIndicator element
        Ext.fly('appLoadingIndicator').destroy();

        // Initialize the main view
        Ext.Viewport.add(Ext.create('Exemple0121.view.Main'));
	myplugin.handler.tojava(null,null,null);
    },

重新sencha app build native工程，在eclipse中启动工程，app在启动后会调用tojava函数，执行

 exec(successCallback, errorCallback, "MyPlugin", "JScallAD", []);

会找到定义的MyPlugin接口，调用该接口下的excute（action，args）函数，启动的action为“JScallAD”，args为null,查看log如下

注意：cmd以sencha开头的都是在example路径下，以cordova开头的命令都是在example/cordova路径下，注意切换；

自己写的js插件代码和最终导入android工程的js代码有区别，功能内代码外部被

cordova.define("org.apache.cordova.myplugin.myplugin", function(require, exports, module) {...}包围，

注意在自己的js代码中不要添加，会造成redefine的异常。

刚接触sencha touch 和cordova，可能有地方理解不是很准确，还望指正.yangf426@126.com