HK1197477B - Editing interface - Google Patents

Description

Translated fromChinese

编辑界面Editing interface

相关申请信息Related application information

本发明专利申请是国际申请号为PCT／US2008／074625、国际申请日为2008年08月28日、进入中国国家阶段日期为2010年04月21日、国家申请号为200880112570.2的发明专利申请的分案申请。This invention patent application is a divisional application of the invention patent application with international application number PCT/US2008/074625, international application date August 28, 2008, entry into the Chinese national phase date April 21, 2010, and national application number 200880112570.2.

技术领域Technical Field

公开的实施例涉及图形用户界面。The disclosed embodiments relate to graphical user interfaces.

背景技术Background Art

随着便携式设备变得更为紧凑，并且随着处理和存储的信息量的增加，设计允许用户容易地与设备交互的用户界面成为了一个重大挑战。这是不适宜的，因为用户界面不仅是用户接收内容的通道，而且还是响应用户动作或行为，包括用户试图访问设备的功能部件(feature)或工具的通道。某些便携式电子设备(例如，移动电话)借助于增加更多的按钮、重载按钮的功能或使用复杂的菜单系统，来允许用户访问、存储和操纵功能或数据。这些传统的用户界面通常导致用户必须记忆的复杂按键序列和菜单分层结构。As portable devices become more compact and the amount of information they process and store increases, designing a user interface that allows users to easily interact with the device has become a significant challenge. This is undesirable because the user interface is not only a conduit for users to receive content, but also a conduit for responding to user actions or behaviors, including attempts by users to access features or tools of the device. Some portable electronic devices (e.g., mobile phones) allow users to access, store, and manipulate functions or data by adding more buttons, overloading the functionality of buttons, or using complex menu systems. These traditional user interfaces often result in complex key sequences and menu hierarchies that users must memorize.

许多传统的用户界面，诸如包括物理按钮的用户界面，还是不灵活的。这是不适宜的，因为这种不灵活性可能阻碍由运行在便携式设备上的应用或由用户配置和／或调整用户界面。当结合有记忆多个按键序列和／或菜单分层结构的耗时要求时，这种不灵活性使得许多用户受到挫败。Many traditional user interfaces, such as those that include physical buttons, are also inflexible. This is undesirable because this inflexibility can hinder configuration and/or adjustment of the user interface by applications running on the portable device or by the user. When combined with the time-consuming requirement to memorize multiple key sequences and/or menu hierarchies, this inflexibility leads to frustration for many users.

某些传统的用户界面可由用户配置，从而允许至少部分的定制。不幸的是，修改这些传统的用户界面的处理通常与使用传统的用户界面本身一样麻烦和复杂。具体地，配置这些传统的用户界面的过程中所需的行为通常是不直观，并且指导用户动作的相应指示器通常难以理解。这些挑战通常是使用户感到更为受挫的来源。Some conventional user interfaces are user-configurable, allowing for at least partial customization. Unfortunately, the process of modifying these conventional user interfaces is often as cumbersome and complex as using the conventional user interface itself. Specifically, the required actions in configuring these conventional user interfaces are often unintuitive, and the corresponding indicators guiding user actions are often difficult to understand. These challenges are often a source of further frustration for users.

发明内容Summary of the Invention

一种便携式电子设备，在触敏显示器的用户界面的一个或多个区域内显示图标(例如，图形对象)，并且检测指出用户界面内的图标的位置交换的用户输入。在某些方面，可以选择用户界面内的两个图标的相应位置，以便在用户界面的一个或多个区域内交换位置，并且一个或两个图标可以改变其视觉外观，以便指示其选择状态。A portable electronic device displays icons (e.g., graphical objects) within one or more areas of a user interface of a touch-sensitive display and detects user input indicating that the positions of the icons within the user interface are swapped. In some aspects, respective positions of two icons within the user interface can be selected to swap positions within the one or more areas of the user interface, and one or both icons can change their visual appearance to indicate their selection status.

在某些实现中，一种方法包括：在触敏显示器的第一位置显示第一图标；在触敏显示器的第二位置显示第二图标；接收指出选择第一图标的第一触摸输入；响应第一触摸输入，修改第一图标的视觉外观；接收指示第一图标移动到第二图标附近区域内的第二触摸输入；和响应第二触摸输入，修改第二图标的视觉外观。In some implementations, a method includes: displaying a first icon at a first location on a touch-sensitive display; displaying a second icon at a second location on the touch-sensitive display; receiving a first touch input indicating a selection of the first icon; modifying a visual appearance of the first icon in response to the first touch input; receiving a second touch input indicating movement of the first icon into an area proximate to the second icon; and modifying the visual appearance of the second icon in response to the second touch input.

在某些实现中，一种方法包括：在触敏显示器的第一位置显示第一图标；接收指出选择所述图标的第一触摸输入；响应第一触摸输入，修改所述图标的视觉外观；接收指示所述图标移动到用户界面内的第二位置附近区域内的第二触摸输入；和响应第二触摸输入，修改第二位置的视觉外观。In some implementations, a method includes: displaying a first icon at a first location on a touch-sensitive display; receiving a first touch input indicating a selection of the icon; modifying a visual appearance of the icon in response to the first touch input; receiving a second touch input indicating movement of the icon to an area proximate to a second location within a user interface; and modifying the visual appearance of the second location in response to the second touch input.

在某些实现中，一种方法包括：在触敏显示器的第一页面内显示第一图标；接收指出选择第一图标的第一触摸输入；响应第一触摸输入，修改第一图标的视觉外观；接收指示第一图标移动到所述触敏显示器的边缘的附近区域内的第二触摸输入；响应第二触摸输入，显示所述触敏显示器的第二页面，第二页面包括第二图标；接收指示第一图标移动到第二图标附近区域内的第三触摸输入；和响应第三触摸输入，修改第二图标的视觉外观。In some implementations, a method includes: displaying a first icon within a first page of a touch-sensitive display; receiving a first touch input indicating a selection of the first icon; modifying a visual appearance of the first icon in response to the first touch input; receiving a second touch input indicating movement of the first icon into an area near an edge of the touch-sensitive display; displaying a second page of the touch-sensitive display in response to the second touch input, the second page including a second icon; receiving a third touch input indicating movement of the first icon into an area near the second icon; and modifying the visual appearance of the second icon in response to the third touch input.

附图说明BRIEF DESCRIPTION OF THE DRAWINGS

图1是用于便携式电子设备的位置调整的一个实施例的流程图；FIG1 is a flow chart of one embodiment for position adjustment of a portable electronic device;

图2A是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；2A is a diagram of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图2B是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；2B is an illustration of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图2C是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；2C is an illustration of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图2D是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；2D is an illustration of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图2E是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；2E is an illustration of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图3A是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；3A is a diagram of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图3B是响应调整一个或多个图标的位置的触摸输入的便携式电子设备的一个实施例的图示；3B is an illustration of one embodiment of a portable electronic device responsive to touch input to adjust the position of one or more icons;

图4是便携式电子设备的一个实施例的方框图；FIG4 is a block diagram of one embodiment of a portable electronic device;

图5是便携式电子设备的一个实施例的方框图，示出了对用户界面的一个或多个区域内的图标的重新定位；和5 is a block diagram of one embodiment of a portable electronic device illustrating the repositioning of icons within one or more areas of a user interface; and

图6是用于交换用户界面的图标的处理的一个实施例的流程图。6 is a flow diagram of one embodiment of a process for swapping icons of a user interface.

具体实施方式DETAILED DESCRIPTION

现在详细参考实施例，附图中示出了这些实施例的例子。在下面的详细描述中，阐述了若干特定细节，以便提供对本发明的完整理解。然而，本领域的技术人员将明了可以实现本发明而不使用这些特定细节。在其它情况下，不详细描述公知的方法、过程、组件和电路，以便不必要地模糊实施例的各方面。Reference will now be made in detail to the embodiments, examples of which are illustrated in the accompanying drawings. In the following detailed description, certain specific details are set forth in order to provide a complete understanding of the present invention. However, it will be apparent to those skilled in the art that the present invention can be practiced without these specific details. In other instances, well-known methods, procedures, components, and circuits have not been described in detail in order to unnecessarily obscure aspects of the embodiments.

界面重配置模式概述Interface Reconfiguration Mode Overview

现在关注具有图形用户界面(GUI)的便携式电子设备的实施例，包括便携式通信设备。该便携式设备包括界面重配置模式。响应用户启动界面重配置模式，可以相对于显示在便携式设备上的一个或多个图标的各自的平常位置改变这些图标的位置。一个或多个图标的位置变化可以包括动画显示一个或多个图标，以便模拟一个或多个图标在相应于便携式设备的显示器表面的表面上的浮动。显示器可以是触敏显示器，其响应输入笔或一个或多个手指在一个或多个接触点的物理接触。虽然下面的实施例可以等同地应用于其它类型的显示器，但使用触敏显示器作为说明性例子。Attention is now directed to embodiments of portable electronic devices, including portable communication devices, having a graphical user interface (GUI). The portable device includes an interface reconfiguration mode. In response to a user initiating the interface reconfiguration mode, the positions of one or more icons displayed on the portable device may be changed relative to their respective usual positions. The change in position of the one or more icons may include animating the one or more icons to simulate floating of the one or more icons on a surface corresponding to a display surface of the portable device. The display may be a touch-sensitive display that responds to physical contact by a stylus or one or more fingers at one or more contact points. Although the following embodiments are equally applicable to other types of displays, a touch-sensitive display is used as an illustrative example.

一个或多个图标的位置变化可以直观地向用户指示可由用户重新配置一个或多个图标的位置。用户可以修改、调整和／或重新配置一个或多个图标的位置。在便携式设备包括触敏显示器的实施例中，用户可以在第一位置处的相应图标附近接触触敏显示器。在与触敏显示器接触之后，相应图标可以停止改变其位置。用户可以将相应图标拖动到第二位置。在中断与触敏显示器的接触之后，相应图标可以继续改变其位置。在某些实施例中，显示可以包括两个区域。在界面重配置模式中，显示在第一区域中一个或多个图标的位置可以改变，而显示在第二区域内的一个或多个图标的位置可以是固定的。The change in position of one or more icons can intuitively indicate to the user that the position of one or more icons can be reconfigured by the user. The user can modify, adjust and/or reconfigure the position of one or more icons. In an embodiment where the portable device includes a touch-sensitive display, the user can contact the touch-sensitive display near the corresponding icon at a first position. After contact with the touch-sensitive display, the corresponding icon can stop changing its position. The user can drag the corresponding icon to a second position. After interrupting contact with the touch-sensitive display, the corresponding icon can continue to change its position. In some embodiments, the display may include two areas. In interface reconfiguration mode, the position of one or more icons displayed in the first area can be changed, while the position of one or more icons displayed in the second area can be fixed.

用户可以在界面重配置模式中简单地修改、调整和／或重新配置附加图标的位置。当用户已经完成这些变化时(至少暂时地)，他或她可以终止界面重配置模式。响应这种用户动作，便携式设备可以返回操作的正常模式，并且改变一个或多个图标的显示位置将停止。The user can simply modify, adjust, and/or reconfigure the positions of the additional icons while in the interface reconfiguration mode. When the user has completed these changes (at least temporarily), he or she can terminate the interface reconfiguration mode. In response to this user action, the portable device can return to a normal mode of operation, and the changes to the display position of one or more icons will cease.

用户可以通过选择便携式设备上的一个或多个适当的物理按钮、通过手势(诸如，以一个或多个手指在触敏显示器上接触并且挥动)和／或通过选择一个或多个软按钮(诸如，显示在触敏显示器上的一个或多个图标)启动或终止界面重配置处理。如此处使用的，手势是物体／附件(appendage)与触摸屏显示器表面接触的动作。在某些实施例中，在启动界面重配置处理预定时间之后，界面重配置处理将终止，即，存在超时。The user can initiate or terminate the interface reconfiguration process by selecting one or more appropriate physical buttons on the portable device, by a gesture (such as contacting and swiping one or more fingers on the touch-sensitive display), and/or by selecting one or more soft buttons (such as one or more icons displayed on the touch-sensitive display). As used herein, a gesture is the act of an object/appendage making contact with the surface of the touchscreen display. In some embodiments, the interface reconfiguration process will terminate a predetermined time after initiating the interface reconfiguration process, i.e., there is a timeout.

显示在便携式设备上的一个或多个图标可以是图形对象。在某些实施例中，所述一个或多个图标可以是专用接口工具集(widget，或称“窗口小插件”)，这些专用接口工具集是构成可由用户操作的控件，诸如，控制条、按钮和文本框的屏幕表示(on-screenrepresentation)的状态和过程的组合。在示例实施例中，所述一个或多个图标相应于可由用户通过在感兴趣的图标附近接触触敏显示器来选择的应用程序(电子邮件、浏览器、地址簿等)。One or more icons displayed on the portable device may be graphical objects. In some embodiments, the one or more icons may be specialized interface widgets, which are combinations of states and processes that constitute on-screen representations of user-operable controls, such as control bars, buttons, and text boxes. In an example embodiment, the one or more icons correspond to applications (email, browser, address book, etc.) that can be selected by the user by contacting the touch-sensitive display near the icon of interest.

图1是用于便携式电子设备的位置调整处理100的一个实施例的流程图。虽然下面描述的位置调整处理100包括以特定页序出现的若干操作，但是应当理解，处理100可以包括更多或更少的操作，这些操作可被串行或并行执行(例如，使用并行处理器或多线程环境)，可以改变两个或更多个操作的页序和／或可将两个或更多个操作组合为单个操作。1 is a flow chart of one embodiment of a position adjustment process 100 for a portable electronic device. Although the position adjustment process 100 described below includes several operations in a particular order, it should be understood that the process 100 may include more or fewer operations, that the operations may be performed serially or in parallel (e.g., using a parallel processor or a multi-threaded environment), that the order of two or more operations may be changed, and/or that two or more operations may be combined into a single operation.

在位置调整处理100中，多个图标被显示在触敏显示器内的GuI中(110)。检测启动界面重配置处理的第一预定用户动作(112)。示例的预定用户动作包括选择便携式设备上的物理按钮，在触摸屏显示器表面上做出预定手势，或选择软按钮。改变所显示的多个图标中的一个或多个图标的一个或多个位置(114)。检测在相应图标的第一位置处与触敏显示器的接触点(116)。检测该接触点移动到第二位置(118)。显示相应图标移动到第二位置，并且显示第二位置处的相应图标(120)。In a position adjustment process 100, a plurality of icons are displayed in a Gui within a touch-sensitive display (110). A first predetermined user action that initiates an interface reconfiguration process is detected (112). Example predetermined user actions include selecting a physical button on a portable device, making a predetermined gesture on a touch screen display surface, or selecting a soft button. One or more positions of one or more icons of the displayed plurality of icons are changed (114). A point of contact with the touch-sensitive display at a first position of a corresponding icon is detected (116). Movement of the point of contact to a second position is detected (118). Movement of the corresponding icon to the second position is displayed, and the corresponding icon at the second position is displayed (120).

如果检测到终止界面重配置处理的第二预定用户动作(122-“是”)，则固定一个或多个图标的一个或多个位置(124)。示例的预定用户动作包括选择或解除选择便携式设备上的物理按钮，在触摸屏显示器表面上做出另一个预定手势，或选择或解除选择软按钮。固定的一个或多个位置可以对应于一个或多个图标的相应的一个或多个平常位置。如果未检测到终止界面重配置处理的第二预定用户动作(122-“否”)，当检测到相同或另一个图标附近的接触点时，处理可以继续(116)。If a second predetermined user action is detected that terminates the interface reconfiguration process (122-"Yes"), then one or more positions of the one or more icons are fixed (124). Example predetermined user actions include selecting or deselecting a physical button on the portable device, making another predetermined gesture on the touch screen display surface, or selecting or deselecting a soft button. The fixed one or more positions can correspond to the corresponding one or more normal positions of the one or more icons. If a second predetermined user action is not detected that terminates the interface reconfiguration process (122-"No"), processing can continue when a contact point is detected near the same or another icon (116).

图2A是响应调整一个或多个图标的位置的触摸输入的便携式电子设备200的一个实施例的图示。便携式电子设备200包括具有GUI 210的触敏显示器。显示器表面是透明的，以便允许向用户显示各种图形对象(例如，专用接口工具集)。在某些实施例中，GUI 210被划分为多个部分或窗口。例如，GUI 210的区域212可以包括用于保持表示用户频繁使用的功能(例如，视频、天气、日程安排、游戏、音乐等)的图标或图形对象222的托盘216，以及用于保持表示用户较不频繁使用的功能(例如，邮件、地址簿、浏览器等)的图标或图形对象220的托盘214。GUI 210还可以包括相应于便携式电子设备200的高级别功能的图形对象。例如，通过按压菜单按钮240，可以在GUI 210中呈现和改变各种对象和／或图像。在包括移动电话的实施例中，可以在GUI 210中呈现表示传统语音和数据服务操作(例如，保持，清除等)的专用图形对象。FIG2A is a diagram of one embodiment of a portable electronic device 200 that responds to touch input to adjust the position of one or more icons. Portable electronic device 200 includes a touch-sensitive display having a GUI 210. The display surface is transparent to allow various graphical objects (e.g., a specialized interface tool set) to be displayed to the user. In some embodiments, GUI 210 is divided into multiple sections or windows. For example, region 212 of GUI 210 may include a tray 216 for holding icons or graphical objects 222 representing frequently used user functions (e.g., video, weather, schedule, games, music, etc.), and a tray 214 for holding icons or graphical objects 220 representing less frequently used user functions (e.g., mail, address book, browser, etc.). GUI 210 may also include graphical objects corresponding to high-level functions of portable electronic device 200. For example, by pressing menu button 240, various objects and/or images in GUI 210 may be presented and changed. In embodiments comprising a mobile telephone, dedicated graphical objects may be presented in GUI 210 that represent traditional voice and data service operations (eg, hold, clear, etc.).

用户可以通过使用输入笔、手指218(在图2中未按比例画出)或多于一个手指接触具有GUI 210的显示器表面，与便携式通信设备200交互。例如，用户可以在图标222之一的位置处接触显示器表面(直接接触)，从而激活相应于该图标的功能或应用程序。在某些实施例中，当用户接触该图标的位置，并且然后断开接触时(例如，敲击手势)，图标222被激活。在某些实施例中，用于激活图标的与显示器表面的接触可以不在图标222的位置处。而是该接触可以在图标222附近(非直接接触)。后一种技术类似于web页面和其它计算机用户界面使用的“热点”。The user can interact with the portable communication device 200 by contacting the display surface with the GUI 210 using a stylus, a finger 218 (not drawn to scale in FIG2 ), or more than one finger. For example, the user can contact the display surface at the location of one of the icons 222 (direct contact), thereby activating the function or application corresponding to the icon. In some embodiments, when the user contacts the location of the icon and then breaks contact (e.g., a tap gesture), the icon 222 is activated. In some embodiments, the contact with the display surface for activating the icon may not be at the location of the icon 222. Instead, the contact may be near the icon 222 (indirect contact). The latter technique is similar to the "hotspots" used by web pages and other computer user interfaces.

图2B-D示出了界面重配置模式中的便携式电子设备200。在启动界面重配置模式之后，托盘216中的一个或多个图标222的显示从以前的固定位置改变为随时间改变的位置。如前所述，该显示可以包括动画显示一个或多个图标222，以便模拟一个或多个图标222在相应于显示器表面的表面上的浮动。例如，界面重配置模式中一个或多个图标222的位置的动画改变可以类似于空中曲棍球游戏中的曲棍球(hockey puck)的位置改变。图标222中的相应图标的一个或多个显示位置可以在以相应图标的平常位置为中心的区域224中改变。2B-D illustrate the portable electronic device 200 in interface reconfiguration mode. After initiating interface reconfiguration mode, the display of one or more icons 222 in the tray 216 is changed from a previously fixed position to a position that changes over time. As previously described, the display can include animating the one or more icons 222 to simulate the floating of the one or more icons 222 on a surface corresponding to the display surface. For example, the animated change in position of the one or more icons 222 in interface reconfiguration mode can be similar to the change in position of a hockey puck in an air hockey game. The display position of one or more corresponding icons in the icons 222 can be changed in an area 224 centered around the normal position of the corresponding icon.

虽然图2B-2D示出了托盘216中的一个或多个图标222的移动，在其它实施例中，独立于或除了托盘216中的一个或多个图标222之外，可以改变GUI 210的另一个区域诸如托盘214内的一个或多个图标220的位置。Although Figures 2B-2D illustrate the movement of one or more icons 222 in the tray 216, in other embodiments, the position of one or more icons 220 in another area of the GUI 210, such as within the tray 214, can be changed independently of or in addition to the one or more icons 222 in the tray 216.

一个或多个图标222的随时间改变的一个或多个位置直观地向用户指示可以修改一个或多个图标222的位置。这被在图2C-D中示出，图2C-D示出了界面重配置模式中的便携式电子设备200。用户可以直接或非直接接触在位置226移动的图标之一，并且沿着具有GUI210的显示器表面移动接触点。由便携式电子设备200检测接触和移动。作为结果，在相应于游戏的这个例子中，相应地移动所显示的图标。The changing position or positions of one or more icons 222 over time visually indicates to the user that the position of one or more icons 222 can be modified. This is illustrated in Figures 2C-D, which show the portable electronic device 200 in interface reconfiguration mode. The user can directly or indirectly contact one of the icons moving at position 226 and move the contact point along the display surface with GUI 210. The contact and movement are detected by the portable electronic device 200. As a result, in this example corresponding to the game, the displayed icons are moved accordingly.

如图2D所示，用户将游戏图标移动到位置228，并且中断与显示器表面的接触。现在游戏图标显示在位置228。虽然在图2D中游戏图标的显示位置被示出为是固定的，但在某些实施例中，一旦用户断开与显示器表面的接触，游戏图标的位置可以改变。在某些实施例中，在界面重配置模式中，仅有显示在GUI 210的一个或多个子部分内的图标被以变化的位置显示。因此，如果游戏图标已被拖到托盘222中的另一个位置，则在用户断开与显示器的接触之后，它可被以变化的位置显示。As shown in Figure 2 D, the user moves the game icon to position 228, and interrupts contact with display surface.Now the game icon is presented at position 228. Although the display position of game icon is shown as being fixed in Figure 2 D, in certain embodiments, in case the user disconnects contact with display surface, the position of game icon can change.In certain embodiments, in the interface reconfiguration pattern, only have the icon that is presented in one or more subdivisions of GUI 210 to be shown in the position of variation.Therefore, if the game icon has been dragged to another position in the tray 222, then after the user disconnects contact with display, it can be shown in the position of variation.

图2D也示出了浏览器图标到位置230的可选择放置。由于至少部分地与游戏图标重叠，浏览器图标可被从其初始位置228放置到其新位置230，即，当便携式电子设备200确定用户将游戏图标定位在浏览器图标之上时，改变浏览器图标的显示位置。2D also illustrates an optional placement of the browser icon to location 230. The browser icon can be placed from its initial location 228 to its new location 230 due to at least partial overlap with the game icon, i.e., the displayed location of the browser icon is changed when the portable electronic device 200 determines that the user has positioned the game icon over the browser icon.

在其它实现中，当附加图标诸如浏览器图标被添加到托盘214内时，可以从托盘214中逐出或去除一个图标。例如，托盘214可被配置为容纳有限数目的图标，诸如4个图标。如果附加图标被添加到托盘214，与附加图标最近的图标或与附加图标至少部分地重叠的图标可被从托盘214中逐出或去除。In other implementations, when additional icons, such as a browser icon, are added to the tray 214, an icon may be evicted or removed from the tray 214. For example, the tray 214 may be configured to accommodate a limited number of icons, such as four icons. If additional icons are added to the tray 214, the icon closest to the additional icon or an icon that at least partially overlaps the additional icon may be evicted or removed from the tray 214.

图2E示出了已经终止或停止(由于超时)界面重配置模式之后的便携式电子设备200。GUI210中的图标具有固定的位置。游戏图标和浏览器图标被显示在它们在托盘214中的新位置处。2E shows the portable electronic device 200 after the interface reconfiguration mode has been terminated or stopped (due to timeout). The icons in the GUI 210 have fixed positions. The game icon and the browser icon are displayed at their new positions in the tray 214.

界面重配置模式中的动画效果，诸如，一个或多个图标222的变化的一个或多个位置，可以与具有GUI 210的显示器表面大体一致的平面内的一个或多个图标的相应运动方程为根据。运动方程可以具有允许模拟和／或动画显示一个或多个图标的浮动或滑动的小于一个阈值的摩擦系数。相应图标的运动方程可以具有非零的初始速度、非零的角速度和／或相对于相应图标的相应平常位置的恢复力，从而相应图标的位置在大体上以相应图标的相应平常位置为中心的区域224(图2D)中振荡。Animation effects in the interface reconfiguration mode, such as changing one or more positions of one or more icons 222, can be based on corresponding equations of motion for the one or more icons within a plane generally coincident with the display surface of the GUI 210. The equations of motion can have a coefficient of friction less than a threshold value that allows for simulation and/or animation of floating or sliding of the one or more icons. The equations of motion for the corresponding icons can have a non-zero initial velocity, a non-zero angular velocity, and/or a restoring force relative to the corresponding normal position of the corresponding icon, such that the position of the corresponding icon oscillates within a region 224 ( FIG. 2D ) generally centered about the corresponding normal position of the corresponding icon.

在某些实施例中，在界面重配置模式中，相应图标的位置可以这种方式改变，使得相应图标在保持相对于GUI 210和便携式电子设备200的固定取向的同时，绕着相应图标的相应平常位置旋转。这被在图3A和3B中示出，图3A和3B示出了界面重配置模式中的便携式电子设备200。在这个例子中，托盘216中的视频图标222的位置以这种方式改变，使得它在区域224中保持固定的取向。这可以使得用户在界面重配置模式中更易于确定相应图标的功能。In some embodiments, in interface reconfiguration mode, the position of the corresponding icon can be changed in such a way that the corresponding icon rotates about its usual position while maintaining a fixed orientation relative to GUI 210 and portable electronic device 200. This is illustrated in Figures 3A and 3B, which show portable electronic device 200 in interface reconfiguration mode. In this example, the position of video icon 222 in tray 216 is changed in such a way that it maintains a fixed orientation in area 224. This can make it easier for a user to determine the function of the corresponding icon in interface reconfiguration mode.

便携式电子设备体系结构Portable Electronic Device Architecture

现在关注便携式电子设备体系结构的实施例。图4是便携式电子设备的一个实施例的方框图。便携式电子设备400一般包括一个或多个计算机可读介质402、处理系统404、输入／输出(I／O)子系统406、射频(RF)电路408和音频电路410。这些组件可被以一个或多个通信总线或信号线403耦接。设备400可以是任意便携式电子设备，包括但不限于手持计算机、平板计算机、移动电话、媒体播放器、个人数字助理(PDA)等，包括这些项中的两个或更多个的组合。Now, attention is paid to an embodiment of a portable electronic device architecture. FIG4 is a block diagram of one embodiment of a portable electronic device. Portable electronic device 400 generally includes one or more computer-readable media 402, a processing system 404, an input/output (I/O) subsystem 406, radio frequency (RF) circuitry 408, and audio circuitry 410. These components may be coupled by one or more communication buses or signal lines 403. Device 400 may be any portable electronic device, including but not limited to a handheld computer, a tablet computer, a mobile phone, a media player, a personal digital assistant (PDA), and the like, including combinations of two or more of these items.

应当明了，图4所示的体系结构仅是便携式电子设备400的体系结构的一个例子，并且设备400可以具有比所示更多或更少的组件，或不同的组件配置。图4所示的各种组件可以硬件、软件或硬件和软件两者的组合实现，包括一个或多个信号处理和／或专用集成电路。RF电路408用于在无线链路或网络上向一个或多个其它设备发送和从一个或多个其它设备接收信息，并且包括用于执行该功能的公知电路，包括但不限于天线系统、RF收发器、一个或多个放大器、调谐器、一个或多个振荡器、数字信号处理器、编码解码芯片组、存储器等。在某些实施例中，RF电路408能够使用一种或多种通信协议建立并且保持与其它设备的通信，所述通信协议包括但不限于时分多址(TDMA)、码分多址(CDMA)、全球移动通信系统(GSM)、增强式数据GSM环境(EDGE)、宽带码分多址(W-CDMA)、Wi-Fi(诸如IEEE 802.11a、IEEE 802.11b、IEEE802.11g和／或IEEE802.11n)、蓝牙、Wi-MAX、语音电话(VoIP)、电子邮件协议、即时消息发送和／或短消息服务(SMS)、或任意其它适合的通信协议，包括提交本文档时尚未开发的通信协议。It should be understood that the architecture shown in FIG4 is only one example of an architecture for a portable electronic device 400, and that the device 400 may have more or fewer components than shown, or a different configuration of components. The various components shown in FIG4 may be implemented in hardware, software, or a combination of hardware and software, including one or more signal processing and/or application-specific integrated circuits. The RF circuitry 408 is used to send and receive information to and from one or more other devices over a wireless link or network, and includes well-known circuitry for performing this function, including but not limited to an antenna system, an RF transceiver, one or more amplifiers, a tuner, one or more oscillators, a digital signal processor, a codec chipset, memory, and the like. In certain embodiments, the RF circuitry 408 is capable of establishing and maintaining communications with other devices using one or more communication protocols, including, but not limited to, time division multiple access (TDMA), code division multiple access (CDMA), global system for mobile communications (GSM), enhanced data GSM environment (EDGE), wideband code division multiple access (W-CDMA), Wi-Fi (such as IEEE 802.11a, IEEE 802.11b, IEEE802.11g and/or IEEE802.11n), Bluetooth, Wi-MAX, voice over IP (VoIP), email protocols, instant messaging and/or short message service (SMS), or any other suitable communication protocols, including communication protocols not yet developed at the time of filing this document.

RF电路408和音频电路410通过外设接口416连接到处理系统404。接口416包括用于建立和保持外设和处理系统404之间的通信的各种已知组件。音频电路410耦接到音频扬声器450和麦克风452，并且包括用于处理从接口416接收的语音信号，以便使得用户能够实时地与其它用户通信的已知电路。在某些实施例中，音频电路410包括耳机插孔(未示出)。由RF电路408和音频电路410接收的语音和数据信息(例如，在语音识别或语音命令应用中)通过外设接口416被发送到一个或多个处理器418。一个或多个处理器418可配置为处理用于存储在介质402上的一个或多个应用程序430的各种数据格式。RF circuitry 408 and audio circuitry 410 are connected to processing system 404 via peripheral interface 416. Interface 416 includes various known components for establishing and maintaining communication between peripherals and processing system 404. Audio circuitry 410 is coupled to audio speaker 450 and microphone 452 and includes known circuitry for processing voice signals received from interface 416 so as to enable a user to communicate with other users in real time. In certain embodiments, audio circuitry 410 includes a headphone jack (not shown). Voice and data information received by RF circuitry 408 and audio circuitry 410 (e.g., in speech recognition or voice command applications) is sent to one or more processors 418 via peripheral interface 416. One or more processors 418 may be configured to process various data formats for one or more applications 430 stored on medium 402.

注意，术语“数据”包括但不限于可由存储在介质402上的一个或多个应用程序430(例如，web浏览器、电子邮件等)使用的文本、图形、Web页面、JAVA小程序、专用接口工具集、电子邮件、即时消息、语音、数字图像或视频、专用接口工具集、MP3等。在某些实施例中，设备400能够通过无线网络或外部端口436上传和从Internet下载各种数据，诸如，文件、歌曲、数字图像、视频、电子邮件、专用接口工具集、即时消息等。Note that the term "data" includes, but is not limited to, text, graphics, web pages, JAVA applets, specialized interface tool sets, emails, instant messages, voice, digital images or videos, specialized interface tool sets, MP3s, etc. that can be used by one or more application programs 430 (e.g., web browsers, emails, etc.) stored on the medium 402. In some embodiments, the device 400 is capable of uploading and downloading various data such as files, songs, digital images, videos, emails, specialized interface tool sets, instant messages, etc. to and from the Internet via a wireless network or external port 436.

外设接口416将该设备的输入和输出外设耦接到处理器418和计算机可读介质402。一个或多个处理器418通过控制器420与一个或多个计算机可读介质402通信。计算机可读介质402可以是可以存储由一个或多个处理器418使用的代码和／或数据的任意设备或介质。介质402可以包括存储器分层结构，包括但不限于，高速缓存、主存储器和辅助存储器。可以使用RAM(例如，SRAM、DRAM、DDRAM)、ROM、FLASH、磁和／或光存储设备，诸如盘驱动器、磁带、CD(压缩盘)和DVD(数字视盘)的任意组合实现存储器分层结构。介质402还可以包括用于承载指示计算机指令或数据的带有信息的信号的传输介质(具有或不具有信号在其上被调制的载波)。例如，传输介质可以包括通信网络，包括但不限于，Internet(也称为万维网)、一个或多个内联网、局域网(LAN)、广域网(WLAN)、存储区域网络(SAN)、城域网(MAN)等。Peripheral interface 416 couples the device's input and output peripherals to processor 418 and computer-readable media 402. One or more processors 418 communicate with one or more computer-readable media 402 via controller 420. Computer-readable media 402 can be any device or medium that can store code and/or data used by one or more processors 418. Media 402 can include a memory hierarchy, including, but not limited to, cache, main memory, and auxiliary memory. The memory hierarchy can be implemented using any combination of RAM (e.g., SRAM, DRAM, DDRAM), ROM, FLASH, magnetic and/or optical storage devices, such as disk drives, magnetic tape, CDs (compact disks), and DVDs (digital video disks). Media 402 can also include transmission media (with or without a carrier wave on which the signal is modulated) for carrying information-bearing signals indicating computer instructions or data. For example, transmission media can include communication networks, including, but not limited to, the Internet (also known as the World Wide Web), one or more intranets, local area networks (LANs), wide area networks (WLANs), storage area networks (SANs), metropolitan area networks (MANs), and the like.

一个或多个处理器418运行存储在媒介402中的各种软件组件以便执行设备400的各种功能。在某些实施例中，软件组件包括操作系统422、通信模块(或指令集合)424、接触／移动模块(或指令集合)426、图形模块(或指令集合)428、一个或多个应用(或指令集合)430、计时器模块(或指令集合)438和重配置模块(或指令集合)440。The one or more processors 418 execute various software components stored in the media 402 to perform various functions of the device 400. In some embodiments, the software components include an operating system 422, a communication module (or set of instructions) 424, a touch/motion module (or set of instructions) 426, a graphics module (or set of instructions) 428, one or more applications (or sets of instructions) 430, a timer module (or set of instructions) 438, and a reconfiguration module (or set of instructions) 440.

操作系统422(例如，Darwin、RTXC、UNUX、UNIX、OS X、WINDOWS或诸如VxWorks的嵌入式操作系统)包括各种程序、指令集合、软件组件和／或用于控制和管理一般系统任务的驱动程序(例如，存储器管理、存储设备控制、电源管理等)，并且使得便于在各种硬件和软件组件之间进行通信。The operating system 422 (e.g., Darwin, RTXC, UNUX, UNIX, OS X, WINDOWS, or an embedded operating system such as VxWorks) includes various programs, instruction sets, software components, and/or drivers for controlling and managing general system tasks (e.g., memory management, storage device control, power management, etc.), and facilitates communication between various hardware and software components.

通信模块424使得便于在一个或多个外部端口436上或通过RF电路408与其它设备通信，并且包括用于处理从RF电路408和／或外部端口436接收的数据的各种软件组件。外部端口436(例如，USB、FireWireTM等)适用于直接或通过网络(例如，Internet、无线LAN等)间接耦接其它设备。Communications module 424 facilitates communication with other devices on one or more external ports 436 or through RF circuitry 408 and includes various software components for processing data received from RF circuitry 408 and/or external ports 436. External ports 436 (e.g., USB, FireWire™, etc.) are suitable for coupling to other devices directly or indirectly through a network (e.g., the Internet, wireless LAN, etc.).

图形模块428包括用于在触敏显示器系统412的显示器表面上呈现、动画显示和显示图形对象的各种已知软件组件。注意，术语“图形对象”包括可被显示给用户的任意对象，包括但不限于文本、web页面、图标、数字图像、动画等。Graphics module 428 includes various known software components for rendering, animating, and displaying graphical objects on the display surface of touch-sensitive display system 412. Note that the term "graphic object" includes any object that can be displayed to a user, including but not limited to text, web pages, icons, digital images, animations, etc.

一个或多个应用430可以包括安装在设备400上的任意应用，包括但不限于，浏览器、地址簿、联系人列表、电子邮件、即时消息发送、字处理、键盘仿真、专用接口工具集、能够使用JAVA的应用、加密、数字版权管理、语音识别、语音复制、位置确定能力(诸如由全球定位系统(GPS)提供的)、音乐播放器(它回放存储在一个或多个文件内的记录的音乐，诸如MP3或AAC文件)等。The one or more applications 430 may include any application installed on the device 400, including, but not limited to, a browser, an address book, a contact list, email, instant messaging, word processing, keyboard emulation, a specialized interface tool set, JAVA-enabled applications, encryption, digital rights management, voice recognition, voice replication, location determination capabilities (such as provided by a global positioning system (GPS)), a music player (which plays back recorded music stored in one or more files, such as MP3 or AAC files), etc.

在某些实施例中，设备400可以包括MP3播放器诸如iPod(苹果计算机公司的商标)的功能。因此设备400可以包括与iPod兼容的36针连接器。在某些实施例中，设备400可以包括用于成像应用的一个或多个可选择的光学传感器(未示出)，诸如CMOS或CCD图像传感器。In some embodiments, device 400 may include the functionality of an MP3 player, such as an iPod (trademark of Apple Computer, Inc.). Thus, device 400 may include a 36-pin connector compatible with an iPod. In some embodiments, device 400 may include one or more optional optical sensors (not shown), such as CMOS or CCD image sensors, for imaging applications.

接触／移动模块426包括用于执行与触敏显示器系统412相关联的各种任务的各种软件组件，诸如前面参考图1-3的实施例所描述的软件组件。The contact/movement module 426 includes various software components for performing various tasks associated with the touch-sensitive display system 412 , such as the software components described above with reference to the embodiments of FIGS. 1-3 .

计时器模块438是用于界面重配置处理100(图1)的软件计时器。还可以用硬件实现计时器模块438。The timer module 438 is a software timer used in the interface reconfiguration process 100 (FIG. 1). The timer module 438 can also be implemented in hardware.

重配置模块440可以包括图标效果模块(或指令集合)442。图标效果模块442可以包括在界面重配置模式中用于图标的动画。在某些实施例中，图标效果模块442可以包括在图形模块428内。The reconfiguration module 440 may include an icon effects module (or set of instructions) 442. The icon effects module 442 may include animations for icons in the interface reconfiguration mode. In some embodiments, the icon effects module 442 may be included within the graphics module 428.

I／O子系统406耦接到触敏显示器系统412和用于控制或执行各种功能，诸如，电源控制、扬声器音量控制、振铃音量、键盘输入、滚动、保持、菜单、屏幕锁、清除和结束通信等的一个或多个物理控制设备414(例如，按钮、开关、刻度盘、LED等)。触敏显示器412通过触敏屏幕控制器432与处理系统404通信，触敏屏幕控制器432包括用于处理用户输入的各种组件(例如，扫描硬件)。一个或多个其它输入控制器434从／向其它输入或控制设备414接收／发送电信号。其它输入／控制设备414可以包括物理按钮(例如，按压按钮、摇杆按钮等)、刻度盘、滑块开关、操纵杆等。The I/O subsystem 406 is coupled to a touch-sensitive display system 412 and one or more physical control devices 414 (e.g., buttons, switches, dials, LEDs, etc.) for controlling or performing various functions, such as power control, speaker volume control, ringer volume, keyboard input, scrolling, hold, menus, screen lock, clearing and ending communications, etc. The touch-sensitive display 412 communicates with the processing system 404 via a touch-sensitive screen controller 432, which includes various components for processing user input (e.g., scanning hardware). One or more other input controllers 434 receive and send electrical signals to/from other input or control devices 414. Other input/control devices 414 may include physical buttons (e.g., push buttons, rocker buttons, etc.), dials, slider switches, joysticks, etc.

触敏显示器412在GUI中向用户显示视觉输出。视觉输出可以包括文本、图形、视频和其任意组合。某些或全部视觉输出可以相应于用户界面对象。触敏显示器412还可以基于触感和／或感触接触接受来自用户的输入。触敏显示器412构成接受用户输入的触敏表面。触敏显示器412和触摸屏控制器432(以及介质402中的任意相关联的模块和／或指令集合)检测触敏显示器412上的接触(以及接触的任意移动或释放)，并且将检测到的接触转换为与用户界面对象，诸如，当接触发生时显示在触摸屏上的一个或多个软按键的交互。在示例实施例中，触敏显示器412和用户之间的接触点相应于用户的一个或多个数字。触敏显示器412可以使用LCD(液晶显示器)技术，或LPD(发光聚合物显示器)技术，虽然在其它实施例中也可以使用其它显示器技术。触敏显示器412和触摸屏控制器432可以使用多种触敏技术中的任意一种检测接触和其任意移动或释放，包括但不限于，电容式、电阻式、红外线和表面声波技术，以及其它接近传感器阵列或用于确定与触敏显示器412的一个或多个接触点的其它元件。The touch-sensitive display 412 displays visual output to the user in the GUI. The visual output can include text, graphics, video, and any combination thereof. Some or all of the visual output can correspond to user interface objects. The touch-sensitive display 412 can also accept input from the user based on tactile and/or tactile contact. The touch-sensitive display 412 constitutes a touch-sensitive surface for accepting user input. The touch-sensitive display 412 and the touch screen controller 432 (and any associated modules and/or instruction sets in the medium 402) detect contact (and any movement or release of contact) on the touch-sensitive display 412 and convert the detected contact into interaction with user interface objects, such as one or more soft keys displayed on the touch screen when the contact occurs. In an example embodiment, the point of contact between the touch-sensitive display 412 and the user corresponds to one or more digits of the user. The touch-sensitive display 412 can use LCD (liquid crystal display) technology or LPD (light emitting polymer display) technology, although other display technologies can also be used in other embodiments. The touch-sensitive display 412 and touch screen controller 432 can detect contact and any movement or release thereof using any of a variety of touch-sensitive technologies, including but not limited to capacitive, resistive, infrared, and surface acoustic wave technologies, as well as other proximity sensor arrays or other elements for determining one or more points of contact with the touch-sensitive display 412.

触敏显示器可以类似于在下列美国专利中描述的多点触敏板：6，323，846(Westerman等)，6，570，557(Westerman等)和／或6，677，932(Westerman），和／或美国专利公开2002／0015024Al，通过引用将它们中的每一个结合在此。然而，触摸屏126显示来自便携式设备的视觉输出，而触敏板不提供视觉输出。触敏显示器412可以具有超过100dpi的分辨率。在示例实施例中，触敏显示器412可以具有近似168dpi的分辨率。用户可以使用任意适合的物体或附件，诸如，输入笔、钢笔、手指等接触触敏显示器412。The touch-sensitive display can be similar to the multi-touch-sensitive pads described in the following U.S. Patents: 6,323,846 (Westerman et al.), 6,570,557 (Westerman et al.), and/or 6,677,932 (Westerman), and/or U.S. Patent Publication 2002/0015024 A1, each of which is incorporated herein by reference. However, the touch screen 126 displays visual output from the portable device, while the touch-sensitive pad does not provide visual output. The touch-sensitive display 412 can have a resolution exceeding 100 dpi. In an example embodiment, the touch-sensitive display 412 can have a resolution of approximately 168 dpi. The user can contact the touch-sensitive display 412 using any suitable object or accessory, such as a stylus, pen, finger, etc.

在某些实施例中，除了触摸屏之外，设备400可以包括用于激活或去活特定功能的触摸垫(未示出)。在某些实施例中，触摸垫是设备的一个触敏区域，不同于触摸屏，它不显示视觉输出。触摸垫可以是与触敏显示器412分离的触敏表面，或是由触敏显示器412构成该触敏表面的延伸部分。In some embodiments, in addition to the touch screen, device 400 may include a touchpad (not shown) for activating or deactivating specific functions. In some embodiments, the touchpad is a touch-sensitive area of the device that, unlike the touch screen, does not display visual output. The touchpad can be a separate touch-sensitive surface from touch-sensitive display 412 or an extension of the touch-sensitive surface formed by touch-sensitive display 412.

设备400还包括用于给各种硬件组件供电的电源系统444。电源系统444可以包括电源管理系统、一个或多个电源(例如，电池、交流电(AC))、充电系统、电源故障检测电路、功率转换器或倒相器、电源状态指示器(例如，发光二极管(LED))和通常与便携式设备中的电能产生、管理和分配相关联的任意其它组件。Device 400 also includes a power system 444 for powering the various hardware components. Power system 444 may include a power management system, one or more power sources (e.g., batteries, alternating current (AC)), a charging system, power failure detection circuitry, a power converter or inverter, a power status indicator (e.g., a light emitting diode (LED)), and any other components typically associated with power generation, management, and distribution in a portable device.

在某些实施例中，外设接口416、一个或多个处理器418和存储器控制器420可在单个芯片上实现，诸如处理系统404。在某些其它实施例中，它们可在不同芯片上实现。In some embodiments, peripheral interface 416, one or more processors 418, and memory controller 420 may be implemented on a single chip, such as processing system 404. In some other embodiments, they may be implemented on different chips.

重定位图标Relocation Icon

图5是便携式电子设备的一个例子的方框图，示出了用户界面中的一个或多个区域内的用户界面元素(此后一般地称为“图标”)的重定位。在某些实现中，用户在设备(例如，便携式电子设备500)的用户界面501内重定位一个或多个图标502。在某些实现中，用户可以在设备500上启动界面重配置模式。在界面重配置模式中时，可由用户在用户界面501内重定位一个或多个图标502。在界面重配置模式中时，用户可以触摸图标502之一，并且将其拖到用户界面501上所希望的新位置。例如，用户可以将从图标502中选择的图标508拖到托盘504中空的或已被占据的位置，在图标508被拖到已被占据的位置的情况下，以图标508取代占据的图标512。Figure 5 is a block diagram of an example of a portable electronic device illustrating the repositioning of user interface elements (hereinafter generally referred to as "icons") within one or more areas of a user interface. In some implementations, a user repositions one or more icons 502 within a user interface 501 of a device (e.g., portable electronic device 500). In some implementations, a user can initiate an interface reconfiguration mode on device 500. While in interface reconfiguration mode, one or more icons 502 can be repositioned within user interface 501 by a user. While in interface reconfiguration mode, a user can touch one of icons 502 and drag it to a desired new location on user interface 501. For example, a user can drag an icon 508 selected from icons 502 to an empty or occupied location in tray 504, whereby icon 508 replaces the occupied icon 512.

在某些实现中，当设备500进入界面重配置模式时，可移动的图标502可以按比例缩放的大小(例如缩放到150)被显示当设备500退出界面重配置模式时，图标502可被以其初始大小显示。可替换地，以按比例缩放的大小显示设备500处于界面重配置模式时用户触摸并且移动的一个图标(与所有可移动图标502相对比)，以便向用户指示其选择状态。当触摸停止时，图标可再次被以其它初始大小显示在其它实现中，所选择的图标可以改变颜色、动画显示、闪烁、改变形状、显示文本或以其它方式修改其视觉外观。除了改变其视觉外观之外，设备500可以发出可听到的声音(例如，音调、音调序列)以便指示其选择状态。在某些实现中，可以允许重定位图标而不用进入设备500上的重配置模式。In some implementations, when device 500 enters interface reconfiguration mode, movable icon 502 can be displayed with a scaled size (e.g., scaled to 150). When device 500 exits interface reconfiguration mode, icon 502 can be displayed with its initial size. Alternatively, when device 500 is in interface reconfiguration mode with a scaled size display device 500, a user touches and moves an icon (compared with all movable icons 502) to indicate its selected state to the user. When touching stops, the icon can be displayed in other implementations with other initial sizes again, and the selected icon can change color, animate, flicker, change shape, display text, or otherwise modify its visual appearance. Except changing its visual appearance, device 500 can send an audible sound (e.g., tone, tone sequence) to indicate its selected state. In some implementations, repositioning icons can be allowed without entering the reconfiguration mode on device 500.

在某些实现中，图标可以被显示在多个“页面”内，并且用户可以在这些页面之间导航，其例子描述于2007年9月4日提交的题目为″Application Menu User Interface″的美国专利申请No.11／850,005，通过引用将该专利申请完整结合在此。在这种实现中，用户可以将图标从第一图标页面拖到第二图标页面。例如，用户可以触摸并且拖动第一页面内的图标，并且将该图标拖向用户界面501的边缘。当该图标被拖到距用户界面501的边缘预定距离(例如，5个像素)内时，显示在用户界面501上的第一图标页面可被第二图标页面取代。用户可以将拖动的图标定位在现在显示在用户界面501上的第二页面内。In some implementations, icons may be displayed in multiple "pages" and the user may navigate between these pages, an example of which is described in U.S. patent application No. 11/850,005, filed on September 4, 2007, entitled "Application Menu User Interface," which is incorporated herein by reference in its entirety. In such an implementation, a user may drag an icon from a first page of icons to a second page of icons. For example, a user may touch and drag an icon within a first page and drag the icon toward an edge of user interface 501. When the icon is dragged within a predetermined distance (e.g., 5 pixels) from the edge of user interface 501, the first page of icons displayed on user interface 501 may be replaced by the second page of icons. The user may position the dragged icon within the second page now displayed on user interface 501.

在某些实现中，用户可以将第一图标拖向用户界面501内的第二图标，以便交换两个图标在用户界面501内的位置。在该情况下，可以用附加的图形效果显示第二图标，以便指示其与第一图标交换或取代第一图标的选择状态。例如，可以用从高强度(例如，明亮)到低强度(例如，暗淡)并且返回高强度的振荡的视觉强度显示第二图标。作为另一个例子，可以用“发光”效果显示第二图标。在某些实现中，当第一图标被移动到第二图标的预定距离内时，可以触发应用于第二图标的附加图形效果。In some implementations, a user can drag a first icon toward a second icon within user interface 501 to swap the positions of the two icons within user interface 501. In this case, the second icon can be displayed with an additional graphical effect to indicate that it has swapped with or replaced the selected state of the first icon. For example, the second icon can be displayed with an oscillating visual intensity from high intensity (e.g., bright) to low intensity (e.g., dim) and back to high intensity. As another example, the second icon can be displayed with a "glow" effect. In some implementations, when the first icon is moved within a predetermined distance of the second icon, the additional graphical effect applied to the second icon can be triggered.

图5示出了示例的移动设备500，其中第一图标508被移动到位于托盘504中的第二图标512的附近位置。该附近位置可以是以边界510示出的距离图标512外围的x个像素(例如，1个像素)。当移动第一图标508，从而第一图标508的任意部分位于由边界510封闭的区域内时，可以用附加的图形效果显示第二图标512，诸如例如，发光效果或振荡的强度。在某些实现中，当用户在第二图标512上释放对第一图标508的触摸，并且从而交换它们的位置时，或当用户将第一图标508移动到由边界510封闭的区域之外时，可以不显示附加的图形效果。在某些实现中，第一图标508可被重定位在托盘504内的空白位置。在这种实现中，可以显示轮廓510，以便指示托盘504内的当用户释放触摸时第一图标508将可以位于的空白位置。可以提供其它视觉反馈，以便指示托盘504内的空白或可用位置，诸如改变托盘504内的位置的颜色或不透明度，或在托盘504内的位置处应用图形、图案覆盖或动画对象。FIG5 shows an example mobile device 500 in which a first icon 508 is moved to a position adjacent to a second icon 512 in a tray 504. The position adjacent to the first icon 508 may be x pixels (e.g., 1 pixel) from the periphery of the icon 512, as shown by a border 510. When the first icon 508 is moved so that any portion of the first icon 508 is within the area enclosed by the border 510, the second icon 512 may be displayed with additional graphical effects, such as, for example, a glowing effect or oscillating intensity. In some implementations, when the user releases the touch of the first icon 508 on the second icon 512 and thereby swaps their positions, or when the user moves the first icon 508 outside the area enclosed by the border 510, the additional graphical effects may not be displayed. In some implementations, the first icon 508 may be relocated to an empty position within the tray 504. In such an implementation, an outline 510 may be displayed to indicate an empty position within the tray 504 where the first icon 508 will be located when the user releases the touch. Other visual feedback may be provided to indicate empty or available locations within tray 504 , such as changing the color or opacity of a location within tray 504 , or applying a graphic, pattern overlay, or animated object at the location within tray 504 .

交换图标位置的处理Processing of swapping icon positions

图6是用于交换用户界面的图标的示例处理600的流程图。在某些实现中，处理600包括在触敏显示器的第一位置显示第一图标(602)。触敏显示器可以是响应手指手势和触摸的多点触敏显示器。第二图标被显示在触敏显示器的第二位置，或与触敏显示器的第二位置相关联(604)。在某些实现中，第一和第二图标位置可以是用户界面的不同区域。例如，第一区域可用于显示第一组图标，并且第二区域可以是托盘、码头(dock)、菜单条、第二页面或能够以在视觉上区别于第一组图标或以其它方式突出显示第二组图标的方式显示第二组图标的任意其它用户界面元素。第二组图标可以包括频繁使用的图标或具有共同性质或属性(例如，应用图标)的图标。Figure 6 is a flow chart of an example process 600 for exchanging icons of a user interface. In some implementations, process 600 includes displaying a first icon at a first position on a touch-sensitive display (602). The touch-sensitive display can be a multi-touch-sensitive display that responds to finger gestures and touches. A second icon is displayed at a second position on the touch-sensitive display, or is associated with a second position on the touch-sensitive display (604). In some implementations, the first and second icon positions can be different areas of the user interface. For example, the first area can be used to display a first group of icons, and the second area can be a tray, a dock, a menu bar, a second page, or any other user interface element that can display the second group of icons in a manner that is visually distinguishable from the first group of icons or that otherwise highlights the second group of icons. The second group of icons can include frequently used icons or icons with common properties or attributes (e.g., application icons).

处理600接收指出选择第一图标的第一触摸输入(606)。可以用手指或输入笔执行触摸。响应第一触摸输入，修改第一图标的视觉外观(608)。修改第一图标的视觉外观的某些例子包括但不限于：按比例缩放、改变颜色、振动、跳动、显示文本、动画显示等。Process 600 receives a first touch input indicating a selection of a first icon (606). The touch may be performed using a finger or a stylus. In response to the first touch input, the visual appearance of the first icon is modified (608). Some examples of modifying the visual appearance of the first icon include, but are not limited to, scaling, changing color, vibrating, pulsing, displaying text, animating, and the like.

处理600接收指出第一图标移动到第二图标附近区域内的第二触摸输入(610)。所述移动可以是在显示器上拖动第一图标。在某些实现中，当作为所述移动的结果或响应所述移动，第一图标触及或越过至少部分地围绕第二图标的(透明的或不透明的)边界线时，发生接近第二图标。Process 600 receives a second touch input indicating movement of a first icon into a vicinity of a second icon (610). The movement may be dragging the first icon on the display. In some implementations, proximity to the second icon occurs when, as a result of or in response to the movement, the first icon touches or crosses a (transparent or opaque) border line that at least partially surrounds the second icon.

响应第二触摸输入，可以修改第二图标的视觉外观(612)。修改第二图标的某些例子包括但不限于：按比例缩放、应用发光效果、改变颜色、振动、跳动、动画显示等。In response to the second touch input, the visual appearance of the second icon can be modified (612). Some examples of modifying the second icon include, but are not limited to: scaling, applying a glow effect, changing color, vibrating, bouncing, animating, etc.

出于说明和描述的目的给出特定实施例的上述描述。它们不旨在是无遗漏的，或将本发明局限于公开的精确形式。而是应当理解，鉴于上述教导，可以有许多修改和变形。选择并且描述这些实施例，以便最好地解释本发明的原理和其实际应用，从而使得本领域的技术人员能够最好地利用本发明以及具有适合于构想的特定用途的各种修改的各种实施例。The foregoing descriptions of specific embodiments have been presented for purposes of illustration and description. They are not intended to be exhaustive or to limit the invention to the precise forms disclosed. Rather, it should be understood that numerous modifications and variations are possible in light of the above teachings. These embodiments were chosen and described in order to best explain the principles of the invention and its practical application, thereby enabling those skilled in the art to best utilize the invention and various embodiments with various modifications as are suited to the particular use contemplated.

Claims (16)

Translated fromChinese

1.一种用于重新配置设备的触敏显示器上显示的用户界面的图标的方法，其中所述用户界面包括第一页面的图标和第二页面的图标，所述方法包括：1. A method for reconfiguring icons of a user interface displayed on a touch-sensitive display of a device, wherein the user interface includes icons of a first page and icons of a second page, the method comprising:在所述触敏显示器上的应用程序菜单用户界面中同时显示第一区域和第二区域，所述第一区域被配置为显示多页面的应用程序图标，所述第一区域显示所述多页面的应用程序图标中的第一页面的应用程序图标，所述第一页面的应用程序图标包括在第一位置处的第一应用程序图标，所述第二区域包括在所述第一区域和所述触敏显示器的底部之间的一组应用程序图标；Simultaneously displaying a first area and a second area in an application menu user interface on the touch-sensitive display, the first area being configured to display multiple pages of application icons, the first area displaying application icons of a first page of the multiple pages of application icons, the application icons of the first page including a first application icon at a first position, and the second area including a group of application icons between the first area and a bottom of the touch-sensitive display;当在所述触敏显示器上的应用程序菜单用户界面中同时显示所述第一区域和所述第二区域时：When the first area and the second area are displayed simultaneously in an application menu user interface on the touch-sensitive display:检测在所述第一页面的应用程序图标中的所述第一应用程序图标上的第一用户输入，所述第一用户输入指定所述第一应用程序图标的选择；detecting a first user input on the first application icon among the application icons on the first page, the first user input specifying a selection of the first application icon;响应检测到所述第一用户输入，进入所述界面重配置模式；In response to detecting the first user input, entering the interface reconfiguration mode;当在所述界面重配置模式中时：While in the interface reconfiguration mode:检测第二用户输入，其中所述第二用户输入包括拖动触摸输入，所述拖动触摸输入通过手指接触而不中断与所述触敏显示器的接触，以及所述拖动触摸输入在第一位置处开始，并且从所述第一位置移除第二应用程序图标并将所述第二应用程序图标移动到所述触敏显示器的边缘附近；和detecting a second user input, wherein the second user input comprises a drag touch input that is contacted by a finger without breaking contact with the touch-sensitive display and that begins at a first location and removes a second application icon from the first location and moves the second application icon proximate an edge of the touch-sensitive display; and响应检测到将所述第二应用程序图标移动到所述触敏显示器的边缘附近的所述第二用户输入，在所述应用程序菜单用户界面的所述第一区域中用所述第二页面的应用程序图标代替所述第一页面的应用程序图标，并且保持在所述第一区域与所述触敏显示器的所述底部之间的所述第二区域的显示。In response to detecting the second user input to move the second application icon to near the edge of the touch-sensitive display, the application icons of the first page are replaced with the application icons of the second page in the first area of the application menu user interface, and the display of the second area between the first area and the bottom of the touch-sensitive display is maintained.2.根据权利要求1所述的方法，其中检测所述第二用户输入包括检测所述图标已经被移动到所述用户界面的边缘的预定距离内的位置。2 . The method of claim 1 , wherein detecting the second user input comprises detecting that the icon has been moved to a position within a predetermined distance of an edge of the user interface.3.根据权利要求1或2所述的方法，还包括在进入所述界面重配置模式时改变可移动的图标的外观。3 . The method according to claim 1 , further comprising changing the appearance of movable icons when entering the interface reconfiguration mode.4.根据权利要求1或2所述的方法，还包括检测用于移动第一图标到所述用户界面的第二图标的附近区域内的用户输入，并且响应检测到所述用户输入，交换所述用户界面中所述第一图标和所述第二图标的位置。4. The method according to claim 1 or 2 also includes detecting user input for moving the first icon to a vicinity of the second icon in the user interface, and in response to detecting the user input, exchanging the positions of the first icon and the second icon in the user interface.5.根据权利要求4所述的方法，其中检测所述用户输入包括检测所述第一图标的引起所述第一图标的一部分触摸或跨过与所述第二图标相关联的边界线的移动。5 . The method of claim 4 , wherein detecting the user input comprises detecting movement of the first icon that causes a portion of the first icon to touch or cross a boundary line associated with the second icon.6.根据权利要求5所述的方法，还包括响应检测到用于移动所述第一图标到所述第二图标的附近区域内的所述用户输入，修改所述第二图标的外观。6 . The method of claim 5 , further comprising modifying the appearance of the second icon in response to detecting the user input for moving the first icon into the vicinity of the second icon.7.根据权利要求权利要求5-6中的任一项所述的方法，其中所述第二图标位于所述用户界面的码头、托盘或菜单条中。7. The method according to any one of claims 5-6, wherein the second icon is located in a dock, a tray or a menu bar of the user interface.8.根据权利要求5-6中的任一项所述的方法，还包括：8. The method according to any one of claims 5 to 6, further comprising:检测用于在所述第二页面内移动所述图标的第三用户输入；以及detecting a third user input for moving the icon within the second page; and响应检测到所述第三用户输入，将所述图标定位在所述第二页面上的第二位置处。In response to detecting the third user input, the icon is positioned at a second location on the second page.9.一种电子设备，包括：9. An electronic device comprising:触敏显示器；touch-sensitive displays;一个或多个处理器；one or more processors;存储器；Memory;用于在所述触敏显示器上显示包括第一页面的图标和第二页面的图标的用户界面的装置；means for displaying on the touch-sensitive display a user interface comprising icons for a first page and icons for a second page;用于检测用于启动用于多个图标的界面重配置模式的第一用户输入的装置；means for detecting a first user input for initiating an interface reconfiguration mode for the plurality of icons;用于在所述触敏显示器上的应用程序菜单用户界面中同时显示第一区域和第二区域的装置，所述第一区域被配置为显示多页面的应用程序图标，所述第一区域显示所述多页面的应用程序图标中的第一页面的应用程序图标，所述第一页面的应用程序图标包括在第一位置处的第一应用程序图标，所述第二区域包括在所述第一区域和所述触敏显示器的底部之间的一组应用程序图标；means for simultaneously displaying a first area and a second area in an application menu user interface on the touch-sensitive display, the first area being configured to display multiple pages of application icons, the first area displaying application icons for a first page of the multiple pages of application icons, the application icons for the first page including a first application icon at a first position, and the second area including a group of application icons between the first area and a bottom of the touch-sensitive display;装置，当在所述触敏显示器上的应用程序菜单用户界面中同时显示所述第一区域和所述第二区域时：apparatus, when the first area and the second area are displayed simultaneously in an application menu user interface on the touch-sensitive display:响应检测到在所述第一页面的应用程序图标中的所述第一应用程序图标上的所述第一用户输入，所述第一用户输入指定所述第一应用程序图标的选择；in response to detecting the first user input on the first application icon among the application icons on the first page, the first user input specifying selection of the first application icon;当在所述界面重配置模式中时，用于检测第二用户输入的装置，其中所述第二用户输入包括拖动触摸输入，所述拖动触摸输入通过手指接触而不中断与所述触敏显示器的接触，以及所述拖动触摸输入在第一位置处开始，并且从所述第一位置移除第二应用程序图标并将所述第二应用程序图标移动到所述触敏显示器的边缘附近；和while in the interface reconfiguration mode, means for detecting a second user input, wherein the second user input comprises a drag touch input that is contacted by a finger without breaking contact with the touch-sensitive display, and the drag touch input begins at a first location and removes a second application icon from the first location and moves the second application icon proximate an edge of the touch-sensitive display; and响应检测到将所述第二应用程序图标移动到所述触敏显示器的边缘附近的所述第二用户输入，用于在所述应用程序菜单用户界面的所述第一区域中用所述第二页面的应用程序图标代替所述第一页面的应用程序图标，并且保持在所述第一区域与所述触敏显示器的所述底部之间的所述第二区域的显示的装置。In response to detecting the second user input to move the second application icon to near the edge of the touch-sensitive display, a device for replacing the application icons of the first page with the application icons of the second page in the first area of the application menu user interface, and maintaining display of the second area between the first area and the bottom of the touch-sensitive display.10.根据权利要求9所述的电子设备，其中用于检测所述第二用户输入的装置包括用于检测所述图标已经被移动到所述用户界面的边缘的预定距离内的位置的装置。10. The electronic device of claim 9, wherein the means for detecting the second user input comprises means for detecting that the icon has been moved to a position within a predetermined distance of an edge of the user interface.11.根据权利要求9或10所述的电子设备，还包括：11. The electronic device according to claim 9 or 10, further comprising:用于在进入所述界面重配置模式时改变可移动的图标的外观的装置。Means for changing the appearance of the movable icons upon entering the interface reconfiguration mode.12.根据权利要求9至10中的任一项所述的电子设备，还包括：12. The electronic device according to any one of claims 9 to 10, further comprising:用于检测用于移动第一图标到所述用户界面的第二图标的附近区域内的用户输入，并且响应检测到所述用户输入，交换所述用户界面中所述第一图标和所述第二图标的位置的装置。Means for detecting user input for moving a first icon into a vicinity of a second icon in the user interface, and in response to detecting the user input, swapping positions of the first icon and the second icon in the user interface.13.根据权利要求12所述的电子设备，其中用于检测所述用户输入的装置包括用于检测所述第一图标的引起所述第一图标的一部分触摸或跨过与所述第二图标相关联的边界线的移动的装置。13. The electronic device of claim 12, wherein the means for detecting the user input comprises means for detecting movement of the first icon that causes a portion of the first icon to touch or cross a boundary line associated with the second icon.14.根据权利要求12所述的电子设备，还包括：14. The electronic device according to claim 12, further comprising:用于响应检测到用于移动所述第一图标到所述第二图标的附近区域内的所述用户输入，修改所述第二图标的外观的装置。Means for modifying the appearance of the second icon in response to detecting the user input for moving the first icon into the vicinity of the second icon.15.根据权利要求13-14中的任一项所述的电子设备，其中所述第二图标位于所述用户界面的码头、托盘或菜单条中。15. The electronic device of any one of claims 13-14, wherein the second icon is located in a dock, a tray, or a menu bar of the user interface.16.根据权利要求9-10和13-14中的任一项所述的电子设备，还包括：16. The electronic device according to any one of claims 9-10 and 13-14, further comprising:用于检测用于在所述第二页面内移动所述图标的第三用户输入的装置；以及means for detecting a third user input for moving the icon within the second page; and响应检测到所述第三用户输入，用于将所述图标定位在所述第二页面上的第二位置处装置。In response to detecting the third user input, means is provided for positioning the icon at a second location on the second page.