phonegap(cordova) 入门 1---- 通过这种方式先理解phonegap(cordova) 开发方式

建议在没有使用命令行安装之前,先通过本人的这篇文章看看插件是如何配置的,之后再使用命令行创建项目增加官方插件,搞清楚了插件机制极大的有利于后面的插件自定义和编辑,如有问题欢迎咨询,如能解决一定帮助,为了减少颈椎病共同努力

作为web程序员使用 phonegap(cordova)无疑是个很好的解决办法,但官网文档大都基于开源工具在线安装(毕竟人家都带着 apache嘛,可以理解,毕竟他们才是技术的创造者。。),但对于 web 部分程序员(习惯window 开发的那部分 )来说,这种方式看着好复杂(其实确实有点复杂,比如 node.js,比如 git,而且还有版本问题),经过搜索也有下载之后直接搭建的项目,但只是跑到index.html 就完结了,对于 cordova 的插件机制未做说明,那么今天写一下 window下搭建phonegap(cordova)开发环境,并使用官网文档所说的插件

搭建之前,先说一下 phonegap和 cordova 的关系,搜索得知,phoneGap是原先的名字,Cordova是phoneGap被捐给apache之后用的项目名,phoneGap的名字也被保留了,目前 phonegap 官网还有在线打包的功能使用的adobe帐号(但撞墙,你懂的,基本无法上传)

我是直接使用的cordova ,下面进行搭建环境

第一步,搭建一般的android 开发环境

  1--jdk

2--adt (包含 开发工具 和 sdk )

                3--打开下载的 adt 时指定 jdk 和 sdk路径

        如有问题,请具体搜索,这个环境就不多说了

第二步,整合 cordova 

                1--http://cordova.apache.org/ 下载 cordova的源码

                 打开里面的结构如下图



解压其中的画线部分,结构如下图:


这部分就是 cordova的源码

接下来我们新建一个 android 项目 ,起个名,比如叫 CordovaCode ,并将 framework 导入,如下图


将其中的 源码导出成jar包,如下图



现在可以新建 你将来的 手机项目了,因为我们已经拿到了 cordova 的jar包 ,起个华丽的项目名,比如 OurPhone

然后将 刚才拿到的 cordova 的jar包,我这里叫(ourphone.jar)复制到 libs 下 如下图,并且 build path一下(这个得知道怎么做吧,右键一下找找,有java 基础的应该知道)


在assets 中新建 www 目录 ,并添加 index.html(这里就是我们web 程序员的 用武之地)并将 cordova 源码文件中的 cordova.js 放到这里

在 index.html 写个神奇的HelloWorld 吧,如下图



然后将 src 中 的默认MainActivity (可能你已重命名)修改为如下





然后将 cordova 源码中的 res/xml 整个复制到 我们项目中的 res下,如下图


最后给android 授权,在AndroidManifest.xml文件中 添加 ,

<uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <uses-permission android:name="android.permission.RECEIVE_SMS" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.RECORD_VIDEO" />
    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
    <uses-permission android:name="android.permission.READ_CONTACTS" />
    <uses-permission android:name="android.permission.WRITE_CONTACTS" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.GET_ACCOUNTS" />
    <uses-permission android:name="android.permission.BROADCAST_STICKY" />


位置如下图



ok,燥起来吧,董小姐,运行一下(添加 模拟器的步骤就不讲了,直接看结果了),如下图



ok, html 已经跑起来了,接下来我们跑 api 了


还是说官网下插件总喜欢用他们的开源工具兄弟,那么我们这里直接下载下来 官网的插件源码,放到我们项目中其实一样的哈

下载插件源码可以从这里 点击打开链接(其实就是 普通的java类)

插件目录结构如下图:


如何将插件放到我们项目中,

1--将 src 中的 org 放到我们项目中的src 如图


2--对应的js 也放好,因为我们是web,程序员,呵呵



同样这里也添加要使用的插件,如下图


ok,又可以燥起来了,使用 个device  试试看,如下图 index.html 


看看效果

ok,到此结束,其他官网插件使用,和自定义开发都是这个步骤


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值