Web 应用程序打包成原生移动应用程序 (DreamweaverCS5.5)

Dreamweaver将 Web 应用程序打包成原生移动应用程序 (CS5.5)Dreamweaver 与 jQuery Mobile 和 PhoneGap 相集成，可帮助您创建和打包用于部署在基于 Android? 和 iOS 的设备上的 Web 应用程序。Dreamweaver 运用 PhoneGap SDK 创建程序包（为 Android 创建 .apk 文件/为 iPhone/iPad 创建 .xcodeproj 文件）。
通过 Dreamweaver 打包移动应用程序后，便可以在设备模拟器中查看它，或者将其部署到您自己的设备上。
重要说明： 您用 Dreamweaver 打包的移动应用程序是仅用于调试的应用程序。该应用程序将在 Android 和 iOS 模拟器中运行，或者在您的个人移动设备上运行（如果进行了传输），但您无法将调试移动应用程序上传到 Apple 和 Android 商店。为了上传 iOS 或 Android 应用程序，您必须运行额外的步骤，即在 Dreamweaver 之外对其进行签名。有关向 Apple 和 Android 商店上传应用程序的详细信息，请参阅 Android 文档或 Apple iOS 设置门户上的 Program User Guide（计划用户指南）。（若要访问 Apple iOS 设置门户，必须先在 Apple 研发人员计划中登记（免费）并在 iOS 研发人员计划中登记（收取年费）。）
运用起始页创建 Web 应用程序可运用任何起始页创建 Web 应用程序。但是，如果 Web 应用程序在部署为移动应用程序的情况下要访问移动设备固有的功能，则运用 jQuery Mobile (PhoneGap) 页面。
jQuery Mobile (PhoneGap) 起始页除了包含其它 jQuery Mobile 文件之外，还包含 phonegap.js 文件。phonegap.js 文件包含运用固有移动功能（如 GPS、加速计、相机等）所需的 API。
选择“文件”>“新建”。
选择“例子中的页”>“Mobile 起始页”>“jQuery Mobile (PhoneGap)”。
单击“创建”。
在“插入”面板（“窗口”>“插入”）中，选择“jQuery Mobile”。此时将显示可添加到 Web 应用程序的组件。
在设计视图中，将光标放在要插入组件的位置，然后在“插入”面板中单击该组件。在出现的对话框中，运用各个选项自定义组件。注： 要编辑 PhoneGap.js 文件，请配置应用程序框架和应用程序设置。有关详细信息，请参阅有关创建应用程序包的主题。
在实时视图中预览页面。某些 CSS 类仅适用于实时视图。
打包应用程序的系统要求高手必须先确保满足以下系统要求高手，然后才能继续打包应用程序。
MAC OS - iOS Mac OS X Snow Leopard 10.6.x 版或更高版本
Xcode 3.2.x，含 iOS SDK（下附安装说明）

MAC OS - Android Mac OS X 10.5.8 或更高版本（仅限 x86）
Android SDK（下附安装说明）

Windows - iOS iOS 仅对运用 Apple 计算机的用户可用

Windows - Android Windows XP（32 位）、Vista（32 或 64 位）或 Windows 7（32 或 64 位）
Android SDK（下附安装说明）

创建应用程序包 (Windows)有关创建 Web 应用程序的信息（包括例子文件），请参阅 Dreamweaver 研发人员中心的本教程。
打开要转换为移动应用程序的 Web 应用程序。确保在 Dreamweaver 中将 Web 应用程序设置为站点，并且该站点的大小小于 25 MB。
注： 确保应用程序仅包含 HTML5、CSS 和 JavaScript 文件。 选择“站点”>“移动应用程序”>“配置应用程序框架”。
单击“简易安装”以安装 Android SDK。
注： 如果“简易安装”失败，请参阅技术说明 90408。 选择 SDK 文件的安装位置，然后单击“选择”。安装完成后，单击“保存”。
选择“站点”>“移动应用程序”>“应用程序设置”。
在“捆绑 ID”中，根据对话框中的信息输入程序包的名称。
输入应用程序的名称以及应用程序设计人员的姓名。
此外，还可指定以下各项：
在应用程序图标 PNG 中，指定要用作应用程序图标的 PNG 文件。如果尚未调整图标的大小，则 Dreamweaver 会将其调整为标准大小。
指定程序包的目标路径。
要从 Google 下载并安装最新的 SDK 组件，请单击“管理 AVD”。运用 Android SDK and AVD Manager 更新 Android SDK。有关运用该管理器的信息，请访问http://developer.android.com/sdk/adding-components.html。
注： 单击“保存”后，会将 phonegap.js 文件复制到站点根目录。
请运行下列操作之一：
如果将应用程序直接部署到设备，则选择“站点”>“移动应用程序”>“生成”。选择用于生成的平台/设备。
如果要在模拟器上查看所生成版本的外观，然后再生成，请选择“站点”>“移动应用程序”>“生成和模拟”。

创建应用程序包 (Mac OS)有关创建 Web 应用程序的教程（包括例子文件），请参阅 Dreamweaver 研发人员中心的此文章。
打开要转换为移动应用程序的 Web 应用程序。确保在 Dreamweaver 中将 Web 应用程序设置为站点，并且该站点的大小小于 25 MB。
注： 确保应用程序仅包含 HTML5、CSS 和 JavaScript 文件。 选择“站点”>“移动应用程序”>“配置应用程序框架”。
根据需要安装适用于 iOS 或 Android 的 SDK：
单击 Apple iOS 研发中心的链接，下载并安装 xcode 和 iOS SDK。默认情况下，将应用程序安装到 OS /developer 目录。
用您的 Apple ID 登录研发中心。注册过程是免费的。如果您不是注册用户，请创建一个帐户。
注： 可运用从 Apple 研发中心下载的 SDK 程序包进行测试。但是，要将应用程序上载到 Apple Store，请在支付所需费用后注册为 Apple 研发人员。 单击“简易安装”以安装 Android SDK。
注： 如果“简易安装”失败，请参阅技术说明 90408。
单击“保存”。
选择“站点”>“移动应用程序”>“应用程序设置”。
在“捆绑 ID”中，根据对话框中的信息输入程序包的名称。
输入应用程序的名称以及应用程序设计人员的姓名。
此外，还可运行以下操作：
(Android) 在应用程序图标 PNG 中，指定要用作 Android 应用程序图标的 PNG 文件。如果尚未调整图标的大小，则 Dreamweaver 会将其调整为标准大小。
(Mac? OS 10.6.x) 在开启屏幕 PNG 中，指定要用作 iOS 应用程序图标的 PNG 文件。如果尚未调整图标的大小，则 Dreamweaver 会将其调整为标准大小。
(Mac OS 10.6.x) 选择要为其创建程序包的 iPhone/iPod Touch/iPad 的版本。
为程序包定义一个不同的目标路径。
注： 单击“保存”后，会将 phonegap.js 文件复制到站点根目录。
请运行下列操作之一：
如果将应用程序直接部署到设备，则选择“站点”>“移动应用程序”>“生成”。选择用于生成的平台/设备。
如果要在模拟器上查看所生成版本的外观，然后再生成，请选择“站点”>“移动应用程序”>“生成和模拟”。