您可以捐助,支持我们的公益事业。

1元 10元 50元





认证码:  验证码,看不清楚?请点击刷新验证码 必填



  求知 文章 文库 Lib 视频 iPerson 课程 认证 咨询 工具 讲座 Modeler   Code  
会员   
 
   
 
 
     
   
 订阅
  捐助
使用Dw5.5+JQuery+PhoneGap开发手机应用程序
 
作者:随机 来源:博客园 发布于 2015-6-19
  1934  次浏览      15
 

--开发环境的搭建

在当前技术形势之下学什么技术的“性价比”最高? 很多人一致认同的答案是:Javascript。性=用途广泛性(跨前后端与各种平台),价=学习的代价(耗费时间与难易程度)。所以是很值得投资时间学习的。尤其是有志于投身IT行业的在校学生,学习Javascript及其相关框架是很好的选择。

我们知道一般情况下使用Objective-c开发iPhone平台的应用,用Java开发Android平台的应用,用Silverlight开发Windows Phone平台的应用,但如果你想开发一个在以上的平台都可以运行的应用,你是不是得学三种语言?那样生活岂不是很惨?

还好,我们有HTML5+JQuery+PhoneGap框架,可以让我们只学一种技术来开发一个在所有手机平台、平板电脑、包括各种PC平台都可以运行的软件!

本文首先介绍开发环境的搭建和程序的调试。

Dreamweaver 5.5 下载地址:

http://trials2.adobe.com/dlm/AdobeProducts/DRWV/11_5/win32/Dreamweaver_11_5_LS3.exe

升级补丁下载地址:

http://www.adobe.com/support/dreamweaver/downloads_updaters.html

Adobe 在2011年底推出的Dreamweaver 5.5 可以用两个字来总结:给力。安装后,里面的功能确实令人眼前一亮!我们来看看其中几个很猛的功能:

1.集成JQuery 和 PhoneGap开发环境:

安装后,Dreamweaver就自带了JQuery和PhoneGap,这样就省去你很多时间分别去下载和繁琐配置。

你可以在在“插入”菜单里找到很多的JQuery 控件库,可以很方便的插入到代码或设计视图里。

2.多屏幕预览面板

可以如上图所示实时更改设计视图的尺寸和方向,以便检查开发的应用在各种尺寸下的显示效果。

3.可自动联网下载Android和iOs 的SDK,并帮你完成配置工作。

也就是说,只要安装了Dreamweaver,这些SDK都可以顺便帮你下载并配置安装好。因为iOs SDK不支持在Windows运行,所以你可以在Windows系统里使用Android模拟器实时模拟你写的应用,而在Mac机器上,你可以同时使用Android和iPhone的模拟器来调试你的应用!

我使用的是Windows, 打开“站点/移动应用程序/配置应用程序框架”,可看到如下界面,

点击“简易安装”按钮就可以自动联网并下载Android SDK了。

如果你已经安装好Android的SDK,那么,只需告诉Dreamweaver SDK的路径在哪就可以了。

顺便说一下,如果你自己下载SDK,以Android系统为例,你需要下载如下内容:

1.Java JDK

下载地址:http://www.oracle.com/technetwork/java/javase/downloads/index.html

2.Android SDK工具

下载地址:http://developer.Android.com/sdk/

安装后,点击Dreamweaver内的“站点/移动应用程序/生成和模拟”就可以启动模拟器来调试你开发的应用,如下图所示:(帅啊!)

OK, 开发环境搭建完成了,基本没有很多的配置内容,安装完Dreamweaver就搞定一切!我们来动手检验下所取得的成果吧。

我们按以下步骤,几分钟内就可以测试一个很简单的应用:

一. 首先我们新建一个站点

点击菜单中的“站点/新建站点”

输入站点名称,选择一个文件夹作为站点存放的路径。

二.新建一个JQuery+PhoneGap的应用。方法如下图所示:

点击“文件/新建”,选择“示例中的页/Mobile起始页”,选择”JQuery Mobile(PhoneGap)”

文档类型选择“HTML5”

点击“创建”,Dreamweaver自动帮你创建了一个应用开发的模版。

把这个模版保存在刚才创建的站点中,并命名为index.html

不可思议的事情发生了,Dreamweaver自动把JQuery和PhoneGap框架所需要的所有Javascript文件全部拷贝到了该站点中!

下面我们就可以开始看看这个index.html在手机模拟器中是什么样子了。

调试应用程序变得非常的容易:

可以在已安装的浏览器中预览;

可以选择在Device Central 内预览;

如下图所示:一个简单的html页面在模拟器中摇身一变,成了很专业的手机应用程序。这些都得益与JQuery Mobile框架内置的控件。

让我们看看在Android模拟器中是什么样子的吧:

点击Dreamweaver内的“站点/移动应用程序/生成和模拟”就可以启动模拟器来加载这个应用程序:

最后提示生成成功:

更不可思议的事情发生了!Dreamweaver自动把你的应用打包成可以在真实手机上安装的安装包,并保存在桌面上!你可以在相关文件夹内的Bin文件夹中找到 “应用程序名称-debug.apk”文件,这个就是安装包了。你可以把你安卓平台的手机连接电脑的USB口(充电器去掉充电器的头就是数据线了),把这个文件拷贝到你手机的SD卡里,就可以点击安装。

这里需要说明一下: 这个文件是debug模式的文件,只能通过SD卡安装在自己手机上自娱自乐,如果需要上传到应用商店,你还需要给这个文件签名。

非常的遗憾,目前Dreamweaver还无法实现自动签名,Dreamweaver似乎也意识到这一点,生成的安装包是支持Eclipse导入的。你可以用Eclipse把安装包导入,重新导出一个签名的安装包即可。

这时候,你可以在模拟器找到你预先定义的图标,用鼠标点击模拟器进入你的应用了。

注:手工安装apk到模拟器的方法:

把生成的apk拷贝到 C:\Program Files\Android\android-sdk\platform-tools 目录下。

点击开始/运行,输入CMD进入DOS,一路CD到

C:\Program Files\Android\android-sdk\platform-tools

输入Adb install 你的应用名称.apk,如下图所示:

以安卓系统开发为例。Dreamweaver输出的apk文件是未签名的,而Dreamweaver目前还未支持自动为程序集签名的功能,因此只能是手工来为apk的文件签名。

我自己探索了一番后,总结出的具体操作步骤如下:

1.在命令行下,CD到Java SDK 安装的位置。 我的位置是:C:\Program Files\Java\jdk1.7.0_02\bin

首先我们先创建一个开发者的证书。创建证书的目的,是为了识别应用程序的开发者,也是开发者与用户之间信任关系的凭证。

为了方便操作,我们在 C:\Program Files\Java\jdk1.7.0_02\bin 目录下创建一个叫 keys 的文件夹来保存我们创建的证书。

在命令行下,输入以下命令开始创建证书:

C:\Program Files\Java\jdk1.7.0_02\bin>keytool -genkey -alias dengfeng.keystore
 -keyalg RSA -validity 20000 -keystore keys/dengfeng.keystore 

说明:

dengfeng.keystore 是所要创建的证书的名称

所创建的证书保存在 keys文件夹内 (keys/dengfeng.keystore)

按下回车键后,需要回答软件提出的几个问题:

如下图所示:

依次如上图所示回答你公司或个人的信息即可。我没有试过是否可以使用中文填写,我使用的英文没有任何问题。

这时,你就可以在 C:\Program Files\Java\jdk1.7.0_02\bin\keys\ 文件夹下找到我们创建的证书了。

如下图所示:

2.接下来我们要使用该证书为我们开发的程序进行签名了。操作步骤如下:

使用Dreamweaver导出Android的安装包,具体步骤详见:http://blog.csdn.net/soft2buy/article/details/7217163

找到 “程序名称-debug-unaligned.apk” 文件。有人说是输出目录下的 那个“程序名称.ap_”文件,但我试了签名后无法安装。

如下图所示:

把这个文件拷贝到:

C:\Program Files\Java\jdk1.7.0_02\bin 目录下,并重新命名为:iwiiboard.apk

在命令行输入如下命令:

C:\Program Files\Java\jdk1.7.0_02\bin>jarsigner -verbose -keystore keys/dengfeng.keystore -
signedjar iwiiboard_released.apk iwiiboard.apk dengfeng.keystore

按下回车键,输入你刚才创建的证书密码,就可以对名为 iwiiboard.apk的应用签名,并输出为:iwiiboard_released.apk. 注意这两个文件的书写顺序,作为输出结果的文件是写在前面的!

结果如下图所示:

这时,你可以在

C:\Program Files\Java\jdk1.7.0_02\bin>目录下找到输出后的带签名的文件:iwiiboard_released.apk.

我们可以通过以下的命令来验证签名是否成功:

在同一目录下,命令行输入:

C:\Program Files\Java\jdk1.7.0_02\bin>jarsigner -verbose -verify iwiiboard_released.apk  

如显示 jar 已验证 及其证书的有效期等信息,说明应用签名成功了!

3. 使用zipalign.exe优化签名后的apk,让安卓系统更高效的执行该应用。

步骤如下:

首先,在Android的sdk目录下的tools文件夹里找到zipalign.exe,为方便操作,我们把它拷贝到C:\Program Files\Java\jdk1.7.0_02\bin>目录下

输入以下命令:

C:\Program Files\Java\jdk1.7.0_02\bin>zipalign -v 4 iwiiboard_released.apk iwiiboard_sign.apk 

按下回车,zipalign自动为 iwiiboard_released.apk优化,并输出为 iwiiboard_sign.apk 文件。

如下图所示:

iwiiboard_sign.apk 就是最终我们要的文件,你可以上传到 Android market 让用户下载安装了。

   
1934 次浏览       15
 
相关文章

手机软件测试用例设计实践
手机客户端UI测试分析
iPhone消息推送机制实现与探讨
Android手机开发(一)
 
相关文档

Android_UI官方设计教程
手机开发平台介绍
android拍照及上传功能
Android讲义智能手机开发
相关课程

Android高级移动应用程序
Android系统开发
Android应用开发
手机软件测试
最新课程计划
信息架构建模(基于UML+EA)3-21[北京]
软件架构设计师 3-21[北京]
图数据库与知识图谱 3-25[北京]
业务架构设计 4-11[北京]
SysML和EA系统设计与建模 4-22[北京]
DoDAF规范、模型与实例 5-23[北京]

android人机界面指南
Android手机开发(一)
Android手机开发(二)
Android手机开发(三)
Android手机开发(四)
iPhone消息推送机制实现探讨
手机软件测试用例设计实践
手机客户端UI测试分析
手机软件自动化测试研究报告
更多...   

Android高级移动应用程序
Android应用开发
Android系统开发
手机软件测试
嵌入式软件测试
Android软、硬、云整合

领先IT公司 android开发平台最佳实践
北京 Android开发技术进阶
某新能源领域企业 Android开发技术
某航天公司 Android、IOS应用软件开发
阿尔卡特 Linux内核驱动
艾默生 嵌入式软件架构设计
西门子 嵌入式架构设计
更多...