`

phonegap android第一个demo程序,大家来学习

阅读更多

最近想学习一下手机上的web app开发,朋友推荐phonegap是一个很不错的跨平台开发框架,下面是初次使用的一些总结总结。

1、开发环境配置

系统要求可以具体参考:http://developer.android.com/sdk/requirements.html,下面是操作的具体步骤。

a、安装jdk,jdk是android sdk的安装基础。下载地址:http://www.oracle.com/technetwork/java/javase/downloads/java-se-jdk-7-download-432154.html。windows下推荐使用 jdk-7-windows-i586。

b、安装eclipse,需要3.4以上版本,下载地址:http://www.eclipse.org/downloads/download.php?file=/eclipse/downloads/drops/R-3.7-201106131736/eclipse-SDK-3.7-win32.zip。如果不想安装就使用eclipse classic版本。

c、安装android的SDK,下载地址:http://developer.android.com/sdk/installing.html

安装时需要记录sdk的安装目录,比如:C:\Program Files\Android\android-sdk,在eclipse中导入sdk时使用。导入方法:打开eclipse -> Window -> Preferences -> 选择 android -> 在SDK location填入SDK的安装目录。

注意:1)SDK的路径中不能有空格,可将“Program Files”替换成“PROGRA~1”。2)打开eclipse -> Window -> Android SDK and AVD Manager -> 选择合适的android版本,update all, 保证SDK安装完整。

e、下载安装 ADT Plugin,是一款Eclipse的插件,用于快速开发Android应用。

安装步骤:打开eclipse -> Help -> Install New Software -> add -> Name填ADT Plugin,Location填 https://dl-ssl.google.com/android/eclipse/ -> ok,安装完成后重启eclipse。

注意:如果安装时出现错误,请尝试将 https 改为 http 。

f、下载最新的phonegap稳定版本并解压,可在官方网站下载(www.phonegap.com)。这里使用的是1.1.0。

2、创建project

a、打开eclipse -> File -> New -> Project -> Andorid Project

b、填写项目信息,包括项目名称、选择系统版本(在这里使用的是Android 2.2),Package name等,填完之后finish就创建了一个基本的android应用程序。如下图:

c、创建AVD(android virtual device),为程序选择执行环境。

打开eclipse -> window -> Android SDK and AVD Manager,照下图进行创建:

注意:因为项目在创建时选择了Android2.2,所以选在AVD的target版本应该不能比2.2高。

此时右键选中项目根目录 -> Run as -> Android Application 执行会得到下面的效果:

d、导入phonegap框架

1)在根目录下建libs文件夹,将下载的phonegap解压后的android下的jar包(此处为phonegap-1.1.0.jar)拷到libs目录下。

2)在根目录下的assets目录下建www文件夹,将下载的phonegap解压后的android下的phonegap的js(此处为phonegap-1.1.0.js)拷贝到www目录下。

3)将下载的phonegap解压后的android下的xml文件夹拷贝到项目根目录的res文件夹下。

4)在www目录下建index.html,在html中引入phonegap的js,并调用phonegap的api做一些简单的事情(API的具体含义请参考官方网站),代码如下:

5)修改主程序FirstAppActivity.java,原来代码为:

修改后为:

此时会出现错误,是因为phonegap的jar包没有引入到build path中,右键点击libs -> Build Path -> Configure Path,如下图操作添加jar包到build path中。

6)修改AndroidManifnest.xml文件,将下面的内容添加到版本号的后面。

在activity 节点中添加 android:configChanges="orientation|keyboardHidden"。

7)此时执行,会得到如下基于phonegap的页面:

3、当项目搭建好后,就可以在index.html中使用js、html、css和phonegap的api创建和丰富自己的应用了,大功告成!

分享到:
评论

相关推荐

    PhoneGap环境搭建demo

    PhoneGap环境搭建是开发跨平台移动应用的第一步,这里我们将详细讲解如何进行PhoneGap的配置和安装。 1. **系统需求**:首先,你需要一个支持PhoneGap开发的计算机系统,通常要求是Windows、Mac OS或Linux。确保...

    PhoneGap-拍照上传DEMO

    通过这个DEMO,开发者可以学习到如何将PhoneGap的特性应用到实际项目中,理解如何结合JavaScript和设备API来实现复杂的移动功能。同时,这也提供了一个良好的起点,让开发者能够进一步探索更高级的PhoneGap应用开发...

    phonegap demo

    开发者通过学习这个demo,可以了解到如何在PhoneGap应用中引入第三方库,以及如何利用HTML5的Canvas元素和JavaScript来处理图像数据,实现类似360度全景图的效果。此外,还能了解如何调试和测试跨平台应用,以及如何...

    cordova-android-3.0.x.zip

    这个"cordova-android-3.0.x.zip"压缩包包含了针对Android平台的PhoneGap 3.0框架,同时也提供了测试相关的资源,使得开发者能够更好地理解和学习如何在Android设备上运行PhoneGap应用。 1. **PhoneGap 3.0 简介**...

    node.js 和HTML5开发本地桌面应用程序

    PhoneGap是一个广受欢迎的工具,它允许开发者使用HTML5、CSS3和JavaScript来构建跨平台的移动应用,包括Android和iOS。PhoneGap的一个关键优点是,开发的应用程序可以完全离线运行,就像本地安装的应用一样,这极...

Global site tag (gtag.js) - Google Analytics