典型的应用程序生存期由一些状态组成:数据输入表单、结果界面、含有各种图像的相簿、含有项目的购物车等等。通常,应用程序执行繁 重的任务使用户在这些不同的界面中切换:新的界面替代原来的表单,突然在屏幕中弹出结果,图形和 GUI 对象时而从屏幕中跳出。一般而言 ,各个当前 UI 屏幕都会在操作完成后关闭,然后新的屏幕将取代它的位置。
HTML 应用程序就是一个很好的例子:在某个页面中填写一些数据,单击提交(Submit)按钮,原页面将消除,取而代之的是另一个全新的 用户界面。然后,您将仔细审视这个新界面,考虑自己应该做的事情并找到新的提交按钮。
如果应用程序在这些不同的应用程序状态之间创建一个更具逻辑性的流程,并为用户带来各个新用户界面(UI)会不会更好呢?如果用户不 用重新打量各个新用户界面,而是采用应用程序的流程化方式会怎么样呢?< /p>
这正是动画转换的内容:使应用程序用户界面的转换具有动画效果,从而在这些状态之间创建一个无缝的流程。通过帮助用户理解用户界面 之间的组合,转换可以帮助保证用户连接到程序。
当然,这个问题对开发人员而言意味着更多的工作。让应用程序消除一个界面并显示下一个界面是处理这种问题的最直观的方法。在界面之 间运行某种动画通常要求理解动画过程,然后编写一大堆自定义代码使界面上的元素具有动画效果。
这正是编写 动画转换 库的原因:从根本上简化应用程序状态之间动画的流程,执行合理的默认动画,以及让您专注于编写应用程序代码而 不是动画代码。
演示时间
我们来看一个简单的演示应用程序 FieldsOfText。该应用程序将模拟一个常见的功能(别处可能也有),用户可以请求 GUI 展开自己并提 供更多文本字段。比如说,我将使用一个类似于此的对话框将 至关重要的卡通画 上传到 我的 java.net 博客。应用程序开始只有一个文本字 段,但是通过单击 More 或者 Less 按钮可以增加或减少所显示的文本字段数量。
界面底部也有一个提交按钮,因此此类应用程序通常都有提交按钮。此处的按钮实际上并没有执行任何任务,不过它和其他用户界面元素的 作用一样,都是显示动画转换的过程。
以下是用于显示 GUI 的代码:
// Add the More/Less buttons container
add(moreOrLess);
// Next, add the proper number of text fields
for (int i = 0; i < numFields; ++i) {
add(textFields[i]);
}
// Finally, add the Submit button at the bottom
add(submitPanel);
在这段代码中, moreOrLess 组件是一个面板,用于保存 More 和 Less 按钮。 textFields[] 数组用于保存将要填充到 GUI 中的各种不 同的文本字段。而 numFields 表示我们希望此时显示的数量。 submitPanel 组件是一个面板,用于保存提交按钮。
下面是提供的用户的基本用户界面:
图 1. 应用程序的初始界面
当用户单击 More 按钮,原文本字段下面将增加一个文本字段,如下图所示:
图 2. 用户单击 More 按钮之后的应用程序界面