锐客网

  1. 首页 > 睿知 > it技术 > >

有关Cordova（更新）

事先声明 本文不是教程
前言&需求分析 由于华理杯电子商务大赛的意外获得了校内特等奖，要接下来参加六月的市赛，因此作为技术“顾问”的本人最近被要求做APP。
然本人只有过硬的PHP全站开发经验和少许JS（主要jquery）尝鲜，再加上egg pain的JAVA完全不会【因为是只求了我Android版】，因此想到了大一上时关注的跨平台开发，决定尝试一下。
有关选择跨平台开发我也是考虑良久的。首先众所周知跨平台往往是采取了类似网页的项目架构来保证不同机型的适配，而网页正是我所擅长的；再者我们的项目为一个 ** 为电动汽车车主提供的更方便地寻找与获取周围充电桩信息的充电桩信息集合APP **，而此类APP对系统要求较小，跨平台开发完全可以满足；最后个人决定依存于百度地图提供的LBS服务来实现，而百度也提供了对应的JS的Api（虽然不如Android和iOS的SDK强大但已满足需求）。
也不是说国内的wex5,apicloud,appcan就是辣鸡。个人在大一试用了这些国产之后对它们并不抱有好感。而react native个人感觉这个纯 js的网页制作挺难立即适应。最后我选择了Cordova(phonegap)
主角出场 先安装nodejs，然后在命令行中使用npm install -g cordova来安装cordova
【nodejs我这里是下载最新6.0】
【-g表示全局安装（global），勿忘】
起步 总而言之我开始做我的Cordova APP了
首先创建项目
cd ~
cordova create powerpump com.ecustcic.powerpump powerpump
这里就把PowerPump能量帮这个项目构建成功了我们可以cd powerpump来进去项目文件夹进行进一步cordova操作
然后通过cordova platform add android browser来添加安卓和浏览器两个平台的支持。【browser可以方便我没带Android手机时调试，毕竟系统里都有浏览器不是嘛2333】
由于我还没根据那群女生的设计读懂程序具体功能，所以先不添加plugin了。
根据官网的教程显示我们的安卓调试是需要*安装jdk ** ， ** 安装Android SDK ** ，然后 ** 添加jdk和Android SDK的安装地址到path **
这里要提一下最新cordova是用sdk 23.01，建议23.都安装上【也就是最新版的各个小版本】。
现在把Android手机插上装好驱动就可以通过在项目文件夹里命令行输入cordova run android来测试这个HelloWorld程序。
【用浏览器测试就是用cordova run browser】
设计 接下来就是根据产品设计原型来制作对应的网页版
本人大致上浏览了主流的JS的UI库，根据我们队伍除了我一个程序员以外的四位产品经理的设计，我选择了风格大致相近的SUI Mobile。

有关Cordova（更新）
文章图片
这就是本队情况 所以本质就是Zepto+Cordova了 【SUI Mobile基于Zepto
根据SUI Mobile给我们的组件我们可以很快的完成
简单一说，为了实现更方便的交互，我又增加了Angular。。。感觉这下就有点乱糟糟的。又由于过了市赛我决定重构一下。
市赛找了兼职的美工，用了Ionic Framework，整体上更加好看了，而且有了iPhone和Android平台不同的样式，但是——在低端机上相当卡，中高端机体验完美。
后来拿了全国一等奖，最近拿这个参加其他比赛，又忍不住想重构，于是开始学习React-Native。
不管是哪个平台，React-Native都相当流畅，但是对于一个原生Js写习惯的总觉得React不习惯……
【有关Cordova（更新）】而且很多React-Native插件啥的都结合了Android或iOS底层Api，没法像Cordova add plugin那样省力，个人觉得其实并没有大幅度加快开发速度。

    推荐阅读


    上一篇：你只记住了她的大嘴，却没看见她的时尚

    下一篇：PPP模式中政府部门的支持措施