原生安卓使用cordova制作插件教程(一)

前言


写作目的:由于第一次接触制作插件过程,当中遇到很多问题不知道如何下手,写此教程也是为了给大家学习插件制作时,提供一些思路和解决方案, 也为了记录自己当初学习时出现的问题!



* l 使用工具如下:Android studio

* l 开发环境:基于Node.js

* l 使用插件:cordova 、plugman(生成插件工具)


第一步: 配置环境

请先去安装好Node.js,然后安装好cordova 如果不会安装请点击下面链接:http://cordova.axuer.com/

第二步:默认你已经完成第一步,接下来我们创建一个Cordova项目

创建项目的格式如下:

 cordova create [文件名] [包名]  

 比如: cordova create Demo com.senjoeson.demo 

第三步:添加你要生成哪个平台的插件

首先我们进入该cordova项目,比如 cd demo

注:如果你不知道当前有哪些平台,请执行cordova platform list

我这里就先默认添加我们安卓平台吧

  cordova platform add android

第四步:安装plugman插件并创建一个插件

安装很简单,就和安装cordova一样简单

npm install -g plugman

plugman create --name [名字]--plugin_id [包名] --plugin_version 1.0.0

plugman create --name TestPlugin --plugin_id com.senjoeson.test --plugin_version 1.0.0

创建插件的话 建议你不要创建在cordova项目中

我们可以进行cd .. 进行退回到上一级目录

第五步 编写生成插件中的安卓代码

我们打开插件目录中的src目录,发现目录是空的,这里我们需要手动添加android目录

然后创建一个java文件,在java文件中,必须指定一个入口去继承CordovaPlugin

当然也可以使用命令进行生产操作:(此命在插件根目录下执行哦)

plugman platform add --platform_name [platform]      //platform 只能写ios或者android

备注:插件就类似一个java程序,必须要有一个入口,当该入口被加载,才会去识别该程序的其他类或者方法等(本人是这么理解的!)

比如:

image.png

写到这里,我们插件的安卓代码已经完成了,但是插件目前还没有办法识别到我们写的java类和java方法,因此,我们需要在plugin.xml文件对我们写的东西进行声明

image.png

完成plugin.xml修改后,按理说 ,插件部分算是完成了对吧?但是别忘记了,我们还没有去配置package.json,也就是该插件信息,没有这个文件,我们添加插件时会出现错误的!

我们执行进入插件目录,执行 npm init

按照括号的提示写比如如下图,完成后,我们执行下一步。

image.png

第六步,添加插件到cordova项目并完成调用操作

  • 1.添加插件到cordova项目中

记住两个命令:添加和删除插件


cordova plugin add [插件路径]                   `添加是添加的插件路径`  

Cordova plugin remove [包名]                     ` 移除是插件的包名`

添加插件的原理(针对安卓):就是把我们自己做好的插件,添加到Android项目的assets目录中,因此每次修改了插件内容的话都需要移除并重新添加.

  • 2.完成调用操作

2.1 打开cordova项目,找到www/index.html, index.html是这个h5app的入口,我们可以在里面随便写一个按钮, 然后点击测试我们的插件是否被调用

image.png

2.2 经大家反馈, js方法直接写在index.html可能存在问题,因此提供一种新方法,解决兼容的问题

声明按钮.png
按钮事件.png

重点我们在插件的plugin.xml中声明的clobbers 两者一定要保持一致,否则一直会出现 无法“捕获到引用的错误” 错误。

配置JS引用组件名称.png

至此,教程完毕, 如果还有不懂的地方,欢迎大家留言给我,最后谢谢大家!
由于经常会用到一些命令,感觉输入很麻烦 , 所以自己做了一款桌面应用, 如果大家有兴趣,请前往下
CordovaHelp.jar下载我的应用,有能力的,可以自行编译哦. 如有不完善的地方, 可随时与我沟通.

附上我的邮箱,给我发邮件:senjoeson@foxmail.com如有任何问题,都可以联系我.

PS:很多朋友反馈说这个教程太过基础, 照着你上面写,并不能完全能够学会, 因此,后续我会加强版,通过手写一个插件重点讲一些需要注意的地方.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349

推荐阅读更多精彩内容

  • 开篇简言 我是一名前端工程师,刚刚完成了一个基于cordova的webapp,并且安卓和苹果双端都已上线,趁热写个...
    Lucy_Lucy阅读 5,918评论 6 18
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,807评论 25 707
  • 前言:用cordova开发hybrid app的过程中,由于是html5开发的app,在手机上很多权限受限制...
    京东内部优惠券阅读 5,346评论 5 65
  • 我真不忍心回首, 竟然又是一次离去, 可时光是如此的悄无声息。 昨晚,我们毫无睡意, 是谁发出欢快爽朗的笑语。 你...
    蓬年阅读 164评论 0 1
  • 跨年的第一天,本以为会元气满满,迎接新的一年,却不曾想却在床上躺了一天。之前对元旦做的计划全打水漂了,没有学习,没...
    郴暧姙阅读 149评论 0 0