跨平台移动应用开发框架的探索PhoneGap.docx
- 文档编号:11496882
- 上传时间:2023-03-02
- 格式:DOCX
- 页数:18
- 大小:320.28KB
跨平台移动应用开发框架的探索PhoneGap.docx
《跨平台移动应用开发框架的探索PhoneGap.docx》由会员分享,可在线阅读,更多相关《跨平台移动应用开发框架的探索PhoneGap.docx(18页珍藏版)》请在冰豆网上搜索。
跨平台移动应用开发框架的探索PhoneGap
关于跨平台移动应用开发框架的探索--PhoneGap
背景
移动互联时代的高速发展
近年来,随着硬件设备和系统平台的不断发展,手持移动设备的计算能力得到了显著的提高,智能手机和平板电脑已经越来越多地出现在人们的日常生活之中,加之诸如重力感应、GPS模块、蓝牙模块、WIFI接入等特色功能的支持,移动平台的应用领域必将融入并逐渐取代传统的计算机设备;同时,互联网早已深入到了人们生活和工作中的每一个角落,随着新一代3G网络技术的普及与发展,基于传统2.5G网络的WAP应用时代也会逐渐地退出历史舞台。
在此背景下,移动互联时代便应运而生,所谓移动互联即是指智能的手持移动设备与互联网在高速发展中,相互结合、相辅相成而造就的时代产物。
移动应用软件开发的现状
再好的系统平台都需要有软件来支撑,如果把移动互联网比作新互联时代的骨骼,那么运行于移动平台之上的应用软件就好比血肉一样,是真正体现其价值的载体。
移动应用软件作为直接与用户交互的窗口,已经逐渐引起了厂商和开发者的重视,开发出具有高认可度的移动应用软件,已经成为了移动平台占据传统市场的主要手段。
在多厂商的利益竞争下,当前的智能终端平台呈现出了“百家争鸣”的现象。
从图1中的统计数据可以看出,当前的移动终端系统呈现出较为零散的割据状态,其中,Nokia主推的Symbian、Apple的iOS、和Google的Android,分别占据了较大的市场份额。
然而,由于当前主流的移动平台之间互不兼容,针对不同的移动平台系统,当前并没有可以兼容的应用开发接口和语言;当前,使用C/C++的Symbian、使用ObjectC的iOS和使用Java的Android应用开发技术,几乎是完全无法融合的。
图1.近两年移动平台市场占有率的统计数据
不难发现,这种开发技术的不兼容性,将直接为移动平台应用的发展带来重大的阻碍。
从应用开发的角度来说,同样的程序逻辑却不得不在多个平台上使用不同的语言和API重复编码;从代码维护的角度来说,针对同一个项目需要同时维护多份代码,一旦程序逻辑发生变化,将导致大规模的代码修改与回归测试;另外,从经济角度来说,要同时开发和维护多个平台的应用程序,将花费企业巨大的人力和时间成本。
回页首
主流跨平台移动应用开发框架的比较
为了解决上述问题,跨平台的移动应用开发技术逐渐地引起了开发者的关注。
不难看出,面向不同的终端平台和开发语言,要实现应用开发的兼容性,其实只有两条可行之路:
其一是采用不同平台都认可的标准技术,其二是采用已被成熟使用的现有技术。
然而无论采用哪一种方式,当前跨平台应用卡法所缺少的,都是作为平台底层API与通用开发技术中间件的跨平台移动应用开发框架。
随着人们对跨平台应用开发研究的不断深入,当前市场上已出现了若干致力于跨平台开发的产品级框架。
其中,PhoneGap、Titanium和 Rhodes便是当下发展较为成熟的三款开发框架。
为了更好地了解当前的跨平台开发框架技术,本文对其三者从如下几个方面进行了对比:
目标
上述三款框架产品都将目标明确地定位为“一次开发,运行于任何移动终端平台。
”这就意味着其必须跨越平台特性和编程语言的界限,可以与任何平台的SDKAPI进行无差别的交互。
支撑平台
Titanium框架目前只支持Android和IPhone平台,而PhoneGap和Rhodes则均声称支持当前大多数的主流平台,图2描述的是PhoneGap开发框架当前的兼容平台。
图2.PhoneGap框架的兼容平台
编程语言
PhoneGap和Titanium框架均采用了HTML+CSS+JavaScript作为其编程语言,同时对HTML5和CSS3提供了相应的支持;而Rhodes则使用Ruby+Rails作为其编程基础,使用Ruby来实现移动应用的逻辑。
不难发现,上述三者都选择了成熟的脚本和Web技术作为实现平台兼容的入手点,正如前文所述,这也是目前实现跨平台开发的唯一可行之路。
实现原理
在三者之中,PhoneGap和 Titanium框架的实现原理较为相似,编程人员通过使用CSS和HTML来设计程序UI并控制程序的逻辑;同时,使用JavaScript来调用API与对应平台的SDK进行交互,以启动手机的GPS、震动、重力感应等功能。
使用PhoneGap和Titanium编写的程序会被打包并安装到手机上,在应用运行时载入到手机的浏览器控件中解析执行。
而 Rhodes则依赖于Ruby+Rails的Web框架,在手机内部构建了一个完整的WebAppserver环境,使用Rhodes开发的应用可以像传统Web服务器一样,接收并处理用户的操作事件,并访问对应平台的SDKAPI。
开源/商业化
在上述三种框架中,只有PhoneGap是纯粹的开源产品,Titanium目前还处于其产品化的Beta阶段,其正式版本将作为商业化的框架产品而发布,Rhodes的发展较上述两者则相对成熟一些,它也是商业化的框架产品。
其他A
PhoneGap和Titanium有很多相似之处,但相比PhoneGap,Titanium除了提供与SDK相对应的功能API外,还对相应平台UIAPI提供了一定的支持。
因而,使用Titanium可以开发出更加接近于本地应用的用户体验,但也正因为如此,Titanium对平台的兼容性不及PhoneGap的发展现状。
其他B
Rhodes得益于成熟的Ruby/Rails技术及其在移动平台内部构建的相对完整的WebApp环境,Rhodes框架天生具备了更好的RestWebservices的能力,可以方便地与后端服务器进行交互;但是,这种基于WebApp的方式来访问平台SDKAPI的能力也有一定的局限性,如不能良好的支持音频和视频的播放等。
另外值得一提的是,跨平台的移动应用开发框架均着眼于解决不同平台之间应用开发的兼容性问题,因而讨论某一框架的优劣,不应拿诸如使用该框架是否能开发出3D游戏这样的标准来对其进行考量。
通过上文的比较,笔者认为开源框架PhoneGap的优势更为均衡,具有更好的发展前景。
因而,下文将针对PhoneGap框架进行详细的介绍,并通过实例来讲解如何使用PhoneGap框架为Android平台开发简单的应用。
回页首
PhoneGap框架简介
从概念上说,PhoneGap是一款完全开源的跨平台移动应用开发框架。
通过使用PhoneGap框架,开发人员可以采用传统的Web开发技术(HTML+CSS+JavaScript)来实现待开发应用的UI和程序逻辑。
在开发的过程中,PhoneGap框架提供了一系列的API供开发人员在JavaScript代码中调用;通过这些API调用,PhoneGap程序就可以与相应移动平台的SDKAPI进行交互,以调用运行平台本地的功能。
在运行时,使用Web技术编写的资源文件(html/css/js)会被打包为类似“镜像文件”的形成发布到待运行平台之中,在运行时由浏览器解析执行,从而实现了一次开发,跨多平台运行的目的。
当前,PhoneGap已经对几乎所有的主流移动平台提供了支持,不过如图3所示,受到来自技术和商业竞争的影响,PhoneGap在每个平台上都有若干的功能点无法覆盖,有待于进一步完善。
图3.PhoneGap框架对当前主流移动平台的支持细节
回页首
PhoneGap开发实践
使用PhoneGapBuild创建应用
本节介绍的是一种相对简单的使用PhoneGap开发跨平台应用的方法。
在PhoneGap的官方网站中,提供了一个叫做PhoneGapBuild的Web应用,在PhoneGapBuild的页面中,用户可以将使用Web技术(html/javascript/css)开发好的应用上传,PhoneGapBuild会为其支持的平台各自打包一份可安装的应用程序,开发人员可以选择所需的平台,导出相应的应用程序。
在本节中,我们先编写一个简单的HelloWorld程序,并使用PhoneGapBuild来将其打包为Android平台的应用程序。
需要说明的是,由于当前PhoneGapBuild尚处于Beta阶段,使用者需要注册并提出Beta测试申请,申请者会在一周之内获得一个BetaCode,只有使用BetaCode登陆的用户才能使用该功能。
打开PhoneGapBuild的页面,我们可以看到如图4所示的操作界面。
开发人员可以使用git或者svn的url地址来指向一个已开发好的WebApp;此外,我们也可以将HTML、CSS和JavaScript文件放在同一个文件夹中,将其统一打包为zip文件后上传;最简单的,我们可以直接上传一个名为index.html的文件,将相应的程序逻辑都写在该文件中,本节的HelloWorld程序便采用了该方式,感兴趣的读者可以实践一下下文的操作步骤。
图4.PhoneGapBuild的操作界面
1.首先,我们可以使用本地的文本编辑工具,创建一个名为index.html的文件,并将清单1中的html代码加入到该文件中并保存。
清单1.创建一个名为index.html的文件
DOCTYPEHTML>
HelloWorld!
HelloPhoneGap!
2.如图所示5所示,我们从本地选择并上传已编辑好的index.html文件;同时,我们可以为自己的应用起一个名字,例如“HelloWorld”,点击Create按钮进入下一页。
图5.上传已创建的index.html文件
3.在成功上传之后,PhoneGapBuild会采用默认的配置来Build我们的应用程序。
如图6所示,开发人员也可以点击链接“Edit”打开配置页面来编辑我们的应用属性:
如为应用设置名称、包名、版本号和描述等信息;此外,iOS应用的开发人员,可以在该页面配置开发许可的Key文件。
图6.PhoneGapBuild的配置页面
4.如图7所示,在等待一段时间之后,可以看到PhoneGapBuild页面中对应不同平台的图标发生了变化:
由于iOS平台开发需要相应的licensekey,所以我们得到了一个显示警告信息的图标;而Android、webOS和Symbian平台则顺利的编译成功;对于BlackBerry平台,笔者尝试多次都未能成功的编辑应用程序,其图标一直停留在如图所示的等待状态。
图7.PhoneGapBuild的结果页面
5.最后,通过点击相应平台的图标,即可将build好的应用程序下载到本地。
在实践中,笔者成功创建了名为“HelloWorld-debug.apk”的应用;读者可以将其安装到Android手机中进行测试,应用启动后,可以在手机屏幕打印出相应的文字。
基于PhoneGap和Eclipse搭建Android开发平台
除了使用PhoneBuild外,开发人员也可以基于主流的IDE搭建PhoneGap的开发环境,在IDE中编写和调试程序代码,同时可以在相应的模拟器中直接运行编译好的PhoneGap程序。
由于iOS应用开发需要相应的SigningKey,同时需要特殊的硬件和系统平台,因而在本节中,我们还是面向Android平台来讲解PhoneGap的使用方法。
有别于前文使用PhoneGapBuild开发方式,要使用IDE开发PhoneGap程序,我们首先需要安装相应平台的SDK。
由于AndroidSDK的安装与本文的内容并不直接相关,因而此处只做简略的介绍。
1.首先要下载Android的SDK,并将其解压到本地硬盘上。
2.之后,我们要运行解压包中的SDKManager.exe程序。
如图8所示,使用SDKManager可以下载相应版本的AndroidSDK和文档。
在本文的示例中,使用的是2.2版本的Android平台。
图8.使用AndroidSDK下载SDK及相关文档
3.在SDKManager的“Virtualdevices”选项卡中,我们可以创建一个手机模拟器,用于在开发过程中进行调试,模拟器的属性可以按图9所示进行配置。
图9.Android模拟器的设置
在完成上述操作之后,我们还要搭建本节中要使用的IDE程序。
在该示例中,本文采用的是3.6版本的Eclipse;同时,为了方便Android应用的开发,我们还需要下载并安装Eclipse的Android插件ADT。
因为该过程相对简单,此处将不再赘述,有问题的读者可以在网上找到相应的安装说明。
之后,我们需要在PhoneGap的官方网站上下载PhoneGap程序包,并将其解压到本地硬盘。
当前PhoneGap最新的版本为0.9.4,如图10所示,基于PhoneGap框架开发Android应用所需的类库、JS文件和Sample等文件,都在其下名为“Android”的目录之中。
图10.PhoneGap框架中的Android开发包
接下来,我们可以打开Eclipse,并在其中创建一个Android的项目。
如图11所示,选择File->New->Others打开Eclipse的NewWizard后,在其中选择创建“AndroidProject”。
图11.Eclipse中AndroidProject的NewWizard
如图12所示,在AndroidProject的NewWizard中,我们可以为AndroidProject指定项目名称、应用名称等若干的配置信息,其中的BuildTarget配置项表示该应用待运行的最低平台版本,本文在此处选择了Android2.2平台。
图12.配置AndroidProject
至此,我们就在Eclipse中创建好了一个传统的Android开发项目。
为了搭建PhoneGap开发环境,我们还需要将PhoneGap的类库和JS文件添加到该项目之中。
首先,打开本文的示例项目TestPhoneGap,在assets文件夹下新建一个名为“www”的文件夹,并将PhoneGap程序包中Android目录下的phonegap.0.9.4.js文件拷贝到该文件夹中。
之后,我们需要在项目TestPhoneGap项目下新建一个名为“lib”的文件夹,并将PhoneGap程序包中Android目录下的phonegap.0.9.4.jar文件拷贝到该文件夹中。
如图13所示,右键选择项目TestPhoneGap->BuildPath->ConfigureBuildPath,在弹出的对话框中,点击AddJARS后选择phonegap.0.9.4.jar,将其添加到项目的类路径中。
图13.将PhoneGap的类库添加到项目BuildPath中
至此,我们就完成了在EclipseIDE下,基于PhoneGap来开发Android应用的所有环境搭建工作。
在下文中,我们就可以基于该环境,使用传统的Web技术来开发Android平台的应用程序。
使用PhoneGap+Eclipse开发Android应用
在完成了环境搭建工作之后,我们便可以使用该环境开发和调试基于PhoneGap框架的Android程序。
首先,我们来尝试使用Eclipse编译PhoneGap程序包中提供的Samples程序,并在模拟器中运行该程序:
1.打开上文中创建的PhoneGapActivity.java文件,将其继承的父类由android.app.Activity修改为com.phonegap.DroidGap,并添加所需的Java包引用。
2.将代码setContentView();替换为super.loadUrl("file:
///android_asset/www/index.html");
3.打开文件AndroidManifest.xml,将清单2中的代码添加在application的起始标签之前,该段代码主要用于配置应用程序对系统API调用的授权信息。
清单2.配置应用的授权信息
name="android.permission.CAMERA"/> name="android.permission.VIBRATE"/> name="android.permission.ACCESS_COARSE_LOCATION"/> name="android.permission.ACCESS_FINE_LOCATION"/> name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/> name="android.permission.READ_PHONE_STATE"/> name="android.permission.INTERNET"/> name="android.permission.RECEIVE_SMS"/> name="android.permission.RECORD_AUDIO"/> name="android.permission.MODIFY_AUDIO_SETTINGS"/> name="android.permission.READ_CONTACTS"/> name="android.permission.WRITE_CONTACTS"/> name="android.permission.WRITE_EXTERNAL_STORAGE"/> name="android.permission.ACCESS_NETWORK_STATE"/> 4.如图14所示,将PhoneGap程序包中Samples目录下的index.html和master.css文件拷贝到上文中创建的www目录中。 这两个文件即是PhoneGap提供的完整的Android版示例程序。 图14.添加PhoneGap提供的Android示例程序 至此,我们就完成了运行PhoneGap提供的AndroidSamples的全部步骤。 接下来,我们可以在Eclipse中启动Android的模拟器,并在其中测试运行本节开发的PhoneGap程序。 右键单击项目PhoneGapTest->RunAs->AndroidApplication。 从图15中可以看到,PhoneGap的Android示例程序中提供了若干的Button,用来导航用户测试其对SDKAPI的调用情况,其中包括了拨号、震动、铃声、GPS等常用的功能,在本文的分析与总结中,会对相应的的JavaScript进行简要的分析,总结对应功能的API调用方式。 图15.测试PhoneGap的Android示例程序 另外,由于模拟器的使用限制,该示例中的很多功能无法直接在模拟器中测试。 在真实开发中,读者可以开启Android手持设备的USBDebug模式,连接USB后直接使用真机进行开发调试。 最后,我们也可以尝试使用html、javascript和css编写一个自己的Web应用,并将其发布到Android的模拟器中运行: ∙还是在目录www中,我们先创建一个html文件,并将其命名为calculator.html。 在calculator.html中,笔者使用html、javascript和css编写了一个简单的计算器应用,读者可以在本文的示例代码中找到该程序。 ∙打开PhoneGapActivity.java文件,将代码super.loadUrl(…)修改为super.loadUrl("file: ///android_asset/www/calculator.html"),以指向我们新创建的计算器程序。 ∙如图16所示,在以上文所述方式将新的代码发布到Android模拟器后,我们便可以在手机中测试本文的计算器示例程序。 图16.测试运行calculator程序 在该示例中,本文使用html和JavaScript编写了一个简单的计算器程序,并将其发布到Android模拟器中测试执行。 遗憾的是,该示例并没有调用到PhoneGap提供的JavaScriptAPI;但通过编写一个html文件来实现Android应用的开发,仍然是让人振奋人心的事情。 回页首 总结 本文首先介绍了移动互联领域的高速发展,并阐述了当前跨平台移动应用开发所面临的问题。 从这些问题入手,本文介绍了当前主流的几种移动应用开发框架,并从目标、支撑平台、实现原理等方面对其进行了比较。 在实践环节中,本文介绍了开源的PhoneGap框架,并使用PhoneGapBuild将一段传统的HTML代码编译为针对当前主流移动平台的简单应用;之后,本文阐述了如何基于Eclipse和PhoneGap搭建Android的开发环境,并使用PhoneGap提供的Samples程序对开发环境进行了测试;最后,本文将一
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 跨平台移动应用开发框架的探索 PhoneGap 平台 移动 应用 开发 框架 探索