PhoneGap开发环境搭建以及第一个helloworld的创建
2014-05-26 11:57
585 查看
一、安装
在安装PhoneGap开发环境之前,需要先安装以下框架:
1.Java SDK
2.Eclipse
3.Android SDK
4.ADT Plugin
5.PhoneGap
说明:
1.PhoneGap包不用安装,直接解压.(注:phoneGap官网上面,有一个通过NodeJS安装phoneGap,详情请直接查看官网说明http://bbs.phonegapcn.com/thread-9713-1-1.html);
2.Eclipse 也是直接下载安装,建议为classic版的(如果嫌麻烦,或者以及继承好的,那么可直接使用);
二、第一个PhoneGap项目
1.在eclipse中新建Android Project
2.在项目的目录下,建两个文件夹:
/libs
/assets/www
3.进入将刚刚下载并解压的PhoneGap包里Anroid目录,我们需要的资源都在这个目录下。
将phonegap-x.x.x.js这个js文件(具体名称视当时下载的版本而定)copy到/assets/www目录下,
把phonegap.jar文件copy到/libs目录下。
再把xml目录copy到android项目的res目录下。
4.在/assets/www下建立index.html文件,
5.将以下权限配置的xml内容copy到AndroidManifest.xml文件中:
<supports-screens android:largeScreens="true"
android:normalScreens="true" android:smallScreens="true"
android:resizeable="true" android:anyDensity="true" />
<uses-permission android:name="android.permission.CAMERA" />
<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.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<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" />
6.在刚刚新建的Android Project中找到libs目录并在phonegap-x.x.x.jar上点击右键,选择 Build Path->Add to Build Path(这里直接使用了官网的图片)
7.最后再修改下src下的Java主文件:
1)添加import com.phonegap.*;
2)将类改成继承为DroidGap;
3)删掉import android.app.Activity;
4)把setContentView()这行替换为super.loadUrl("file:///android_asset/www/index.html");(注:如果在文件中,直接shift鼠标点击链接,是不能打开index.html的,刚开始自己就以为是写错了,因为一直找不到路径,后来直接把项目跑起来才看到了效果,给大家一个提醒好了)
5)最后看起来就像这样:
然后就可以试着运行一下,成功的话会出现Hello World的界面。
在安装PhoneGap开发环境之前,需要先安装以下框架:
1.Java SDK
2.Eclipse
3.Android SDK
4.ADT Plugin
5.PhoneGap
说明:
1.PhoneGap包不用安装,直接解压.(注:phoneGap官网上面,有一个通过NodeJS安装phoneGap,详情请直接查看官网说明http://bbs.phonegapcn.com/thread-9713-1-1.html);
2.Eclipse 也是直接下载安装,建议为classic版的(如果嫌麻烦,或者以及继承好的,那么可直接使用);
二、第一个PhoneGap项目
1.在eclipse中新建Android Project
2.在项目的目录下,建两个文件夹:
/libs
/assets/www
3.进入将刚刚下载并解压的PhoneGap包里Anroid目录,我们需要的资源都在这个目录下。
将phonegap-x.x.x.js这个js文件(具体名称视当时下载的版本而定)copy到/assets/www目录下,
把phonegap.jar文件copy到/libs目录下。
再把xml目录copy到android项目的res目录下。
4.在/assets/www下建立index.html文件,
5.将以下权限配置的xml内容copy到AndroidManifest.xml文件中:
<supports-screens android:largeScreens="true"
android:normalScreens="true" android:smallScreens="true"
android:resizeable="true" android:anyDensity="true" />
<uses-permission android:name="android.permission.CAMERA" />
<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.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<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" />
6.在刚刚新建的Android Project中找到libs目录并在phonegap-x.x.x.jar上点击右键,选择 Build Path->Add to Build Path(这里直接使用了官网的图片)
7.最后再修改下src下的Java主文件:
1)添加import com.phonegap.*;
2)将类改成继承为DroidGap;
3)删掉import android.app.Activity;
4)把setContentView()这行替换为super.loadUrl("file:///android_asset/www/index.html");(注:如果在文件中,直接shift鼠标点击链接,是不能打开index.html的,刚开始自己就以为是写错了,因为一直找不到路径,后来直接把项目跑起来才看到了效果,给大家一个提醒好了)
5)最后看起来就像这样:
然后就可以试着运行一下,成功的话会出现Hello World的界面。
相关文章推荐
- 【iOS-cocos2d游戏引擎开发之一】搭建cocos2d游戏引擎环境,创建第一个HelloWorld! 推荐
- 我的第一个phonegap开发WebApp的demo 怎么搭建安卓开发环境以及安装phonegap
- Linux下Java开发环境搭建以及第一个HelloWorld
- 【iOS-cocos2d游戏引擎开发之一】搭建cocos2d游戏引擎环境,创建第一个HelloWorld!
- 搭建Google App Engine开发环境以及创建第一个项目
- Android基础之用Eclipse搭建Android开发环境和创建第一个Android项目(Windows平台)
- PHP开发环境搭建 (XAMPP+Xdebug+netbeans,配置调试),创建第一个php项目
- 如何脱离SDK,使用DW5.5和phonegap以及JQMobile搭建开发环境
- Java开发环境的搭建以及使用eclipse创建项目
- Android基础之用Eclipse搭建Android开发环境和创建第一个Android项目(Windows平台)
- 【一】cocos2dx开发环境的搭建,第一个程序——HelloWorld
- Android开发 第一课 Mac系统上搭建开发环境,创建Helloworld程序
- Android基础之 用Eclipse搭建Android开发环境和创建第一个Android项目
- android开发环境搭建,创建helloworld程序
- [maven学习笔记]第一节,认识maven,搭建maven开发环境,写第一个HelloWorld
- Java开发环境的搭建以及使用eclipse从头一步步创建java项目
- Android基础之用Eclipse搭建Android开发环境和创建第一个Android项目(Windows平台)
- Mac系统下搭建Cocos2d-x开发环境及2.20以上版本如何创建HelloWorld
- 研究Android一——开发环境搭建以及HelloWorld
- C++学习笔记1C++开发环境搭建创建第一个项目Hello word!