用 Eclipse 开发 iPhone Web 应用程序

时间：07-25 来源：IBM 点击：

b 应用程序 (samples/theaters/index.html) 的搜索页面。

图 6. iUi 的示例剧院清单 Web 应用程序

　　注意，该演示与本机 iPhone 的界面外观极为相似。使用这些预打包的部件可以快速开发 iPhone Web 应用程序。

　　设计 UI

　　在本例中，将为 iPhone 创建一个名为 iDoc 的 Javadoc 查看器。由 Sun Microsystems 的标准 Javadoc 生成器创建的紧密 HTML 文件在台式机上一切正常，但是在 iPhone 中却很难导航和读取。iDoc 将生成 iPhone 支持的 Javadoc -- 非常适合于在地铁中浏览应用程序编程接口 (API) 或者让合作的编程团队中的观察员帮助解决困难。

　　iPhone 人机接口指南

　　在开始设计 iDoc 的 UI 之前，一定要先了解 iPhone 开发与普通 Web 开发的不同之处。图 7 来自 Apple 的 iPhone Dev Center（请参阅参考资料），很好地总结了两者的不同之处：手指不是鼠标。这样做得不到桌面应用程序中的像素精度，但是通过轻敲、轻弹和轻压将开启一个丰富的新用户交互模型。此外，iPhone 与用户一起移动并且通常用于有干扰的环境中，因此应用程序需要能够快速容易地访问目标信息。

图 7. 手指不是鼠标

Apple 的 iPhone 人机接口指南（请参阅参考资料）定义了三种类型的 iPhone Web 内容。

　　与 iPhone 中的 Safari 兼容
　　可以正确显示的任意类型的 Web 页面，即使页面的一部分依赖于诸如 Adobe Flash 或 Java™ applet 之类的不受支持的插件

　　最适于 iPhone 中的 Safari
　　为 iPhone 正确缩放内容并且不依赖于不受支持插件的 Web 页面

　　iPhone 应用程序
　　通过模拟 iPhone 界面外观来模拟本机应用程序的 Web 页面，并且在适当的时候，与诸如电话、电子邮件或 Google Maps 之类的 iPhone 服务集成
　　标准 Javadoc 页面属于第一种类型，与 iPhone 中的 Safari 兼容。这些页面可以正确显示，但是要求很好地处理轻压和轻弹才能找到相关信息。iDoc 针对的是完整的 iPhone 应用程序。虽然不能与其他服务集成，但是 iDoc 的接口能够在 iPhone 中很好地使用。

　　iDoc UI

　　针对 iPhone 进行开发时，必须只关注 iPhone。应用程序应当快速地完成特定任务，不应该尝试包括所有可能的功能。使用 iDoc，用户必须找到关于 Java 类的基本文档，例如类名、方法名、方法签名和注释。通过指向目标详细信息页面的三个导航级别显示这些信息。

　　包导航
　　顶层包

　　类导航
　　包内的类、接口、异常和错误

　　类细节导航
　　类中的描述、字段、构造函数和方法

　　详细信息页面
　　注释、签名和参数

　　为了使 iDoc 保持整齐并且以任务为目的，需要省略一些传统 Javadoc 功能。例如，不显示包描述注释。由于这些功能通常不包含有用信息（例如，acme.client 包含客户机代码），并且有时被同时省略，因此把它们从 iDoc 中移除并简化接口就显得十分有意义。

　　要获得三个导航级别，请使用边对边 (edge-to-edge) 列表。这是在本机 iPhone 应用程序中常用的构造，用于浏览联系人、电子邮件和音乐。边对边列表将在 44 像素的等高行中显示项，并且有助于在大量信息中滚动查找。Apple 的 iPhone 人机接口指南提供了构造边对边列表的规格，包括字体、字体大小和边框间距。iUi 框架用 CSS 和 JavaScript 语言实现这些规格，允许您创建像本机 iPhone 组件那样显示的简单 HTML 列表。

　　清单 1 显示了页眉，以及 java.applet 和 java.rmi 包的前两个导航级别。
　
　　清单 1. 带有页眉和前两个导航级别的 HTML 文档

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>iDoc</title>

<meta name="viewport" content="width=320; initial-scale=1.0;

maximum-scale=1.0;

user-scalable=0;"/>

<style type="text/css" media="screen">@import

"iui/iui.css";</style>

<style type="text/css" media="screen">@import

"iDoc.css";</style>

<script type="application/x-javascript"

src="iui/iui.js"></script>

</head>

<body onclick="console.log('Hello', event.target);">

<div>

<h1></h1>

<a

href="#"></a>

</div>

<ul title="Packages" selected="true">

<li><a href="#java.applet">java.applet</a></li>



<li><a href="#java.rmi">java.rmi</a></li>

</ul>

<ul title="java.applet">

<li>Interfaces</li>

<li><a href="java.applet.AppletContext.html">

AppletContext</a></li>

<li><a href="java.applet.AppletStub.html">

AppletStub</a></li>

<li><a href="java.applet.AudioClip.html">

AudioClip</a></li>

<li>Classes</li>

<li><a href="java.applet.Applet.html">Applet

</a></li>

<li><a href="java.applet.Applet.AccessibleApplet.html">

AccessibleApplet</a></li>

</ul>

<ul title="java.rmi">

<li>Interfaces</li>

<li><a href="java.rmi.Remote.html">

Remote</a></li>

<li>Classes</li>

<li><a href="java.rmi.MarshalledObject.html">

MarshalledObject</a></li>

<li><a href="java.rmi.Naming.html">

Naming</a></li>

<li><a href="java.rmi.RMISecurityManager.html">

RMISecurityManager</a></li>

<li>Exceptions</li>

<li><a href="java.rmi.AccessException.html">

AccessException</a></li>

<li><a href="java.rmi.AlreadyBoundException.html">

AlreadyBoundException</a></li>

<li><a href="java.rmi.ConnectException.html">

ConnectException</a></li>

<li><a href="java.rmi.ConnectIOException.html">

ConnectIOException</a></li>

<li><a href="java.rmi.MarshalException.html">

MarshalException</a></li>

<li><a href="java.rmi.NoSuchObjectException.html">

NoSuchObjectException</a></li>

<li><a href="java.rmi.NotBoundException.html">

NotBoundException</a></li>

<li><a href="java.rmi.RemoteException.html">

RemoteException</a></li>

<li><a href="java.rmi.RMISecurityException.html">

RMISecurityException</a></li>

<li><a href="java.rmi.ServerError.html">

ServerError</a></li>

<li><a href="java.rmi.ServerException.html">

ServerException</a></li>

<li><a href="java.rmi.ServerRuntimeException.html">

ServerRuntimeException</a></li>

<li><a href="java.rmi.StubNotFoundException.html">

StubNotFoundException</a></li>

<li><a href="java.rmi.UnexpectedException.html">

UnexpectedException</a></li>

<li><a href="java.rmi.UnknownHostException.html">

UnknownHostException</a></li>

<li><a href="java.rmi.UnmarshalException.html">

UnmarshalException</a></li>

</ul>

　　图 8 显示了使用边对边列表生成的顶层选择包导航级别。

上一篇：手机中ESD和EMI干扰
下一篇：LTE TDD系统的设计分析

iPhone Eclipse 开发相关文章：

栏目分类