Quantcast
Channel: CSDN博客移动开发推荐文章
Viewing all articles
Browse latest Browse all 5930

android混合开发:cordova的安装使用

$
0
0

1、什么是cordova

cordova是一个开源的移动开发框架,开发者可以使用html、css、js做跨平台开发,并且可以利用其提供的组件调用移动设备的硬件功能,如:传感器、拍照等。也就是说:cordova提供了js与原生的交互通道

cordova的前身是phonegap,是从phonegap剥离出来开源贡献给apache的,所以俩者的使用是完全相同的,只是phonegap提供了一下收费功能,如云发布。

本文以windows进行cordova安装调试,并默认您掌握了安卓开发技能,熟练使用android studio

2、安装cordova

  • 下载安装Node.js,下载对应的pc平台版本,因为cordova需要通过npm安装,所以Node.js必不可少。

  • 在windos上安装Cordova CLI开发工具,打开控制台执行以下命令行:

    C:>npm install -g cordova
    此时会自动下载安装,安装结束后输入cordova,如果出现帮助信息,说明您已成功安装Cordova CLI开发工具。

3、配置环境变量


  • jdk1.8安装及环境变量配置,请注意是jdk1.8
  • android sdk 环境变量配置,不配置将会无法编译
  • 配置完成后命令行输入一下命令验证是否成功:

C:>cordova requirements

4、新建项目

进入您需要存放项目的文件夹,输入命令行:

cordova creat hellowCordova com.yourname HellowCordova

其中hellowCordova是工程文件名名称,com.yourname是项目的包名,当然这个包名可以在配置文件里面修改,这个后期再说,HellowCordova是项目名称。

进入新建的项目文件:

cd:hellowCordova

添加安卓平台:

cordova platform add android –save

添加成功后,项目的platforms文件夹下将会生成android文件,这就是安卓端源码保存的地方。

编译项目:

cordova build

如果我们用的是as自带的sdk下载工具下载的adk,这一步会报找不到gradle wrapper,用sdk下载工具自行下载或者从以前es的sdk中拷贝指定文件过来就行,错误提示已经很明显了。

Error: Could not find gradle wrapper within Android SDK. Might need to update your Android SDK.
Looked here: D:\deleve_tools\sdk_as\tools\templates\gradle\wrapper

至此项目创建成功。

5、工程文件结构

工程文件结构

图为项目成功创建后的文件结构图,各文件功能如下:

  • hooks:存放自定义cordova命令的脚本
  • platforms:存放各个平台编译后的文件,注意每次build都会覆盖修改该目录下文件
  • plugins:存放插件的目录
  • www:存放html前端页面的源码路径
  • config.xml:配置文件

6、导入到android studio

打开as,导入项目platforms路径下的android文件,编译后的项目结构:
这里写图片描述

结构跟eclipse项目差不多,html页面资源保存于assets中(强烈建议不要修改www目录下的文件,每次cordova build后该文件会修改),src目录下的文件可以修改。这样我们就可以利用cordova进行混合开发了,将前端页面放到根文件的www中,编译项目,通过as开发native部分。

项目运行图:
这里写图片描述

作者:q649381130 发表于2017/4/13 16:59:31 原文链接
阅读:75 评论:0 查看评论

Viewing all articles
Browse latest Browse all 5930

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>