phonegap入门(一)honegap入门(一)phonegap入门(一)phonegap入门(一).pptVIP

PhoneGap入门（一） PhoneGap + win7 + Android /moban 目录 2. 新建PhoneGap工程 1.安装PhoneGap 3. 导入Eclipse的Android工程 4. 修改入口index.html文件 /moban 安装PhoneGap 旧版本 PhoneGap3以前，都是在网站下载 /moban 安装PhoneGap 前提 已经安装java sdk1.6以上 已经安装Android Development Tools 系统变量中的JAVA_HOME设置正确 系统变量中path包括： ADT\sdk\tools ADT\sdk\platform-tools JAVA_HOME\bin 安装好ant /moban 安装PhoneGap 安装Nodejs 下载地址：/ 一路Next 安装成功后，打开命令行，输入npm /moban 安装PhoneGap 2. 建立npm目录 出错后的办法，官方无说明。 进入“C:\Users\[用户名]\AppData\Roaming”目录 如果没有“npm”目录，则手工建一个“npm”目录 /moban 安装PhoneGap 3. 安装PhoneGap 命令行输入： npm install -g phonegap 安装成功后，输入命令：phonegap -version /moban 安装PhoneGap 4. 安装cordova 命令行输入： npm install -g cordova 安装成功后，输入命令：cordova -version 新建PhoneGap工程 命令行 cd C:\temp\newdemo ** 进入工作目录 phonegap create myApp ** 新建PhoneGap工程 cd myApp ** 进入工程目录 phonegap local run android ** 生成android工程 有“BUILD SUCCESSFUL”表示成功了。后面生成apk可能会错，错了也没关系。 导入Eclipse的Android工程 Eclipse导入工程 New …/ Project… / Android Project from Existing Code 导入Eclipse的Android工程 选择工程目录 两个工程都要选择 导入Eclipse的Android工程 运行“Hello World”工程 右键“Hello World”工程，选择“Run As”/“Android Application” (模拟器或者真机) 修改入口index.html文件 查看Hello World工程的目录 Eclipse工程的目录结构 文件夹的目录结构 www目录是好看的，不起作用。不信？跟我来 修改入口index.html文件 删除www目录下的“index.html”文件 选中工程，按“F5”键，刷新工程 菜单“Project” / “Clean…” 继续运行工程 页面还是出来了。 信了吧! 修改入口index.html文件 \myApp\platforms\android\assets\www 才是真命天子 \myApp\www 这个目录建议删掉，避免混淆视听 修改入口index.html文件 修改 \myApp\platforms\android\assets\www\index.html 菜单“Project” / “Clean…” 必须~~~ 运行工程 Index.html !DOCTYPE html html head meta charset=utf-8 / titleHello World/title /head body It is My App! /body /html Thank You 一辉课程 yihui823@163.com