在 《Cordova webapp实战开发:(4)Android环境搭建》中我们搭建好了开发环境,也给大家布置了调用插件的预习作业,做得如何了呢?今天我们来学一下如何自己从头建立一个Andorid下的cordova插件。

本次练习你能学到的

  1. 学习如何实现Android下自动更新功能
  2. 学习Android下插件类的编写
  3. 学习Android下插件的配置
  4. 学习Android下插件的调用

主要内容

  • 打开APP后检查版本更新,如果有更新则弹出更新对话框

  • APP中【检查更新】显示当前版本号,并可以点击进行版本检查更新

如何实现自动更新功能

你可以自己写代码,也可以网上找代码抄一下,我之前的 敏捷个人APP 就是从网上下的一个代码片段放进我的项目中的。不过今天和大家说的不是如何编写自动更新代码,因为我们今天要做的是如何更快的用别人写好的东西来加速自己产品开发的进度和质量。

自动更新这个东西也不涉及到什么技术难度,一般第三方要是提供了也不会出什么质量问题,能够拿来就用岂不是很好呢?网上找了一下,发现 友盟提供自动更新

很好,那就直接用这个吧,Andorid和iOS都可以用。

如何集成到我们的产品中,看他们自己写的文档:自动更新android文档 ,我就不多说了,如果遇到问题,可以在咱们群里问问大家。

插件类的编写

原生Andorid中如果调用,就看上面说的他们自己写的文档。如果我们现在要在APP中【设置】中增加自动检查和显示当前版本,则需要我们开始学习如何编写cordova插件了。

这里我们会编写一个插件,两个方法,一个方法用来检测更新,另一个方法用来获得当前APP的版本号。

闲话不说了,直接来代码。

public class GCAppPlugin extends CordovaPlugin {

    @Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
if ("version".equals(action)) {
version(callbackContext);
return true;
}
else if ("checkUpdate".equals(action)) {
final Context mContext = this.cordova.getActivity();
UmengUpdateAgent.setUpdateAutoPopup(false);
UmengUpdateAgent.setUpdateListener(new UmengUpdateListener() {
@Override
public void onUpdateReturned(int updateStatus, UpdateResponse updateInfo) {
switch (updateStatus) {
case UpdateStatus.Yes: // has update
UmengUpdateAgent.showUpdateDialog(mContext, updateInfo);
break;
case UpdateStatus.No: // has no update
Toast.makeText(mContext, "现在使用的已是最新版本了", Toast.LENGTH_SHORT).show();
break;
case UpdateStatus.NoneWifi: // none wifi
Toast.makeText(mContext, "没有wifi连接, 只在wifi下更新", Toast.LENGTH_SHORT).show();
break;
case UpdateStatus.Timeout: // time out
Toast.makeText(mContext, "超时", Toast.LENGTH_SHORT).show();
break;
}
}
});
UmengUpdateAgent.forceUpdate(mContext);
return true;
}
} private synchronized void version(CallbackContext callbackContext) {
  PackageInfo packInfo;
  try {
    packInfo = this.cordova.getActivity().getPackageManager().getPackageInfo(this.cordova.getActivity().getPackageName(),0);
    String version = packInfo.versionName +"("+packInfo.versionCode+")";
    callbackContext.sendPluginResult(new PluginResult(PluginResult.Status.OK, version));
  } catch (NameNotFoundException e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
  }
}

Javascript如何得到插件调用后的返回结果?主要通过类似 callbackContext.sendPluginResult(new PluginResult(PluginResult.Status.OK, version)); 代码返回PluginResult,失败和成功都可以触发Javascript执行对应的自定义函数

插件的配置

插件写完了,很多人遇到的下一个问题就是怎么配置才能在Javascript中调用呢?我们今天也不解析源码,为什么呢?因为我没看:)不过,我一定要给大家说清楚如何配置,否则就永远调用不了插件。

打开res/xml/config.xml文件,添加feature,必须匹配类名,因为源码中是通过这些去配对的。上面我们写了更新插件,现在就是要配置一下这个插件类到功能名称,我在配置文件中加入了下文粗体部分内容

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.glodon.gcapp" version="2.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>掌中广材</name>
<description> 随时随地查找全国最完整最及时的信息价 </description>
<author email="22626496@qq.com" href="http://www.中国信息价.cn"> 周金根 </author>
<content src="html/scj/scj.html" />
<access origin="*" />
<access origin="tel:*" launch-external="yes"/>
<access origin="geo:*" launch-external="yes"/>
<access origin="mailto:*" launch-external="yes"/>
<access origin="sms:*" launch-external="yes"/>
<access origin="market:*" launch-external="yes"/> <preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="30000" />
<preference name="SplashMaintainAspectRatio" value="false" />
<preference name="LoadingDialog" value="正在加载中..." /> <feature name="Device">
<param name="android-package" value="org.apache.cordova.device.Device" />
</feature>
<feature name="NetworkStatus">
<param name="android-package" value="org.apache.cordova.networkinformation.NetworkManager" />
</feature>
<feature name="SplashScreen">
<param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />
</feature>
<feature name="Camera">
<param name="android-package" value="org.apache.cordova.camera.CameraLauncher" />
</feature>
<feature name="BarcodeScanner">
<param name="android-package" value="com.phonegap.plugins.barcodescanner.BarcodeScanner" />
</feature>
<feature name="Gcapp">
<param name="android-package" value="com.gldjc.guangcaiclient.GCAppPlugin" />
</feature>
</widget>

代码贴完了,我还是要再多说一下,

  • com.gldjc.guangcaiclient.GCAppPlugin  是插件类的全面
  • Gcapp是 feature 名称,下面大家就知道在哪里会用到了

以上文件就是告诉cordova,我们新增了一个Gcapp功能,这个功能会调用我们的原生插件Java对象,接下来就是Javascript如何能调用到这个类了,最重要的就是这个Gcapp功能名称。

我们接着就要写Javascript代码来调用这个功能了,如何写呢?继续往下看,我在assets/www/plugins/下新增目录并建立了文件gcapp.js,完整路径是 assets/www/plugins/com.gldjc.guangcaiclient/www/gcapp.js,代码如下:

cordova.define('com.gldjc.guangcaiclient.gcapp', function(require, exports, module) {
var exec = require("cordova/exec"); function Gcapp() {}; Gcapp.prototype.version = function (getversion) {
exec(getversion, null, 'Gcapp', 'version', []);
};    Gcapp.prototype.checkUpdate = function () {
exec(null, null, 'Gcapp', 'checkUpdate', []);
}; var gcapp = new Gcapp();
module.exports = gcapp;
});

exec是cordova.js中内部的函数,当插件返回 PluginResult.Status.OK 时会执行exec的成功回调函数,如果插件返回的是错误,则会执行exec的错误回调函数。这里我们解释一下

 exec(null, null, 'Gcapp', 'checkUpdate', []);

其中Gcapp就是我们在上一步骤加的feature名称,大小写匹配着写,通过这个名称,cordova才能找到调用那个java插件类,然后通过checkUpdate知道调用这个插件类的哪个方法,后面[]中则是参数。因为我这个插件不需要参数,所以为空。

Javascript插件类也配对成功了,那如何调用呢?你可以直接在html中包括这个js,不过我们一般会再配置一个js,那就是assets/www/cordova_plugins.js,这样就不用对每个插件类都去写一遍了,cordova会遍历你的配置去加载它们。

cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [
{
"file": "plugins/org.apache.cordova.device/www/device.js",
"id": "org.apache.cordova.device.device",
"clobbers": [
"device"
]
},
{
"file": "plugins/org.apache.cordova.networkinformation/www/network.js",
"id": "org.apache.cordova.networkinformation.network",
"clobbers": [
"navigator.connection",
"navigator.network.connection"
]
},
{
"file": "plugins/org.apache.cordova.networkinformation/www/Connection.js",
"id": "org.apache.cordova.networkinformation.Connection",
"clobbers": [
"Connection"
]
},
{
"file": "plugins/org.apache.cordova.splashscreen/www/splashscreen.js",
"id": "org.apache.cordova.splashscreen",
"clobbers": [
"navigator.splashscreen"
]
},
{
"file" : "plugins/org.apache.cordova.camera/www/CameraConstants.js",
"id" : "org.apache.cordova.camera.Camera",
"clobbers" : [ "Camera" ]
},
{
"file" : "plugins/org.apache.cordova.camera/www/CameraPopoverOptions.js",
"id" : "org.apache.cordova.camera.CameraPopoverOptions",
"clobbers" : [ "CameraPopoverOptions" ]
},
{
"file" : "plugins/org.apache.cordova.camera/www/Camera.js",
"id" : "org.apache.cordova.camera.camera",
"clobbers" : [ "navigator.camera" ]
},
{
"file" : "plugins/org.apache.cordova.camera/www/CameraPopoverHandle.js",
"id" : "org.apache.cordova.camera.CameraPopoverHandle",
"clobbers" : [ "CameraPopoverHandle" ]
},
{
"file" : "plugins/com.phonegap.plugins.barcodescanner/www/barcodescanner.js",
"id" : "com.phonegap.plugins.barcodescanner.barcodescanner",
"clobbers" : [ "barcodescanner" ]
},
{
"file": "plugins/com.gldjc.guangcaiclient/www/gcapp.js",
"id": "com.gldjc.guangcaiclient.gcapp",
"clobbers": [
"gcapp"

]
}

];
module.exports.metadata =
// TOP OF METADATA
{
"org.apache.cordova.device": "0.2.13"
}
// BOTTOM OF METADATA
});

file表示我们去哪里找脚本插件定义js,id是之前我们在gcapp.js中开头cordova.define中写的标识,cordova通过这个标志去找到我们的Javascript插件定义,而clobbers则是我们在前端通过什么对象名来调用这个插件。这里我写的是gcapp,则后面调用则只需要写成gcapp.checkUpdate 即可

插件的调用

万事俱备,只欠东风,你们可以开始看到结果了,如果从头到这里一步成功,那应该还是蛮兴奋的事情吧。

具体前端页面如何设计我就不说了,我的页面效果就如本文最前面的图片,在js中我是这些调用version的,至于checkUpdate就是一样了,在按钮的click事件中调用 gcapp.checkUpdate(); 即可

$(document).on("PG_pageinit", function(event) {
gcapp.version(function(version){
$("#version").html(version);
});
});

PhoneGap App开发 477842664  

Cordova webapp实战开发:(5)如何写一个Andorid下自动更新的插件?的更多相关文章

  1. Cordova webapp实战开发:(6)如何写一个iOS下获取APP版本号的插件?

    上一篇我们学习了如何写一个Andorid下自动更新的插件,我想还有一部分看本系列blog的开发人员希望学习在iOS下如何做插件的吧,那么今天你就可以来看看这篇文字了. 本次练习你能学到的 学习如何获取 ...

  2. Cordova webapp实战开发:(7)如何通过简单的方法做到,不重新发布APP来修复bug、增加功能、或者躲开苹果的一些严格审核?

    到<Cordova webapp实战开发:(6)如何写一个iOS下获取APP版本号的插件?>为止,我们已经大体学会了如何使用Cordova了,那些都是使用Cordova的开发者必备的技能. ...

  3. Cordova webapp实战开发:(4)Android环境搭建

    在<Cordova webapp实战开发:(3)后面可能会学到的东西>中我们说了一下后续大致包括的内容,今天我们继续.上周我在掌中广材集成了友盟的社交分享,今天想集成iOS应该很顺利的,但 ...

  4. Cordova webapp实战开发:(3)后面可能会学到的东西

    在<Cordova webapp实战开发:(2)认识一下Cordova>中我们了解了Cordova和Phonegap的关系,并简要介绍了一下它的架构,以及多平台性,并给大家留了一些作业.我 ...

  5. Cordova webapp实战开发:(2)认识一下Cordova

    昨天写了第一篇 <Cordova webapp实战开发:(1)为什么选择 Cordova webapp?>,意料中看到大家对这个主题的兴趣,我新建的PhoneGap App开发 34819 ...

  6. Cordova webapp实战开发:(1)为什么选择 Cordova webapp?

    很长时间没有专注写代码了,即使写点代码也主要是写写敏捷个人app,这个App主体内容是我用了一周的时间,使用PhoneGap+JQueryMobile搭建的,之所以会比较快的完成,是因为11年我在做建 ...

  7. Cordova webapp实战开发(20161207 )

    http://www.cnblogs.com/zhoujg/archive/2015/05/28/4534932.html 1.https://www.jetbrains.com/idea/downl ...

  8. Python+Flask+Gunicorn 项目实战(一) 从零开始,写一个Markdown解析器 —— 初体验

    (一)前言 在开始学习之前,你需要确保你对Python, JavaScript, HTML, Markdown语法有非常基础的了解.项目的源码你可以在 https://github.com/zhu-y ...

  9. 如何手动写一个Python脚本自动爬取Bilibili小视频

    如何手动写一个Python脚本自动爬取Bilibili小视频 国庆结束之余,某个不务正业的码农不好好干活,在B站瞎逛着,毕竟国庆嘛,还让不让人休息了诶-- 我身边的很多小伙伴们在朋友圈里面晒着出去游玩 ...

随机推荐

  1. oracle建立数据库连接

    除了全库拷贝,这个应该是oracle两个数据库之间进行数据迁移最快的方法了. CREATE PUBLIC DATABASE LINK zhengshi CONNECT TO 用户名 IDENTIFIE ...

  2. 使用NHibernate实现存储库

    ORM框架不是存储库.存储库是一种架构模式,而ORM是将数据模型表示成对象模型的一种手段. 存储库可以使用ORM来协助充当领域模型和数据模型之间的中介. NHibernate允许在不损坏或只少量损坏领 ...

  3. 浅谈ERP系统实施后如何完善企业内部控制制度建设

    ERP与企业内部控制制度,前者提升企业的管理水平,后者为企业发展保驾护航,两项工作都是企业各项工作的重中之重. ERP是企业资源规划Enterprise Resource Planning的缩写.企业 ...

  4. css样式被覆盖解决方案

    刚才写zenktodo的时候,通过动态添加class的方式修改一个div的样式,总是不起作用. #navigator { height: 100%; width: 200; position: abs ...

  5. .net如何自定义config配置文件节点

    本文转载:http://www.cnblogs.com/lori/archive/2013/04/03/2997617.html 对于小型项目来说,配置信息可以通过appSettings进行配置,而如 ...

  6. 【亲测可用】MySQL 4.1迁移到MySQL 5.0版本的中文乱码问题解决

    核心:先导出结构,再导出数据. 结构最好使用myphpadmin导出.使用mysqldump导出的可能会导致一些问题. ---------------以下为转载---------------- 在生成 ...

  7. ImageMagick提取图像原始数据(ImageData/RawData)

    我用的是ImageMagickWand的接口,因为这接口比Core接口更上层,所以官方文档推荐用. 抽取整个图像文件字节数据: http://www.imagemagick.org/discourse ...

  8. xsqlbuilder使用说明

    动态构造sql的利器:rapid-xsqlbuider详细说明 特性列表: 动态构造sql条件语句,提供sql拼接与使用占位符两种方式 数据类型的修饰 对SQL注入攻击的防范 问题: 手工构造SQL语 ...

  9. mis 系统的开发具备的条件

    MIS的开发方式有自行开发.委托开发.联合开发.购买现成软件包进行二次开发几种形式.一般来说根据企业的技术力量.资源及外部环境而定. 补充: 管理信息系统的开发策略不可行的开发方法:组织结构法,机械的 ...

  10. PCA主成份分析

    1   背景介绍 真实的训练数据总是存在各种各样的问题: 1. 比如拿到一个汽车的样本,里面既有以“千米/每小时”度量的最大速度特征,也有“英里/小时”的最大速度特征,显然这两个特征有一个多余. 2. ...