第1章APEX移动Web开发简介

·PAGE10·Oracle移动网络应用程序设计——基于OracleApplicationExpress·PAGE11·第1章APEX移动Web开发简介第1章APEX移动Web开发简介为什么会有如此多围绕着创建移动应用程序的话题？最简单的原因就是移动应用程序已经是业界的下一个发展前沿。现今商务人士面临着日益增长的时间限制，以及提高生产力的需求，但一天只有24小时，如何充分利用时间就是目前急需解决的问题。解决办法就是让商务人士可以随时随地对事务进行处理。大多数人都有一部智能手机，并且会选择服务可靠、规模较大的运营商所提供的服务。移动应用程序有助于使这些忙碌的用户充分提高他们的工作效率。用户究竟需要什么样的移动应用程序？用于支持领域内从业人员的应用程序，其传统需求将会继续扩大，这其中的对象包括紧急救援人员、服务人员和销售人员等。此时，移动应用程序已不再是只提供访问或其他联系信息，还需要给现场工作人员配备服务或者销售记录、背景信息等。如何管理这些人员？现在，救援服务的区域经理会配备一款能够实时知晓团队人员位置的移动应用程序，并且可以知道该人员的去向、当前的状态以及需要提供救援服务的病人数等信息。这些功能让经理能够在离开办公桌的同时，知晓所有情况，并作出相应要求的决策。此外，针对那些较为传统的用例，商业社区还需求一些大规模的新型移动应用程序。一般在办公室办公的工作人员会寻求能够随时随地处理行政管理以及人力资源等方面工作的应用程序。通过使用移动应用程序，客户站点上的咨询人员可以远程登录并输入他们的时间和费用信息。管理人员不必寻找可以联网的笔记本电脑也可以在候机时批准假期请求甚至是检查一些重要的性能指标。而这些对于需要时刻待命的数据库管理人员又是如何呢？移动应用程序是否能够帮助他们在火车上的时候检查数据库的健康程度以及执行特定的任务呢？有一部分移动应用程序是针对客户设计的，包括银行、通讯社、快餐企业、服务提供商、电话公司以及其他需要移动解决方案的客户等。可以想象并对比一下在计算机上和在智能手机上执行任务的情形，提供可用且易用的应用程序可以提高用户的满意度。当然，以用户为中心的应用程序与针对商业内部使用的应用程序有很大的差异。这些应用程序不仅要确保只有被验证的用户可以访问它们的数据（无人工参与），还要为客户提供一个高质量的链接入口。ApplicationExpress开发团队向OracleOpenWorld中输送了很多成员，每一位成员都有相应的职责，包括会议监督、实战实验室、演示场地以及与客户的沟通等。在过去的几年中，每个团队都会收到一份包含每一位成员的工作职责的电子表格。而在2011年，这种表格变成了一个移动应用程序，每一个团队成员所接收到的是应用程序的URL链接。该应用程序很简单，不到两个小时就可以创建完成。更多的时间精力则是花在对数据的访问和调整上。这不仅可以减少很多表格的使用，还可以节省很多时间。开发的成本可以说是低投入、高回报。可以看看当前的业务流程。有几个事实是可以肯定的：移动应用程序可以提高生产力或用户的满意度。易于使用和易于访问是使这些任务变简单应该满足的两个目标。1.1设计移动应用程序随着构建应用程序的基础技术路线的改变，开发人员同样需要对应用程序的设计进行修正。最早的主流业务应用是针对那些旧式绿屏终端大型机应用程序开发的，并且是基于字符的。用户在其上可以使用Tab键和其他组合键进行操作。一些航空公司的订票系统还采用这种类型的系统。乘客在办理登记手续或者在登机口时，就会发现工作人员大多是使用众多的组合键，而不是使用鼠标进行操作。这种类型的应用程序很难学习，并且不直观，但对于熟练的操作员来说却非常有效率。在大型机应用程序之后，另一项主要的改进是客户端-服务器和桌面应用程序。随着个人计算机的蓬勃发展，几乎每个人在自己的办公桌上都有一台计算机，业务应用程序都是根据MicrosoftWindows操作系统来进行设计开发。这些应用程序的设计理念是在一个屏幕上适当显示所需的每一个信息。通常屏幕的大小就是应用程序窗口设计的大小。开发人员创建的窗口要与屏幕的大小相匹配。因此，开发人员在设计一行中带有多个项目的输入表单时，通常都只留下非常少的空间。导航和特定的操作主要使用功能键（F1～F12键）、标签和按钮，并都会指定相应的键盘快捷方式。这种类型的应用程序的另一个共同属性是多功能界面窗口，特别是在使用OracleForm时尤为常见。当导航至一个窗口时，使用功能键来输入查询条件，按下另一个功能键来执行查询，接着就是向上或者向下查询记录。如果找到了想要的记录，更新后要按下另一个功能键来保存此更新。客户端-服务器类型的应用程序需要对终端用户进行培训，并需要花时间熟悉掌握。互联网的发展则再一次改变了应用程序的设计。互联网迎来了爆炸式的自助服务应用程序，用来代替办公室应用程序。可以说，诸如亚马逊和其他购物网站等互联网上最热门的应用，它们的目标是客户，而不是内部用户。这种应用程序最重要的设计目标是极其易于使用以及良好的用户体验。基于Web的业务应用程序也使用同样的设计理念。使用垂直滚动和布局输入表单来满足视觉上的效果，而不需要在一个屏幕中尽可能多地放置这些东西。由于基于Web的应用程序可以在各种设备上运行，而不只是基于Windows平台的计算机，因此导航和操作也不依赖于功能键或键盘的快捷方式，从而进一步简化了选项卡、按钮和链接等。基于Web的业务应用程序的目标是专注于业务流程，而不是训练用户如何使用该应用程序。移动应用程序是对应用程序设计的新挑战。开发人员必须考虑到屏幕大小的不同（移动设备的屏幕都较小），并且是通过手指，而不是鼠标来使用该程序。用户使用移动应用程序中的导航与桌面应用程序中的导航差别就很大，如移动应用程序的导航通常在主页面的列表中，通过图1-1和图1-2可以看出两者之间的明显差异。图1-1桌面应用程序主页图1-2移动应用程序主页鉴于移动设备屏幕的有限空间，类似位置导航之类的设计被移除了。此外，Cancel按钮也被内置的Back键所代替。更重要的是，在每个页面上包含一个Home键或者图标以允许用户随时回到应用程序的首页上。在移动设备上还有几样东西可以用来改善用户的体验，例如滑动（swipe）、点选（tap）和横竖屏切换（orientationchange）等。在查看OracleApplicationExpress（APEX）4.2中的SampleDatabaseApplication时，会注意到其中的一个应用程序包含了针对桌面以及移动设备的用户界面。每个页面只与一种用户界面相关联。如果用户通过移动设备登录到应用程序，将显示移动页面；如果是通过桌面设备登录，则显示桌面用户的界面。从任意一个用户界面都可以切换到另一个用户界面。两者都提供相同的功能，但不同界面的用户体验有很大的不同。对于链接到窗体的报表来说，此类基于Web的桌面应用程序的常见设计在移动应用程序中被替换成一个链接到表单的列表。其中一个原因是移动应用程序中的列表使用户能很容易地通过触摸来选择，而不像在报表中选择一条正确的记录般困难。列表通常仅用于显示一些重要的数据元素，用户可以点击列表上的任何一个地方以查询向下一级的具体数据。移动应用程序可以包含简单报表，但要注意确保该报表在横竖两个方向都能完好显示。对于ApplicationExpress来说，诸如交互式报表、表格式表单以及主细页面等设计并没有得到移动页面的支持。如果需要表示主从关系，一种方法是对主表使用表单，对明细表使用列表形式。此时需要定义一个额外的页面，而不是在同一个页面维护表中的明细记录信息。这种设计的关键优势之一就是在同一个时间内只需要更新一个子记录，因此很容易实现业务的规则。在SampleDatabaseApplication中，Orders页面显示了此类页面设计风格的范例。其中，桌面用户界面使用了一个主细表单（见图1-3）并验证确保数量在1～10之间；另一个验证则是检查该产品只在一个订单中出现一次。移动用户界面（见图1-4）使用不同的页面来保存订单项，它使用一个选择列表来保证数量在1～10之间来替代验证，因此在这里并不需要进行校验。同样地，产品信息选择列表中的值则将返回现有订单中没有出现过的记录值，这样就保证不会选择重复的值。在OracleApplicationExpress中使用jQueryMobile来创建主题和模板，允许ApplicationExpress引擎调用移动设备的大多数事件，例如滑动、点选等。在一个移动页面中，可以发现DynamicAction事件下有一些移动设备特定的事件可用。它也可以使用HTML5的属性，例如e-mail、URL以及电话号码输入选择等。如果在完全支持HTML5的移动设备上运行SampleDatabaseApplication并随后对客户的信息进行修改，将会发现在编辑e-mail地址、电话号码、URL等信息时，输入的键盘会有相应的变化。文本项定义中有一个新的属性——子类别，该属性允许用户指定屏幕上的软键盘类型。这些特性让用户在开发移动应用程序时能够具有丰富的用户交互功能。图1-3桌面环境下的主细表页面图1-4移动设备下的主列表页面（左）和明细信息页面（右）

1.2基于Web的应用程序与本地移动应用程序的对比移动应用程序有两个主要的类型：基于Web的应用程序和基于本地设备的应用程序。本地移动应用程序是针对某种特定的移动操作系统而构建，例如iOS、Android、WindowsMobile、Blackberry等，使用目标操作系统的应用程序开发语言进行编写，例如iOS系统使用Objective-C，Android系统使用Java等。而基于Web的移动应用程序就是将其编写为Web应用，并且可以直接使用移动设备的浏览器进行访问。创建本地移动应用程序有许多优势。本地移动应用程序能更好地访问所运行的移动设备的各项功能，例如联系人、摄像头等。除此之外，这些应用程序比基于Web的应用程序执行得要好些。应用程序可以在本地运行，并将数据存储于本地（例如使用SQLLite），以便在与网络的连接断开时还能够继续工作。为了将本地应用程序与Oracle数据库相集成，通常需要利用WebServices。本地应用程序需要下载到设备中，并保存在本地。基于Web的移动应用程序有其自身的优势。其中最大的优势是使用一种代码库编写程序就能够从任何一种移动设备访问它，与移动操作系统无关。要访问该应用，只需要在移动浏览器中输入相应的URL即可。另一个主要的优势是代码库自身并不保存在移动设备中，而是保存在服务器上。因此，更新应用程序变得很简单，通常只需要在服务器端更新应用程序就可以完成，而且几乎是同时对每个用户进行更新。这形成了鲜明的对比，本地应用程序需要用户手动下载最新版本的应用程序。考虑到开发人员不能保证每个用户都在运行程序的最新版本（用户意识到要更新程序后才会进行升级），当用户还在使用老版本的应用程序时，本地应用程序的开发人员可能还要写入额外的代码来处理版本差异或其他错误等。基于Web的移动应用程序最大的缺点在于它需要与互联网连接以便完成相应的功能。与此同时，诸如HTML5的应用程序缓存和本地存储功能等新兴的技术能够快速消除本地应用程序以及基于Web的移动应用程序之间的差距。有很多程序允许基于Web的移动应用程序调用移动设备上的部分功能，如摄像头或通讯录等。例如将在第9章中讨论的PhoneGap，可以被嵌入在应用程序中。但是这些功能依旧需要连接互联网。当前用户手机上的绝大部分业务应用程序均为本地应用程序，当然也可能有一些是基于Web的移动应用程序。当打开移动设备上的Web浏览器时，默认页面多半是服务提供商、手机制造商所设置的页面，或者是其他一些类似Google之类的搜索引擎。这些类似的本地应用程序很像是面向“客户”的应用程序，例如银行所提供的允许用户在线办理业务的应用程序。此外，诸如PhoneGap的应用可以被用来提供一个本地应用程序，但严格说来它还是一个基于Web的应用程序。OracleApplicationExpress被设计用于声明构建基于Web的应用程序。ApplicationExpress4.2则允许开发人员快速创建可运行在桌面环境或（和）移动设备下基于Web的应用程序。移动用户界面是基于jQueryMobile框架的模板集合，利用该框架可以使基于Web的应用程序无缝地运行在新旧移动设备上。jQueryMobile框架用来纠正操作系统间的异常或差异的显示问题，以及在那些没有完全支持HTML5功能的旧设备上进行显示功能控制。从ApplicationExpress开发人员的角度来看，创建移动应用程序与创建桌面应用程序所使用的是相同的应用程序构建器、SQL和PL/SQL以及构建移动应用程序的方法。在决定是创建本地应用程序还是基于Web的应用程序时，最重要的是理解应用程序的需求。如果确定创建本地移动应用程序，必须要意识到开发团队需要精通多种开发语言，并且将会有几个不同的代码库。这会造成开发时间过长以及更高的成本等问题；同时，应用程序维护也会更加困难。而采用OracleApplicationExpress创建基于Web的移动应用程序只需要SQL和PL/SQL的技能，并且只需要使用单一的代码库。1.3响应式设计最近被采用的用户界面设计原则之一就是响应式设计，它实际上指的是一组技术，这组技术允许开发人员创建可以动态适应各种设备的内容，包括桌面环境和手机。在大屏幕上，用户会得到完整的体验。在智能手机或平板设备上，布局会根据设备的大小进行自适应。这些是由元素的定位、调整大小或者隐藏等操作完成。在Web设计中，使用诸如媒体查询、流动布局和弹性图片等新功能和技术使得上述操作成为可能，其目标就是要使任何设备上所有的基本内容对于用户来说更为友好和赏心悦目。使用响应式设计创建Web应用程序的概念是相当吸引人的，因为它允许开发人员从任何地方、任何尺寸的浏览器来维护一个应用程序与业务逻辑集。要实现上述目的，任何给定页面的内容必须能在设备上正确显示。然而，响应式网页设计也有一些缺点，真正的响应式页面设计的前期成本很高，需要深入了解页面布局、HTML和CSS等。OracleApplicationExpress4.2介绍了响应式用户界面主题——Theme25，该主题提供了实现响应式布局的构建模块和模板。然而，它是由开发人员使用这些模板并安排页面才成为真正的响应式页面，而并不仅仅是选用哪套模板的问题。同时要注意将现有的应用程序转换到Theme25时，需要检查应用程序的页面，以确保定义了适当的模板和布局。作为响应式应用程序的例子，可以查看ApplicationExpress4.2或者OracleCloud站点（）所提供的SampleDatabaseApplication。首先，在桌面环境全屏模式下查看该应用程序。随后逐渐调整浏览器的大小使其逐渐变窄，此时就会注意到显示区域会调整大小以适应可用屏幕的宽度。在某一个阈值下，这些区域会在水平方向和垂直方向重新对齐（见图1-5）。同样的，如果位于一个数据输入表单上（例如Customers表单），就会发现其中的项目会调整大小，标签将从左侧移动到项目的上方，所有项目的宽度都相同，正如设计该移动应用程序页面所预期的那样。图1-5区域堆叠的响应式应用程序1.4响应式设计的选择，桌面环境或移动环境几乎可以在任意一个连接了互联网并有浏览器的设备上运行ApplicationExpress应用程序。桌面应用程序可以运行在平板电脑和移动设备上，移动应用程序也可以运行在个人计算机上。也就是说，无论是在移动设备上运行桌面应用程序，还是在个人计算机上运行移动应用程序，这两种状况下的用户体验都不甚理想。而对于前者来说，其体验要更为困难，同时结果会令人非常沮丧。由于移动设备上的屏幕较小，用户可能需要频繁滚动屏幕；此外，某些组件可能无法显示或正常工作，这时可能需要经常缩放界面来进行相关的控制，例如选项卡、按钮和链接等。这就是使用响应式设计的桌面应用程序开发所需的额外投资可能有益的原因。它为桌面环境、平板电脑、移动设备等提供了很好的用户体验。响应式设计的一个局限是不能利用特定移动设备事件，例如触摸和屏幕方向切换等。移动设计关注于创建专门针对移动设备的内容，通常用于附加或取代桌面应用程序。为此，移动应用程序要用极其微小的、语义化的HTML进行创建，这些HTML用于对移动连接进行优化。另一方面，桌面应用程序则要繁重得多，需要在一个页面上显示更多内容，包括大标题、选项卡、位置导航以及丰富的页面内容等。然而，页面权重不是那些具有较高互联网连接带宽的计算机所关心的主要问题。当在移动设备上运行响应式设计应用程序时，比专门构建移动应用程序负载要重，所以如果没有一个较好的互联网环境，它需要较长的时间来加载和处理页面。决定要创建单独的响应式应用程序还是有针对性的移动应用程序，需要仔细分析。考虑终端用户何时何地会使用这些应用程序和浏览内容。在移动设备上使用应用程序的时间越多，用户从针对该设备的应用程序中受益越多。信息站点（例如