Cordova 创建 Demo插件
小编:管理员 510阅读 2022.09.13
1. 创建基本插件
plugman create --name MyPluginName --plugin_id cordova-plugin-my --plugin_version 0.0.1复制
然后就会生成如下的文件内容,即下面的两个文件:
. ├── plugin.xml ├── src └── www └── MyPluginName.js复制
plugin.xml 清单文件,定义了插件的结构以及相关的设置。
复制MyPluginName
它定义了几个内容:
- plugin -- 命名空间、ID、版本
- name -- 名称
- js-module -- js文件地址,会被默认加载到首页面(index.html)。clobbers元素定义的内容将会被插入到window对象中
MyPluginName.js JavaScript接口,用于插件与混合应用的接口。
var exec = require('cordova/exec'); exports.coolMethod = function (arg0, success, error) { exec(success, error, 'MyPluginName', 'coolMethod', [arg0]); };复制
2. 添加安卓平台支持exports中创建了一个名为coolMethod的方法,然后cordova将调用对应平台的Native方法。
$ plugman platform add --platform_name android复制
它会在src目录下创建android文件夹, 并产生MyPluginName.java文件. 如果遇到包名出错的情况, 修改为你想要的包名即可. 它提供了原生功能和接口。
package com.abc.cordova; // 包名可能会出错 import org.apache.cordova.CordovaPlugin; import org.apache.cordova.CallbackContext; import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject; /** * This class echoes a string called from JavaScript. */ public class MyPluginName extends CordovaPlugin { @Override public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException { if (action.equals("coolMethod")) { String message = args.getString(0); this.coolMethod(message, callbackContext); return true; } return false; } private void coolMethod(String message, CallbackContext callbackContext) { if (message != null && message.length() > 0) { callbackContext.success(message); } else { callbackContext.error("Expected one non-empty string argument."); } } }复制
它也会更新你的plugin.xml配置文件, 适当修改后如下
复制3. 创建package.json, 否则无法 add 插件MyPluginName
plugman createpackagejson .复制4. 使用插件
cordova plugin add ../MyPluginName复制
由于我的项目MyApp 和 MyPluginName 属于同一级, 所以这样添加插件
5. 配置后可运行在www 下的index.html中添加按钮
复制然后再在 js/index.js 下新增
document.getElementById("testButton").addEventListener("click", wowawoziji); function wowawoziji() { // 注意clobbers中拿到的名称 和 js文件中配置的方法名要保持一致 cordova.plugins.MyPluginName.coolMethod('Hello , catch YOU!', function(success){ alert(success); }, function(error) { alert(error); }); }复制
最后, 一切完美
$ cordova run android复制
相关推荐
- Cordova 什么是Cordova? Cordova是用于使用HTML,CSS和JS构建移动应用的平台。我们可以认为Cordova是一个容器,用于将我们的网络应用程序与本机移动功能连接。默认情况下,Web应用程序不能使用本机移动功能。这就是Cordova进来的地方。它为网络应用和移动设备之间的连…
- 3DMAX提示和技巧 本主题标识使用 Civil View 的一些重要提示和技巧。常规使用屏幕分辨率至少为 1280x1024 的 Civil View。低于此分辨率时,一些面板将占用过多屏幕空间。 将视口设置为线框显示以达到最佳性能。 要尽可能简化用户界面,请在单个视口中工作并关闭 3ds Max 命令面…