Android+Cordova混合开发以及Cordova自定义插件
来源:互联网 发布:mac怎么移除桌面图标 编辑:程序博客网 时间:2024/06/01 10:16
请注明出处:http://blog.csdn.net/qq_23179075/article/details/77104276
Android+Cordova混合开发以及Cordova自定义插件
- AndroidCordova混合开发以及Cordova自定义插件
- 美女镇楼
- 一AndroidStudio中集成Cordova项目
- 创建Cordova项目
- 项目中添加Android平台
- AndroidStudio中导入Cordova项目
- 二自定义Cordova中的Android插件
- 安装plugmanCordova需要用这个来创建插件
- plugman安装完之后就可以创建一个插件了cordova plugin
- 创建完成后需要对pluginxml进行配置
- 编写Android原生功能类 MyToastjava文件
- 编写toast-pluginjs文件
- 通过npm创建Mudule
- 项目中添加自定义插件
- 完结自定义插件的使用
美女镇楼
一、AndroidStudio中集成Cordova项目
这里就直接跳过Cordova和NodeJs的安装
1.创建Cordova项目
- 命令:
cordova create [项目名] [包名]
- 例子:
cordova create Test com.sie.test.android
- 演示:
- 创建成功目录结构:
2.项目中添加Android平台
- 命令:
cordova platform add [平台名]
- 例子:
cordova platform add android
- 演示:
- 创建成功目录结构(Test/platforms):
- (Test/platforms/android)
3.AndroidStudio中导入Cordova项目
- 打开AndroidStuido
- 选择platforms/android文件夹
- 打开完成的目录结构
- 集成完成run一下,看看效果:
- OK 在AS中完成Cordova项目的集成
二、自定义Cordova中的Android插件
1.安装plugman,Cordova需要用这个来创建插件
- 命令:
npm install -g plugman
2.plugman安装完之后就可以创建一个插件了cordova plugin
- 命令:
plugman create --name [插件名] --plugin_id [插件ID] --plugin_version [插件版本号]
- 例子:
plugman create --name toast-plugin --plugin_id toast-plugin --plugin_version 1.0.0
- 演示:(随便找个目录)
- 创建完成后目录下就看到这个文件夹:
- 生成的插件的目录如下:
- 一个规范的Android插件的话,一般src目录下新建android目录,然后在android目录下新建类
- 目录如下:
3.创建完成后需要对plugin.xml进行配置
- 打开后的文件如下
<?xml version='1.0' encoding='utf-8'?><plugin id="toast-plugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android"> <name>toast-plugin</name> <js-module name="toast-plugin" src="www/toast-plugin.js"> <clobbers target="cordova.plugins.toast-plugin" /> </js-module></plugin>
- 添加Android平台配置后
<?xml version='1.0' encoding='utf-8'?><plugin id="toast-plugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android"> <name>toast-plugin</name> <js-module name="MyToast" src="www/toast-plugin.js"> <clobbers target="MyToast" /> </js-module> <!--添加我们自己的平台 --> <platform name="android"> <!-- 平台类型 --> <config-file target="res/xml/config.xml" parent="/*"> <feature name="MyToast"> <!-- JS调用时的前缀名字 --> <param name="android-package" value="org.apache.cordova.toast.MyToast"/> <!-- .java类名全路径 --> </feature> </config-file> <source-file src="src/android/MyToast.java" target-dir="src/org/apache/cordova/toast" /> <!-- src:java源文件的路径, target-dir:插件安装好后,源文件的位置,要和上面的包名对应 --> </platform> </plugin>
4.编写Android原生功能类 MyToast.java文件
- 因为原生类需要用到一些原生的Jar包和Cordova的一些类,所以我们可以现在AndroidStudio中先把这个 原生java文件写好在移动到插件目录下
package org.apache.cordova.toast;import android.widget.Toast;import org.apache.cordova.CallbackContext;import org.apache.cordova.CordovaArgs;import org.apache.cordova.CordovaPlugin;import org.json.JSONArray;import org.json.JSONException;/** * 时 间: 2017/8/12 * 作 者: 郑亮 * Q Q : 1023007219 */public class MyToast extends CordovaPlugin { @Override public boolean execute(String action, String rawArgs, CallbackContext callbackContext) throws JSONException { return super.execute(action, rawArgs, callbackContext); } @Override public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException { return super.execute(action, args, callbackContext); } @Override public boolean execute(String action, CordovaArgs args, CallbackContext callbackContext) throws JSONException { //showToast 是你在JS中调用的方法名; if (action.equals("showToast")){ //这里可以实现一些你的原生逻辑功能 Toast.makeText(cordova.getActivity(), args.getString(0), Toast.LENGTH_SHORT).show(); return true; } return false; }}
- 创建的MyToast类,需要承继CordovaPlugin,然后重写里面的三个方法,上面代码中已经体现了,这三个方法,如果你看了CordovaPlugin源码的话,会发现,其实最后都调用了第二个方法,但是CordovaArgs只是对JSONArray的一个封装,方便操作json数据而已,所以要重写哪个,按个人喜好。
- PS:将类移动到插件目录下时注意把包名改成 plugin.xml 配置的包名
5.编写toast-plugin.js文件
var exec = require('cordova/exec');/** * MyToast :是plugin.xml中配置的feature的nema * showToast: 是js中调用的方法名 */exports.showToast = function(arg0) { exec(null, null, "MyToast", "showToast", [arg0]);};
6.通过npm创建Mudule
- 进入插件目录,在控制台输入:
npm init
- 然后会提示你一些信息,我就一不一一解释了, 后面也可以再配置的:
- 完成后会在插件目录生成一个package.json 文件
- 还需要对package.json 进行一些Cordova信息的补全
- 每个属性是什么意思就自行查询了,我这里只是简单的配置
{ "name": "toast-plugin", "version": "1.0.0", "description": "这是一个Cordova的一个Andoird插件", "cordova": { "id": "toast-plugin", "platforms": [ "android" ] }, "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "郑亮", "license": "ISC"}
7.项目中添加自定义插件
- 到这里插件基本就配置完成,现在可以直接在项目添加了
- 进入Android平台的目录: Test\platforms\android
- 命令:
cordova plugin add F:\demo\Test\toast-plugin
- 添加成功后Android项目中会多出几个文件夹:
8.完结:自定义插件的使用
- 在Js中调用 注意要在index.js文件中的:
onDeviceReady: function ()
中调用
MyToast.showToast('你好!我是JS中调用的代码');
- 最后的效果:
请注明出处:http://blog.csdn.net/qq_23179075/article/details/77104276
阅读全文
0 0
- Android+Cordova混合开发以及Cordova自定义插件
- cordova开发自定义插件
- Cordova 开发自定义插件
- cordova开发自定义插件
- cordova开发自定义插件
- cordova开发自定义插件
- 自定义Cordova-Android插件
- (2)cordova android自定义插件开发
- Cordova自定义插件,解决Android混合开发向原生开发的过渡
- Cordova-Android 插件开发
- 混合开发-cordova打包Android
- Android Cordova 插件开发之Cordova安装
- Android Cordova 插件开发之Cordova安装
- Android Cordova 插件开发之Cordova安装
- Cordova 自定义插件(Android)
- Android Cordova 插件开发之编写自定义插件
- Android Cordova 插件开发之自定义插件生成安装包
- Android Cordova 插件开发之编写自定义插件
- 函数重载
- [分治] Codeforces#415 (Div. 1) 809A. Do you want a date?
- UVa10817 Headmaster's Headache
- (二)线段树入门--懒操作
- Aizu 1369 Distribution Center 模拟|签到
- Android+Cordova混合开发以及Cordova自定义插件
- python中模块和方法的查找
- iOS开发之产生随机浮点数
- antd mobile(一) 环境搭建
- 字符串函数之Strtok()函数
- window中cmd窗口最大化
- MinGW
- 静态成员和临时对象
- 英语学习-跳离思维误区