Cordova for android || cordova基本使用以及自定义插件生成

环境准备
1、jdk安装
   环境变量设置:
   新建变量 名:JAVA_HOME    值(jdk安装的路径):C:\Program Files\Java\jdk1.8.0_51
2、Android SDK安装
   环境变量设置:
   新建变量 名:ANDROID_HOME    值(SDK的路径):D:\AS_SDK
3、gradle安装
   环境变量设置:
   在path变量末尾添加gradle的路径D:\Android Studio\gradle\gradle-4.1\bin
4、下载和安装Node.js (地址:https://nodejs.org/en/download/)
   安装完后:
   通过命令node --version  可查看nodejs版本;
   通过命令npm --version  可查看npm版本;
5、cordova安装
   命令行输入:npm install -g cordova
   通过命令cordova requirements检查必备的构建工具
6、创建cordova项目
cordova create cordovaProject  
7、进入创建的cordova项目根目录,添加android项目
cordova platform add android
8、打出apk
cordova build android

自定义插件生成方法一:命令生成

1、新建目录用于创建插件  => plugins ,进入新建的plugins目录打开命令行,创建插件
plugman create --name [插件名] --plugin_id [插件ID] --plugin_version [插件版本号]
plugman create --name MyPlugin --plugin_id pluginId-MyPlugin --plugin_version 1.0.0

2、打开www目录修改MyPlugi.js文件:MyPlugin为对于的java类名 toastShow为H5调用所使用的方法名

cordova.define("MyPluginTest", function(require, exports, module) {//MyPluginTest和cordova_plugin.js里面的id参数对应
var exec = require('cordova/exec');
exports.toastShow = function (arg0, success, error) {
    exec(success, error, 'MyPlugin', 'toastShow', [arg0]);//toastShow h5调用名、原生接收的action名   MyPlugin//java类名
};
});

3、进入插件目录MyPlugin生成java类
plugman platform add --platform_name android
4、创建package.json
npm init
5、进入cordova项目目录,导入插件
cordova plugin add E:\plugins\MyPlugin

完成后cordova_plugin.js文件自动添加配置

module.exports = [
       {
         "id": "MyPluginTest",  //对应MyPlugin.js里面的cordova.define的参数1
         "file": "plugins/com.test.MyPlugin/www/MyPlugin.js",  //MyPlugin.js文件路径
         "pluginId": "pluginId-MyPlugin", //对应metadata
         "clobbers": [
           "colin"//H5调用别名
         ]
       }
     ];
     module.exports.metadata = {
       "cordova-plugin-whitelist": "1.3.4",
       "pluginId-MyPlugin": "1.0.0"
     };

6、测试
  index文件添加一个按钮
 

  <input type="button" value="佛祖保佑" id='test'/>


   index.js添加事件
 

 document.getElementById("test").addEventListener("click",test);
    colin.toastShow("佛祖来了",function(msg){
              alert('原生返回了:'+msg);
              },function(e){
                  alert(e);
              });

 

自定义插件生成方法二:手动生成(备注:cordova3之后已经不支持此方式

1、 创建一个java类MyToast.java继承CordovaPlugin 重写execute
    

public class MyToast extends CordovaPlugin {
    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        System.out.println("action11 "+action);
        if(action.equals("showToast")){
            Toast.makeText(cordova.getActivity(),args.getString(0),Toast.LENGTH_SHORT).show();
            return true;
        }
        return super.execute(action, args, callbackContext);
    }
}


2、在assets的plugins里面新建MyToast.js文件
    

cordova.define("Toast", function(require, exports, module) {//Toast 随便起名,但在cordova_plugin.js要对应上
    var exec = require('cordova/exec');
    exports.toastShow = function (arg0, success, error) {
    exec(success, error, 'MyToast', 'toastShow', [arg0]);//MyToast java类名  toastShow h5调用名、原生接收的action名   
   };

});

3、编辑cordova_plugin.js文件
 

module.exports = [
       
       {
                "id": "Toast",//对应MyToast.js
                "file": "plugins/toast/MyToast.js",MyToast.js文件路径
                "pluginId": "pluginId-MyToast",
                "clobbers": [
                  "colinToast"//别名,随便写,H5调用的原生的开头名
                ]
              }
     ];
     module.exports.metadata = {
       "pluginId-MyToast": "1.0.0"

     };


     
4、编辑cofig.xml文件
    添加:
    

<feature name="MyToast">//MyToast随便写
        <param name="android-package" value="org.apache.cordova.toast.MyToast" />//value是MyToast.java的包名+类名
    </feature>


    
    
5、测试
   index文件添加一个按钮
 

 <input type="button" value="佛祖保佑" id='test'/>


   index.js添加事件

document.getElementById("test").addEventListener("click",test);
    colinToast.toastShow("佛祖来了",function(msg){
              alert('原生返回了:'+msg);
              },function(e){
                  alert(e);
              });
};

 

注意事项:检测config.xml配置的java类名路径是否正确!

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值