Cordova

cordova 混合开发 本文章用android项目为例 ios 项目类似 添加平台不一样

环境安装

1.先安装Node.js

创建cordova项目

1.cordova create 目录名称 (包名) (app名称)
  如:cordova create testCordova io.cordova.hellocordova testCordova
2.添加平台
  cordova platforms add android
  移除android平台支持
  cordova platforms rm android
3.编译
  android平台： cordova build

编写自定义插件

需要命令 plugman npm install -g plugman
1.创建插件:
plugman create --name XXX--plugin_id XXX --plugin_version XXX

plugman create --name CustomToast --plugin_id io.cordova.hellocordova.customToast --plugin_version 1.0.0

2.进入到插件目录 添加平台

plugman platform add --platform_name android

3.修改插件配置文件plugin.xml(可以不修改 根据需要修改)

     
    CustomToast
     
    
        
    
    
        
            
             
                
            
        
         
        
             
        
    

3.生成package.json 文件
npm init
插件生成完成。
4.添加到项目中
进入到项目android平台下执行：
cordova plugin add XXX (插件路径)

cordova plugin add D:\cordovaWorkplace\plugins\CustomToast 

注意：
cordova plugin list  查看项目添加的插件
cordova plugin rm XX(插件id) 删除某个插件
cordova plugin add   添加插件

完毕：
可在项目中查看对应的 配置文件变化
res/xml/config.xml文件

    ...
    ...
    
     
        
    

assets/www/cordova_plugins.js

cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [
    ...
    ...
    ,
  {
    "id": "io.cordova.hellocordova.customToast.CustomToast",
    "file": "plugins/io.cordova.hellocordova.customToast/www/CustomToast.js",
    "pluginId": "io.cordova.hellocordova.customToast",
    "clobbers": [
      "cordova.plugins.CustomToast"
    ]
  }
];
module.exports.metadata = 
// TOP OF METADATA
{
  "cordova-plugin-whitelist": "1.3.3",
  "io.cordova.hellocordova.customToast": "1.0.0"
    ...
    ...
};
// BOTTOM OF METADATA
});

测试

在android项目中
assets/www/index.html中添加按钮 编写对应的js事件:
如:在body中添加

...
...
CustomToast
...
...

运行代码 点击按钮:

device-2018-06-09-152750.png