System, method and user interface for interacting with multiple application windows
By using display generation components and input devices on handheld electronic devices, an intuitive interactive method of multitasking is realized, and the user experience problem of the device when interacting with multitasking and application is solved, improving user experience and efficiency.
Patent Information
- Application Number
- CN202011108005.8
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Priority Date
- 2019-09-24
- Filing Date
- 2020-03-30
- Publication Date
- 2024-12-31
- Estimated Expiration
- 2040-03-30
AI Technical Summary
Existing handheld electronic devices lack intuitive and easy-to-use systems and methods when interacting between multitasking and applications, especially due to differences in screen size and input mechanisms, resulting in poor user experience.
The intuitive and seamless interactive approach of multitasking is achieved by using display generation components and input devices on electronic devices, including displaying user interfaces of multiple applications, detecting inputs on touch-sensitive surfaces, and applying them according to predefined standards Program switching and window management.
Provides an intuitive and easy-to-use system and method that allows users to seamlessly interact with multiple applications and windows on handheld electronic devices, improving user experience and efficiency and reducing interaction complexity.
Smart Images

Figure CN112346801B_ABST
Abstract
Description
[0001] This application is a divisional application of the invention patent application with the application date of March 30, 2020, application number 202080001784.3, and invention name “System, method and user interface for interacting with multiple application windows”. Technical Field
[0002] Embodiments herein relate generally to electronic devices and, more particularly, to systems and methods for multitasking on electronic devices having display generation components and input devices (eg, portable multifunction devices with touch-sensitive displays). Background Art
[0003] Handheld electronic devices with touch-sensitive displays are ubiquitous. Although initially designed for information consumption (e.g., web browsing) and communication (e.g., email), these devices are rapidly replacing desktop and laptop computers as users' primary computing devices. While using a desktop or laptop computer, these users are able to multitask daily by accessing and using different running applications (e.g., cutting and pasting text from a document into an email). While the range of new features and applications for handheld electronic devices has grown tremendously, the ability to multitask and switch between applications on a handheld electronic device requires an input mechanism that is fundamentally different from that of a desktop or laptop computer.
[0004] Furthermore, because handheld electronic devices have smaller screens than traditional desktop and laptop computers, the need for multitasking is particularly pressing. Some conventional handheld electronic devices attempt to meet this need by recreating a desktop computer interface on a handheld electronic device. However, these attempted solutions do not take into account the following factors: (i) the significant difference in screen size between desktop computers and handheld electronic devices, and (ii) the significant difference between keyboard and mouse interaction of a desktop computer and touch input and gesture input of a handheld electronic device with a touch-sensitive display. Other attempted solutions require complex input sequences and menu hierarchies that are even less user-friendly than those provided by a desktop or laptop computer. Therefore, it is desirable to provide an intuitive and easy-to-use system and method for simultaneously accessing multiple functions or applications on a handheld electronic device. Summary of the Invention
[0005] The embodiments described herein address the need for systems, methods, and graphical user interfaces that provide intuitive and seamless interaction for multitasking on handheld electronic devices. Such methods and systems optionally supplement or replace conventional touch input or gestures.
[0006] In accordance with some embodiments, a method is performed at an electronic device that includes a display generating component (e.g., a display, a projector, a head-up display, etc.) and one or more input devices that include a touch-sensitive surface (e.g., a touch-sensitive surface coupled to a separate display, or a touch screen display that serves as both a display and a touch-sensitive surface). The method includes: displaying a first user interface of a first application through the display generation component; receiving a first input when displaying the first user interface of the first application, the first input corresponding to a request to display a second application together with the first application in a corresponding simultaneous display configuration; in response to receiving the first input, displaying the second user interface of the second application and the first user interface of the first application according to the corresponding simultaneous display configuration, wherein at least a portion of the first user interface of the first application is displayed simultaneously with the second user interface of the second application; when displaying the second application and the first application according to the corresponding simultaneous display configuration, receiving a second input, including detecting a first contact at a position on the touch-sensitive surface corresponding to the second application and detecting movement of the first contact on the touch-sensitive surface; in response to detecting the second input: replacing the display of the second application with the display of a third application based on determining that the second input meets a first criterion, so as to display the third application and the first application based on the corresponding simultaneous display configuration; and based on determining that the second input meets a second criterion different from the first criterion: maintaining the display of the first application; and stopping the display of the second application without displaying the third application.
[0007] In accordance with some embodiments, a method is performed at an electronic device that includes a display generating component (e.g., a display, a projector, a heads-up display, etc.) and one or more input devices (e.g., a camera, a remote controller, a pointing device, a touch-sensitive surface coupled to a separate display, or a touch screen display that functions as both a display and a touch-sensitive surface). The method includes: displaying a taskbar via the display generating component, the taskbar including a plurality of application icons overlaid on a first user interface of a first application, wherein the plurality of application icons correspond to different applications installed on the electronic device; detecting a first input when displaying the taskbar overlaid on the first user interface of the first application, including detecting a selection of a corresponding application icon in the taskbar; in response to detecting the first input and based on determining that the first input satisfies a selection criterion: displaying corresponding representations of the plurality of windows of the first application via the display generating component based on determining that the corresponding application icon corresponds to the first application and the first application is associated with a plurality of windows; maintaining the display of the first user interface of the first application based on determining that the corresponding application icon corresponds to the first application and the first application is currently associated with only a single window; and replacing the display of the first user interface of the first application with the display of the second user interface of the second application based on determining that the corresponding application icon corresponds to a second application different from the first application, regardless of the number of windows associated with the second application when the first input is detected.
[0008] According to some embodiments, a method is performed at an electronic device including a display generation component (e.g., a display, a projector, a head-up display, etc.) and one or more input devices (e.g., a keyboard, a remote control, a camera, a touch-sensitive surface coupled to a separate display, or a touch screen display that functions as both a display and a touch-sensitive surface). The method includes displaying, by the display generation component, a first user interface including a selectable representation of first content, wherein the first content is associated with a first application; while displaying the first user interface including the selectable representation of the first content, detecting a first input, including detecting an input corresponding to a request to move the selectable representation of the first content to a corresponding position on the display; in response to detecting the first input: based on determining that the corresponding position is a first position, adjusting the size of the first user interface and displaying a second user interface including the first content adjacent to the first user interface; and based on determining that the corresponding position is a second position different from the first position, displaying a third user interface including the first content overlaid on the first user interface.
[0009] According to some embodiments, a method is performed at an electronic device including a display generation component and one or more input devices. The method includes: displaying, by the display generation component, a first user interface including a selectable user interface object; while displaying the first user interface including the selectable user interface object, detecting a first input, including detecting an input corresponding to a request to move the selectable user interface object to a corresponding position on the display; in response to detecting the first input: creating a new window for a first application based on determining that the corresponding position is in a first predefined area of the user interface and the selectable user interface object is an application icon of the first application; creating a new window for the first application based on determining that the corresponding position is in a second predefined area of the user interface, wherein the second predefined area of the user interface is smaller than the first predefined area of the user interface and the selectable user interface object is a representation of content associated with the first application; and performing an operation corresponding to the selectable user interface object other than creating a new window for the first application based on determining that the corresponding position is in a third area of the user interface, wherein the third area of the user interface is smaller than the first predefined area of the user interface and does not overlap with the second predefined area of the user interface, and the selectable user interface object is a representation of content associated with the first application.
[0010] According to some embodiments, a method is performed at an electronic device including a display generation component (e.g., a display, a projector, a head-up display, etc.) and one or more input devices (e.g., a camera, a remote control, a pointing device, a camera, a touch-sensitive surface coupled to a separate display, or a touch screen display that functions as both a display and a touch-sensitive surface). The method includes: displaying, by the display generation component, a taskbar containing a plurality of application icons simultaneously with a first user interface of a first application, wherein the plurality of application icons correspond to different applications; while displaying the taskbar simultaneously with the first user interface of the first application, detecting a first input directed to an application icon corresponding to a second application in the taskbar, the first input comprising movement into a first area of the display followed by an end of the first input in the first area of the display; in response to detecting the first input: displaying, by the display generation component, a first representation of a first window of the second application and a second representation of a second window of the second application simultaneously with the first user interface of the first application in a second area of the display based on a determination that the second application is associated with multiple windows; and displaying, by the display generation component, a user interface of the second application simultaneously with the first user interface of the first application based on a determination that the second application is associated with only a single window, wherein the user interface of the second application is displayed in the second area of the display.
[0011] In accordance with some embodiments, a method is performed at an electronic device that includes a display generating component (e.g., a display, a projector, a head-up display, etc.) and one or more input devices (e.g., a camera, a remote control, a keyboard, a touch-sensitive surface coupled to a separate display, or a touch screen display that functions as both a display and a touch-sensitive surface).The method includes: simultaneously displaying a first application view and a second application view in a first simultaneous display configuration among a plurality of simultaneous display configurations by the display generating component, the plurality of simultaneous display configurations including the first simultaneous display configuration, the second simultaneous display configuration, and the third simultaneous display configuration, the first simultaneous display configuration specifying a first arrangement of simultaneously displayed application views, the second simultaneous display configuration specifying a second arrangement of simultaneously displayed application views that is different from the first arrangement of simultaneously displayed application views, and the third simultaneous display configuration specifying a third arrangement of simultaneously displayed application views that is different from the first arrangement of simultaneously displayed application views and the second arrangement of simultaneously displayed application views; detecting a first input, the first input starting from pointing to a position of the first application view within the first arrangement of simultaneously displayed application views and including a first movement, followed by an end of the first input after the first movement is detected; in response to detecting the first movement of the first input, moving a representation of the first application view on the display according to the first movement of the first input, including: when the representation of the first application view is over a first portion of the display, displaying the end of the first input will result in the first simultaneous display configuration. displaying a first visual indication of the first application view and the second application view; displaying a second visual indication of the end of the first input will result in displaying the first application view and the second application view in the second simultaneous display configuration while the representation of the first application view is over the second portion of the display; and displaying a third visual indication of the end of the first input will result in displaying the first application view and the second application view in the third simultaneous display configuration while the representation of the first application view is over the third portion of the display; and in response to detecting the end of the first input: displaying the first application view and the second application view in the first simultaneous display configuration based on determining that the first input ended while the first application view was over the first portion of the display; displaying the first application view and the second application view in the second simultaneous display configuration based on determining that the first input ended while the first application view was over the second portion of the display; and displaying the first application view and the second application view in the third simultaneous display configuration based on determining that the first input ended while the first application view was over the third portion of the display.
[0012] According to some embodiments, an electronic device includes: a display generating component (e.g., a display, a projector, a head-mounted display, etc.); one or more input devices (e.g., a touch-sensitive surface, one or more optional sensors for detecting the intensity of contact with the touch-sensitive surface); one or more tactile output generators; one or more processors; and a memory storing one or more programs; the one or more programs are configured to be executed by the one or more processors, and the one or more programs include instructions for performing or causing the execution of the operations of any of the methods described herein. According to some embodiments, a computer-readable storage medium has instructions stored therein that, when executed by an electronic device having a display generating component, one or more input devices (e.g., a touch-sensitive surface, one or more optional sensors for detecting the intensity of contact with the touch-sensitive surface), and one or more optional tactile output generators, causes the device to perform the operations of any of the methods described herein or causes the operations of any of the methods described herein to be performed. According to some embodiments, a graphical user interface on an electronic device having a display generation component, one or more input devices (e.g., a touch-sensitive surface, optional one or more sensors for detecting the intensity of contact with the touch-sensitive surface), optional one or more tactile output generators, a memory, and one or more processors for executing one or more programs stored in the memory includes one or more of the elements displayed in any of the methods described herein, wherein the one or more elements are updated in response to the input, as described in any of the methods described herein. According to some embodiments, an electronic device includes: a display generation component, one or more input devices (e.g., a touch-sensitive surface, optional one or more sensors for detecting the intensity of contact with the touch-sensitive surface), and optional one or more tactile output generators; and a device for performing or causing the performance of the operations of any of the methods described herein. According to some embodiments, an information processing device in an electronic device having a display generation component, one or more input devices (e.g., a touch-sensitive surface, optional one or more sensors for detecting the intensity of contact with the touch-sensitive surface), and optional one or more tactile output generators includes a device for performing or causing the performance of the operations of any of the methods described herein.
[0013] Thus, improved methods and interfaces for interacting with multiple windows on handheld, portable electronic devices are provided for electronic devices having a display generation component, one or more input devices (e.g., a touch-sensitive surface, optionally one or more sensors for detecting intensity of contact with the touch-sensitive surface), optionally one or more tactile output generators, optionally one or more device orientation sensors, and optionally an audio system, thereby increasing the effectiveness, efficiency, and user satisfaction of such devices. Such methods and interfaces can supplement or replace conventional methods for multitasking and interacting with multiple windows.
[0014] It should be noted that the various embodiments described above can be combined with any other embodiment described herein. The features and advantages described in this specification are not comprehensive. In particular, many additional features and advantages will be apparent to those skilled in the art from the drawings, the specification, and the claims. In addition, it should be noted that the language used in this specification has been selected in principle for readability and instructional purposes, and may not be selected to describe or define the subject matter of the present invention. BRIEF DESCRIPTION OF THE DRAWINGS
[0015] For a better understanding of the various described embodiments, reference should be made to the following detailed description section in conjunction with the following drawings, wherein like reference numerals refer to corresponding parts throughout.
[0016] Figure 1A is a high-level block diagram of a computing device with a touch-sensitive display according to some embodiments.
[0017] Figure 1B is a block diagram of example components for event processing according to some embodiments.
[0018] Figure 1C is a schematic diagram of a portable multifunction device with a touch-sensitive display according to some embodiments.
[0019] Figure 1D is a schematic diagram illustrating a computing device having a touch-sensitive surface separate from a display according to some embodiments.
[0020] Figure 2 is a schematic diagram of a touch-sensitive display according to some embodiments, which is used to show a user interface of a menu of applications.
[0021] Figures 3A to 3C An example of a dynamic intensity threshold according to some embodiments is shown.
[0022] Figures 4A1 to 4A50 、 Figures 4B1 to 4B51 、 Figures 4C1 to 4C48 、 Figures 4D1 to 4D19 and Figures 4E1 to 4E28is a schematic diagram of a touch-sensitive display for illustrating a user interface for interacting with multiple applications and / or windows according to some embodiments.
[0023] 5A to 5I is a flowchart representation of a method of interacting with multiple windows in respective simultaneous display configurations (e.g., a Slide Over display configuration) according to some embodiments.
[0024] Figures 6A to 6E is a flowchart representation of a method for interacting with an application icon while displaying an application according to some embodiments.
[0025] 7A to 7H is a flowchart representation of a method for displaying content with a currently displayed application in a corresponding simultaneous display configuration according to some embodiments.
[0026] Figure 7I is a flowchart representation of a method of dragging and dropping objects to corresponding areas of a display to open new windows according to some embodiments.
[0027] Figures 8A to 8E is a flowchart representation of a method of displaying an application with a currently displayed application in a corresponding simultaneous display configuration according to some embodiments.
[0028] Figures 9A to 9J is a flowchart representation of a method for changing a window display configuration using fluid gestures according to some embodiments. DETAILED DESCRIPTION
[0029] This disclosure describes various embodiments for facilitating multitasking on portable electronic devices, where conventional multi-window interaction and user interface navigation techniques have proven to be inefficient, cumbersome, error-prone, and time-consuming. For battery-operated devices with small displays, there is a need for improved user interfaces for interacting with multiple applications, windows, and / or documents.
[0030] In some embodiments, a method is described for performing window switching within a subgroup of windows (e.g., a group of side-by-side applications or windows) that is configured to be displayed simultaneously with another full-screen window or application. Subgroups of windows with the same display configuration (e.g., displayed in side-by-side mode) are organized in a stack or carousel and can be switched in response to gestures that meet predefined criteria. In addition, an overlay switcher user interface is provided to provide a consistent way to view and manage subgroups of windows displayed in side-by-side mode, and to quickly select a window to overlay on a currently displayed full-screen window or application.
[0031] In some embodiments, application switching requests and window management requests are integrated into the same input (e.g., a tap input on an application icon when a first application is displayed). A heuristic is used to determine whether to switch to a second application or to display a window switcher for the first application. When the activated application icon corresponds to the displayed application, the input is considered a request to open the window switcher for the application; and when the activated application icon corresponds to an application other than the displayed application, the input is considered a request to switch applications, regardless of the number of windows already opened by the first application. In the event that the currently displayed application does not have multiple windows, the input is ignored (e.g., optionally with error feedback). The integration of application switching and window switching within an application provides a more efficient interface because the user does not need to keep track of the number of currently open windows for the currently displayed application. Instead, the device automatically provides an intuitive response based on the heuristic, thereby improving user interface efficiency and reducing the number of inputs required to achieve the desired result.
[0032] In some embodiments, an object representing content is dragged from a currently displayed window to a predefined area of the display, and based on the location of the input or the location of the dragged object when the end of the input is detected, the device opens a new window that displays the content in a corresponding simultaneous display configuration (e.g., in a side-pull window or a split-screen window) along with the currently displayed window. In some embodiments, the drag-and-drop operation is also integrated with the drag-and-drop operation implemented within the original window containing the object representing the content or in another simultaneously displayed window. The integration of multiple operations performed within an application window, across two simultaneously displayed windows, in a new window of the first type, or in a new window of the second type allows the user to easily perform different operations based on the end location of the input. This helps to reduce the complexity of user interface interactions because fewer gestures need to be implemented, used, and remembered to implement these functions, thereby reducing user errors and improving the efficiency of the user interface.
[0033] In some embodiments, when an object is dragged and dropped into different areas on the display, different operations are performed depending on the end location of the input, including operations to open different types of new windows (e.g., side-by-side windows or split-screen windows), operations within the object's original window, and operations across two simultaneously displayed windows. For some objects, such as application icons, applicable operations within or across existing windows on the display are uncommon; therefore, it is beneficial to enlarge the drop zone for opening new windows by dragging and dropping application icons relative to the drop zone for opening new windows by dragging and dropping objects representing content. This user interface improvement helps reduce user errors without significantly impairing functionality, thereby improving the efficiency of the user interface.
[0034] In some embodiments, when a request to open an application in a simultaneous display configuration is received, if the application is not associated with multiple windows, the application is displayed in the simultaneous display configuration, and if the application is associated with multiple windows, a window selector user interface is displayed in the corresponding simultaneous display configuration. Allowing a user to open the application in a simultaneous display configuration or to open the application's window selector using the same input (e.g., dragging the application's application icon to a side area of the display) based on whether the application is associated with multiple windows is intuitive and efficient. This helps reduce the number and type of inputs a user needs to provide to achieve a desired result and reduces the chance of user error.
[0035] In some embodiments, in response to an input that drags a window to different drop zones defined on the display, if the end of the input is detected at the current location, the device provides dynamic visual feedback to indicate the resulting display configuration of the window. The final state of the user interface is not determined until the end of the input is detected, and by ending the input at the appropriate location, the user is provided with an opportunity to review and understand the various possible outcomes before ultimately committing to the display configuration of the window. The fluid nature of the input and feedback allows multiple outcomes to be achieved using the same gesture, and reduces the chance of user error through the simplicity of the gesture and the continuous visual feedback provided based on the current location of the input.
[0036] The methods and user interface heuristics described herein take into account the following factors: (i) the significant difference in screen size between desktop computers and handheld electronic devices, and (ii) the significant difference between keyboard and mouse interaction for desktop computers and touch input and gesture input for handheld electronic devices with touch-sensitive displays. No menu navigation or complex input sequences are required to achieve various multitasking functions at different levels, such as across applications, across all windows of a given application, across windows of a given type of a given application, switching between opening new windows or between existing windows, between opening content and opening applications, etc. These methods and user interface heuristics provide an intuitive and easy-to-use system and method for simultaneously accessing multiple functions or applications on a handheld electronic device.
[0037] Figures 1A to 1D and Figure 2 A description of an exemplary apparatus is provided. Figures 3A to 3C An embodiment of a dynamic intensity threshold is shown. Figures 4A1 to 4A50 、 Figures 4B1 to 4B51 、 Figures 4C1 to 4C48 、 Figures 4D1 to 4D19 and Figures 4E1 to 4E28 are schematic diagrams of a touch-sensitive display for illustrating a user interface for interacting with multiple applications and / or windows according to some embodiments, and these diagrams are used to illustrate 5A to 5I 、 Figures 6A to 6E 、 Figures 7A to 7H 、 Figure 7I 、 Figures 8A to 8E and 9A to Figure 9J The method / process shown in .
[0038] Exemplary devices
[0039] Reference will now be made in detail to the embodiments, examples of which are illustrated in the accompanying drawings. Numerous specific details are set forth in the following detailed description in order to provide a thorough understanding of the various described embodiments. However, it will be apparent to one of ordinary skill in the art that the various described embodiments may be practiced without these specific details. In other cases, well-known methods, processes, components, circuits, and networks have not been described in detail so as not to unnecessarily obscure various aspects of the embodiments.
[0040] It will also be understood that, although in some cases, the terms "first," "second," etc. are used herein to describe various elements, these elements should not be limited by these terms. These terms are simply used to distinguish one element from another. For example, a first contact can be named a second contact, and similarly, a second contact can be named a first contact without departing from the scope of the various described embodiments. Both the first contact and the second contact are contacts, but they are not the same contact.
[0041] The terms used in the description of the various embodiments described herein are only for the purpose of describing specific embodiments and are not intended to be limiting. As used in the description of the various embodiments described and in the appended claims, the singular forms "a", "an" and "the" are intended to also include plural forms unless the context clearly indicates otherwise. It will also be understood that the terms "and / or" used herein refer to and encompass any and all possible combinations of one or more items in the items listed in association. It will also be understood that the terms "comprises" and / or "comprising" when used in this specification specify the presence of stated features, integers, steps, operations, elements and / or parts, but do not exclude the presence or addition of one or more other features, integers, steps, operations, elements, parts and / or their groupings.
[0042] As used herein, the term "if" is optionally interpreted to mean "when" or "upon" or "in response to determining" or "in response to detecting," depending on the context. Similarly, the phrases "if it is determined that" or "if [stated condition or event] is detected" are optionally interpreted to mean "upon determining" or "in response to determining" or "upon detecting [stated condition or event]" or "in response to detecting [stated condition or event]," depending on the context.
[0043] The disclosure herein refers interchangeably to detecting touch input at, at, above, on top of, or substantially within a particular user interface element or portion of a touch-sensitive display. As used herein, a touch input detected "at" a particular user interface element can also be detected "on," "above," "on top of," or "substantially within" the same user interface element. In some embodiments and as described in more detail below, the desired sensitivity level for detecting touch input can be configured by a user of the electronic device (e.g., the user can decide (and configure the electronic device to operate) that touch input should only be detected when the touch input is completely within a user interface element).
[0044] It is understood that the use of personally identifiable information should be subject to privacy policies and practices that are generally recognized to meet or exceed industry or government requirements for maintaining user privacy. Specifically, personally identifiable information data should be managed and processed to minimize the risk of unintentional or unauthorized access or use, and the nature of authorized use should be clearly stated to users.
[0045] Embodiments of electronic devices, user interfaces for such devices, and processes associated with using such devices are described herein. In some embodiments, the device is a portable communication device, such as a mobile phone, that also includes other functions, such as a PDA and / or music player. Exemplary embodiments of portable multifunction devices include, but are not limited to, the Apple Watch from Apple Inc. (Cupertino, California). and Device. Other portable electronic devices, such as laptops or tablets with touch-sensitive surfaces (e.g., touch screen displays and / or trackpads), are optionally used. It should also be understood that in some embodiments, the device is not a portable communication device, but rather a desktop computer with a touch-sensitive surface (e.g., touch screen displays and / or trackpads).
[0046] In the following discussion, an electronic device including a display and a touch-sensitive surface is described. However, it should be understood that the electronic device optionally includes one or more other physical user interface devices, such as a physical keyboard, mouse, and / or joystick.
[0047] The device typically supports a variety of applications, such as one or more of the following: a drawing application, a rendering application, a word processing application, a website creation application, a disk editing application, a spreadsheet application, a gaming application, a telephony application, a video conferencing application, an email application, an instant messaging application, a fitness application, a photo management application, a digital camera application, a digital video camera application, a web browsing application, a digital music player application, and / or a digital video player application.
[0048] Various applications executed on the device optionally use at least one common physical user interface device, such as a touch-sensitive surface. One or more functions of the touch-sensitive surface and corresponding information displayed on the device are optionally adjusted and / or varied for different applications and / or adjusted and / or varied within the respective applications. In this way, the common physical architecture of the device (such as the touch-sensitive surface) optionally supports the various applications with a user interface that is intuitive and clear to the user.
[0049] Attention is now directed to embodiments of portable electronic devices having touch-sensitive displays. Figure 1A is a block diagram illustrating a portable multifunction device 100 (also referred to interchangeably herein as electronic device 100 or device 100) with a touch-sensitive display 112 according to some embodiments. The touch-sensitive display 112 is sometimes referred to as a "touch screen" for convenience, and is sometimes referred to as or referred to as a touch-sensitive display system. The device 100 includes a memory 102 (which optionally includes one or more computer-readable storage media), a controller 120, one or more processing units (CPUs) 122, a peripheral device interface 118, RF circuitry 108, audio circuitry 110, a speaker 111, a microphone 113, an input / output (I / O) subsystem 106, other input or control devices 116, and an external port 124. The device 100 optionally includes one or more optical sensors 164. The device 100 optionally includes one or more intensity sensors 165 for detecting intensity of contact on the device 100 (e.g., a touch-sensitive surface, such as the touch-sensitive display system 112 of the device 100). Device 100 optionally includes one or more tactile output generators 167 for generating tactile output on device 100 (e.g., generating tactile output on a touch-sensitive surface, such as touch-sensitive display system 112 of device 100 or a touchpad of device 100). These components optionally communicate via one or more communication buses or signal lines 103.
[0050] As used in this specification and claims, the term "tactile output" refers to a physical displacement of a device relative to a previous position of the device, a physical displacement of a component of a device (e.g., a touch-sensitive surface) relative to another component of the device (e.g., a housing), or a displacement of a component relative to the center of mass of the device that will be detected by a user using the user's sense of touch. For example, when a device or a component of the device is in contact with a surface that is touch-sensitive to a user (e.g., a finger, palm, or other part of the user's hand), the tactile output generated by the physical displacement will be interpreted by the user as a tactile sensation that corresponds to a perceived change in a physical characteristic of the device or component of the device. For example, movement of a touch-sensitive surface (e.g., a touch-sensitive display or trackpad) is optionally interpreted by the user as a "press click" or "release click" on a physical actuation button. In some cases, the user will feel a tactile sensation, such as a "press click" or "release click," even when the physical actuation button associated with the touch-sensitive surface that was physically pressed (e.g., displaced) by the user's movement does not move. As another example, even when the smoothness of the touch-sensitive surface does not change, movement of the touch-sensitive surface may optionally be interpreted or sensed by the user as "roughness" of the touch-sensitive surface. While such a user's interpretation of touch will be limited by the user's individualized sensory perceptions, many sensory perceptions of touch are common to most users. Thus, when a tactile output is described as corresponding to a particular sensory perception of a user (e.g., "up click," "down click," "roughness"), unless otherwise stated, the generated tactile output corresponds to a physical displacement of the device or a component thereof that would generate the described sensory perception for a typical (or average) user.
[0051] It should be understood that device 100 is only one example of a portable multifunction device and that device 100 optionally has more or fewer components than shown, optionally combines two or more components, or optionally has a different configuration or arrangement of the components. Figure 1A The various components shown in the EMBODIMENTS 100 are implemented in hardware, software, or a combination of hardware and software, including one or more signal processing and / or application specific integrated circuits.
[0052] Memory 102 optionally includes high-speed random access memory (e.g., DRAM, SRAM, DDR RAM, or other random access solid-state memory devices), and optionally also includes non-volatile memory, such as one or more magnetic disk storage devices, flash memory devices, or other non-volatile solid-state memory devices. Memory 102 optionally includes one or more storage devices located remotely from one or more processors 122. Access to memory 102 by other components of device 100 (such as CPU 122 and peripheral device interface 118) is optionally controlled by controller 120.
[0053] Peripherals interface 118 may be used to couple the device's input and output peripherals to CPU 122 and memory 102. One or more processors 122 run or execute various software programs and / or instruction sets stored in memory 102 to perform various functions of device 100 and process data.
[0054] In some embodiments, peripherals interface 118, CPU 122, and controller 120 are optionally implemented on a single chip, such as chip 104. In some other embodiments, they are optionally implemented on separate chips.
[0055] RF (radio frequency) circuitry 108 receives and transmits RF signals, also known as electromagnetic signals. RF circuitry 108 converts electrical signals into / from electromagnetic signals and communicates with a communication network and other communication devices via the electromagnetic signals. RF circuitry 108 optionally includes well-known circuitry for performing these functions, 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, a subscriber identity module (SIM) card, memory, and the like. RF circuitry 108 optionally communicates with networks and other devices via wireless communications, such as the Internet (also known as the World Wide Web (WWW)), an intranet, and / or a wireless network (such as a cellular telephone network, a wireless local area network (LAN), and / or a metropolitan area network (MAN)). Wireless communication optionally uses any of a variety of communication standards, protocols, and technologies, including, but not limited to, Global System for Mobile Communications (GSM), Enhanced Data GSM Environment (EDGE), High-Speed Downlink Packet Access (HSDPA), High-Speed Uplink Packet Access (HSUPA), Evolution, Data-Only (EV-DO), HSPA, HSPA+, Dual-Cell HSPA (DC-HSPDA), Long Term Evolution (LTE), Near Field Communication (NFC), Wideband Code Division Multiple Access (W-CDMA), Code Division Multiple Access (CDMA), Time Division Multiple Access (TDMA), Bluetooth, Bluetooth Low Energy, Wireless Fidelity (Wi-Fi) (e.g., IEEE 802.11a, IEEE 802.11b, IEEE 802.11g, and / or IEEE 802.11n).
[0056] The audio circuit 110, speaker 111, and microphone 113 provide an audio interface between the user and the device 100. The audio circuit 110 receives audio data from the peripheral device interface 118, converts the audio data into electrical signals, and transmits the electrical signals to the speaker 111. The speaker 111 converts the electrical signals into sound waves audible to humans. The audio circuit 110 also receives electrical signals converted from sound waves by the microphone 113. The audio circuit 110 converts the electrical signals into audio data and transmits the audio data to the peripheral device interface 118 for processing. The audio data is optionally retrieved from and / or transmitted to the memory 102 and / or the RF circuit 108 by the peripheral device interface 118. In some embodiments, the audio circuit 110 also includes a headset jack. The headset jack provides an interface between the audio circuit 110 and a removable audio input / output peripheral device, such as an output-only headset or a headset with both output (e.g., a single-ear headset or a dual-ear headset) and input (e.g., a microphone).
[0057] The I / O subsystem 106 connects input / output peripherals on the device 100, such as the touch screen 112 and other input control devices 116, to the peripheral device interface 118. The I / O subsystem 106 optionally includes a display controller 156, an optical sensor controller 158, an intensity sensor controller 159, a tactile feedback controller 161, and one or more input controllers 160 for other input or control devices. The one or more input controllers 160 receive / send electrical signals from / to other input or control devices 116. Other input control devices 116 optionally include physical buttons (e.g., push buttons, rocker buttons, etc.), dials, slide switches, joysticks, click wheels, etc. In some alternative embodiments, the one or more input controllers 160 are optionally coupled to any one of the following (or none of the following): a keyboard, an infrared port, a USB port, and a pointer device such as a mouse. The one or more buttons may optionally include an increase / decrease button for volume control of the speaker 111 and / or microphone 113. The one or more buttons optionally include a push button.
[0058] The touch-sensitive display 112 provides an input interface and an output interface between the device and the user. The display controller 156 receives electrical signals from the touch screen 112 and / or sends electrical signals to the touch screen. The touch screen 112 displays visual output to the user. The visual output optionally includes graphics, text, icons, videos, and any combination thereof (collectively referred to as "graphics"). In some embodiments, some or all of the visual output corresponds to user interface objects.
[0059] The touch screen 112 has a touch-sensitive surface, sensor, or set of sensors that accepts input from the user based on tactile and / or haptic contact. The touch screen 112 and display controller 156 (together with any associated modules and / or instruction sets in memory 102) detect contact (and any movement or interruption of that contact) on the touch screen 112 and convert the detected contact into interaction with a user interface object (e.g., one or more soft keys, icons, web pages, or images) displayed on the touch screen 112. In an exemplary embodiment, the point of contact between the touch screen 112 and the user corresponds to the area under the user's finger.
[0060] The touch screen 112 optionally uses LCD (liquid crystal display) technology, LPD (light emitting polymer display) technology, or LED (light emitting diode) technology, or OLED (organic light emitting diode) technology, although other display technologies are used in other embodiments. The touch screen 112 and display controller 156 optionally use any of a variety of touch sensing technologies now known or later developed, 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 screen 112 to detect contact and any movement or interruption thereof. In one exemplary embodiment, projected mutual capacitance sensing technology is used, such as that found in the Apple Inc. (Cupertino, California) and The technology in.
[0061] The touch screen 112 optionally has a video resolution exceeding 400 dpi. In some embodiments, the touch screen 112 has a video resolution of at least 600 dpi. In other embodiments, the touch screen 112 has a video resolution of at least 1000 dpi. The user optionally uses any suitable object or digit, such as a stylus or finger, to contact the touch screen 112. In some embodiments, the user interface is designed to work primarily with finger-based contacts and gestures. In some embodiments, the device converts finger-based input into precise pointer / cursor positions or commands for performing the actions desired by the user.
[0062] In some embodiments, in addition to the touch screen, the device 100 optionally includes 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 is optionally a touch-sensitive surface that is separate from the touch screen 112 or an extension of the touch-sensitive surface formed by the touch screen.
[0063] Device 100 also includes a power system 162 for powering the various components. Power system 162 optionally includes a power management system, one or more power sources (e.g., batteries, alternating current (AC)), a recharging system, power fault detection circuitry, a power converter or inverter, a power status indicator (e.g., a light emitting diode (LED)), and any other components associated with the generation, management, and distribution of power in a portable device.
[0064] Device 100 optionally also includes one or more optical sensors 164 . Figure 1A An optical sensor coupled to the optical sensor controller 158 in the I / O subsystem 106 is shown. The optical sensor 164 optionally includes a charge coupled device (CCD) or a complementary metal oxide semiconductor (CMOS) phototransistor. The optical sensor 164 receives light projected through one or more lenses from the environment and converts the light into data representing an image. In conjunction with the imaging module 143 (also called a camera module), the optical sensor 164 optionally captures still images or video. In some embodiments, the optical sensor is located on the rear of the device 100, opposite the touch screen 112 on the front of the device, so that the touch-sensitive display can be used as a viewfinder for still images and / or video image acquisition. In some embodiments, another optical sensor is located on the front of the device so that the user can optionally obtain an image of the user for video conferencing while watching other video conference participants on the touch-sensitive display.
[0065] Device 100 optionally also includes one or more contact intensity sensors 165 . Figure 1A A contact force sensor is shown coupled to force sensor controller 159 in I / O subsystem 106. Contact force sensor 165 optionally includes one or more piezoresistive strain gauges, capacitive force sensors, electrical force sensors, piezoelectric force sensors, optical force sensors, capacitive touch-sensitive surfaces, or other force sensors (e.g., sensors for measuring the force (or pressure) of a contact on a touch-sensitive surface). Contact force sensor 165 receives contact force information (e.g., pressure information or a surrogate for pressure information) from the environment. In some embodiments, at least one contact force sensor is juxtaposed with or adjacent to a touch-sensitive surface (e.g., touch-sensitive display system 112). In some embodiments, at least one contact force sensor is located on the back of device 100 opposite touch screen 112 located on the front of device 100.
[0066] Device 100 optionally also includes one or more proximity sensors 166 . Figure 1AA proximity sensor 166 is shown coupled to peripherals interface 118. Alternatively, proximity sensor 166 is coupled to input controller 160 in I / O subsystem 106. In some embodiments, when the multifunction device is placed near a user's ear (e.g., when the user is making a phone call), the proximity sensor turns off and disables touch screen 112.
[0067] Device 100 optionally also includes one or more tactile output generators 167 . Figure 1A A tactile output generator is shown coupled to a tactile feedback controller 161 in the I / O subsystem 106. The tactile output generator 167 optionally includes one or more electroacoustic devices, such as a speaker or other audio component; and / or an electromechanical device that converts energy into linear motion, such as a motor, solenoid, electroactive polymer, piezoelectric actuator, electrostatic actuator, or other tactile output generating component (e.g., a component that converts an electrical signal into a tactile output on the device). The contact force sensor 165 receives tactile feedback generation instructions from the tactile feedback module 133 and generates tactile output on the device 100 that can be felt by the user of the device 100. In some embodiments, at least one tactile output generator is juxtaposed or adjacent to a touch-sensitive surface (e.g., touch-sensitive display system 112) and optionally generates tactile output by moving the touch-sensitive surface vertically (e.g., inward / outward toward the surface of the device 100) or laterally (e.g., back and forth in the same plane as the surface of the device 100). In some embodiments, at least one tactile output generator sensor is located on the back of the device 100 opposite the touch-sensitive display 112 located on the front of the device 100.
[0068] Device 100 optionally also includes one or more accelerometers 168 . Figure 1A An accelerometer 168 is shown coupled to the peripherals interface 118. Alternatively, the accelerometer 168 is optionally coupled to the input controller 160 in the I / O subsystem 106. In some embodiments, information is displayed on the touch-sensitive display in a portrait view or a landscape view based on an analysis of data received from the one or more accelerometers. The device 100 optionally includes a magnetometer (not shown) and a GPS (or GLONASS or other global navigation system) receiver (not shown) in addition to the accelerometer 168 for obtaining information about the position and orientation (e.g., portrait or landscape) of the device 100.
[0069] In some embodiments, the software components stored in memory 102 include an operating system 126, a communication module (or instruction set) 128, a contact / motion module (or instruction set) 130, a graphics module (or instruction set) 132, a text input module (or instruction set) 134, a global positioning system (GPS) module (or instruction set) 135, and an application (or instruction set) 136. In addition, in some embodiments, memory 102 stores device / global internal state 157, such as Figure 1A . The device / global internal state 157 includes one or more of the following: an active application state, which indicates which applications (if any) are currently active; a display state, which indicates what applications, views, or other information occupy various areas of the touch-sensitive display 112; a sensor state, including information obtained from the device's various sensors and input control devices 116; and position information about the device's position and / or posture (e.g., the device's orientation). In some embodiments, the device / global internal state 157 communicates with the multitasking module 180 to track applications activated in multitasking mode (also known as shared screen view, shared screen mode, or multitasking mode). In this way, if the device 100 is rotated from a portrait display mode to a landscape display mode, the multitasking module 180 is able to retrieve multitasking state information (e.g., the display area of each application in multitasking mode) from the device / global internal state 157 to reactivate the multitasking mode after switching from portrait to landscape.
[0070] The operating system 126 (e.g., Darwin, RTXC, LINUX, UNIX, OS X, WINDOWS, or an embedded operating system such as VxWorks) includes various 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.
[0071] The communication module 128 facilitates communication with other devices through one or more external ports 124, and also includes various software components for processing data received by the RF circuit 108 and / or the external port 124. The external port 124 (e.g., a universal serial bus (USB), FireWire, etc.) is suitable for direct coupling to other devices, or indirectly coupling through a network (e.g., the Internet, a wireless LAN, etc.). In some embodiments, the external port is a multi-pin (e.g., 30-pin) connector that is identical to, or similar to, and / or compatible with the 30-pin connector used in some embodiments of the IPOD device from APPLE Inc. In other embodiments, the external port is a multi-pin (e.g., 8-pin) connector that is identical to, or similar to, and / or compatible with the 8-pin connector used in the LIGHTNING connector from APPLE Inc.
[0072] The contact / motion module 130 optionally detects contact with the touch screen 112 (in conjunction with the display controller 156) and other touch-sensitive devices (e.g., a trackpad or physical click wheel). The contact / motion module 130 includes various software components for performing various operations related to contact detection, such as determining whether contact has occurred (e.g., detecting a finger down event), determining the strength of the contact (e.g., the force or pressure of the contact, or a surrogate for the force or pressure of the contact), determining whether there has been movement of the contact and tracking the movement on the touch-sensitive surface (e.g., detecting one or more finger drag events), and determining whether the contact has ceased (e.g., detecting a finger up event or contact break). The contact / motion module 130 receives contact data from the touch-sensitive surface. Determining the movement of a contact point optionally includes determining the rate (magnitude), velocity (magnitude and direction), and / or acceleration (change in magnitude and / or direction) of the contact point, the movement of which is represented by a sequence of contact data. These operations are optionally applied to a single contact (e.g., a one-finger contact) or to multiple simultaneous contacts (e.g., "multi-touch" / multiple-finger contacts). In some embodiments, the contact / motion module 130 and display controller 156 detect contact on the touchpad.
[0073] In some embodiments, the contact / motion module 130 uses a set of one or more intensity thresholds to determine whether an action has been performed by a user (e.g., to determine whether a user has "clicked" an icon). In some embodiments, at least a subset of the intensity thresholds is determined based on software parameters (e.g., the intensity thresholds are not determined by the activation threshold of a particular physical actuator and can be adjusted without changing the physical hardware of the device 100). For example, a mouse "click" threshold for a touchpad or touch-sensitive display can be set to any one of a large range of predefined thresholds without changing the touchpad or touch-sensitive display hardware. In addition, in some embodiments, a software setting is provided to the user of the device for adjusting one or more intensity thresholds in a set of intensity thresholds (e.g., by adjusting individual intensity thresholds and / or by utilizing a system-level click on an "intensity" parameter to adjust multiple intensity thresholds at once).
[0074] The contact / motion module 130 optionally detects gesture input from the user. Different gestures on the touch-sensitive surface have different contact patterns (e.g., different motions, timings, and / or intensities of the detected contacts). Thus, gestures are optionally detected by detecting specific contact patterns. For example, detecting a finger tap gesture includes detecting a finger press event and then detecting a finger lift (lift-off) event at the same location (or substantially the same location) as the finger press event (e.g., at the location of an icon). As another example, detecting a finger swipe gesture on the touch-sensitive surface includes detecting a finger press event and then detecting one or more finger drag events, and in some embodiments, also subsequently detecting a finger lift (lift-off) event.
[0075] The graphics module 132 includes various known software components for rendering and displaying graphics on the touch screen 112 or other display, including components for changing the visual impact (e.g., brightness, transparency, saturation, contrast, or other visual characteristics) of the displayed graphics. As used herein, the term "graphics" includes any object that can be displayed to a user, including, but not limited to, text, web pages, icons (such as user interface objects including soft keys), digital images, videos, animations, and the like.
[0076] In some embodiments, the graphics module 132 stores data representing graphics to be used. Each graphic is optionally assigned a corresponding code. The graphics module 132 receives one or more codes specifying the graphics to be displayed from an application or the like, along with coordinate data and other graphic attribute data if necessary, and then generates screen image data for output to the display controller 156. In some embodiments, the graphics module 132 retrieves the graphics stored with the multitasking data 176 for each application 136 ( Figure 1BIn some embodiments, multitasking data 176 stores multiple graphics of different sizes, allowing applications to be quickly resized in shared screen mode.
[0077] Haptic feedback module 133 includes various software components for generating instructions used by tactile output generator 167 to produce tactile output at one or more locations on device 100 in response to user interaction with device 100 .
[0078] Text input module 134, which is optionally a component of graphics module 132, provides a soft keyboard for entering text in various applications (e.g., contacts module 137, email client module 140, IM module 141, browser module 147, and any other application requiring text input).
[0079] The GPS module 135 determines the location of the device and provides this information for use in various applications (e.g., to the phone 138 for location-based dialing; to the camera 143 as picture / video metadata; and to applications that provide location-based services such as the weather widget, the local yellow pages widget, and the map / navigation widget).
[0080] Application program ("app") 136 optionally includes the following modules (or instruction sets), or a subset or superset thereof:
[0081] Contacts module 137 (sometimes called address book or contact list);
[0082] Telephone module 138;
[0083] Video conferencing module 139;
[0084] Email client module 140;
[0085] Instant messaging (IM) module 141;
[0086] Fitness module 142;
[0087] A camera module 143 for still and / or video images;
[0088] Image management module 144;
[0089] Browser module 147;
[0090] Calendar module 148;
[0091] Widget module 149, which optionally includes one or more of the following: weather widget 149-1, stock widget 149-2, calculator widget 149-3, alarm clock widget 149-4, dictionary widget 149-5, and other widgets acquired by the user, and user-created widgets 149-6;
[0092] Search module 151;
[0093] A video and music player module 152, optionally consisting of a video player module and a music player module;
[0094] Memo module 153;
[0095] Map module 154; and / or
[0096] Online video module 155.
[0097] Examples of other applications 136 optionally stored in memory 102 include other word processing applications, other image editing applications, drawing applications, presentation applications, website creation applications, disk editing applications, spreadsheet applications, JAVA-enabled applications, encryption, digital rights management, voice recognition, a widget creator module 149-6 for making user-created widgets, and voice replication.
[0098] In combination with the touch screen 112, display controller 156, contact module 130, graphics module 132 and text input module 134, the contacts module 137 is optionally used to manage an address book or contact list (e.g., stored in the contacts module 137 in memory 102 or memory 370), including: adding one or more names to the address book; deleting names from the address book; associating telephone numbers, email addresses, physical addresses or other information with names; associating images with names; categorizing and classifying names; providing telephone numbers or email addresses to initiate and / or facilitate communications through the telephone module 138, video conferencing module 139, email client module 140 or IM module 141; and so on.
[0099] In conjunction with RF circuitry 108, audio circuitry 110, speaker 111, microphone 113, touch screen 112, display controller 156, contact module 130, graphics module 132, and text input module 134, phone module 138 is optionally used to enter a character sequence corresponding to a telephone number, access one or more telephone numbers in address book 137, modify an entered telephone number, dial the corresponding telephone number, conduct a conversation, and disconnect or hang up when the conversation is complete. As described above, wireless communication optionally uses any of a variety of communication standards, protocols, and technologies.
[0100] In combination with RF circuitry 108, audio circuitry 110, speaker 111, microphone 113, touch screen 112, display controller 156, optical sensor 164, optical sensor controller 158, contact module 130, graphics module 132, text input module 134, contact list 137, and phone module 138, video conferencing module 139 includes executable instructions for initiating, conducting, and terminating a video conference between a user and one or more other participants in accordance with user instructions.
[0101] In conjunction with RF circuitry 108, touch screen 112, display controller 156, contact module 130, graphics module 132, and text input module 134, email client module 140 includes executable instructions for creating, sending, receiving, and managing emails in response to user instructions. In conjunction with image management module 144, email client module 140 makes it very easy to create and send emails with still images or video images captured by camera module 143.
[0102] In conjunction with the RF circuitry 108, the touch screen 112, the display controller 156, the contact module 130, the graphics module 132, and the text input module 134, the instant messaging module 141 includes executable instructions for entering a character sequence corresponding to an instant message, modifying previously entered characters, sending the corresponding instant message (e.g., using the Short Message Service (SMS) or Multimedia Message Service (MMS) protocol for phone-based instant messaging or using XMPP, SIMPLE, or IMPS for Internet-based instant messaging), receiving instant messages, and viewing received instant messages. In some embodiments, the instant messages transmitted and / or received optionally include graphics, photos, audio files, video files, and / or other attachments supported in MMS and / or Enhanced Messaging Service (EMS). As used herein, "instant messaging" refers to both phone-based messages (e.g., messages sent using SMS or MMS) and Internet-based messages (e.g., messages sent using XMPP, SIMPLE, or IMPS).
[0103] In combination with the RF circuit 108, the touch screen 112, the display controller 156, the contact module 130, the graphics module 132, the text input module 134, the GPS module 135, the map module 154, and the video and music player module 146, the health module 142 includes executable instructions for: creating a workout (e.g., with a time, distance, and / or calorie burn goal); communicating with a fitness sensor (a sports device, such as a watch or pedometer); receiving fitness sensor data; calibrating sensors for monitoring fitness; selecting fitness music and playing it; and displaying, storing, and transmitting fitness data.
[0104] In conjunction with touch screen 112, display controller 156, one or more optical sensors 164, optical sensor controller 158, contact module 130, graphics module 132, and image management module 144, camera module 143 includes executable instructions to capture still images or videos (including video streams) and store them in memory 102; modify characteristics of still images or videos; or delete still images or videos from memory 102.
[0105] In conjunction with touch screen 112, display controller 156, contact module 130, graphics module 132, text input module 134, and camera module 143, image management module 144 includes executable instructions for arranging, modifying (e.g., editing), or otherwise manipulating, labeling, deleting, presenting (e.g., in a digital slideshow or album), and storing still images and / or video images.
[0106] In combination with the RF circuit 108, the touch screen 112, the display system controller 156, the contact module 130, the graphics module 132 and the text input module 134, the browser module 147 includes executable instructions for browsing the Internet (including searching, linking to, receiving and displaying web pages or portions thereof, as well as attachments and other files linked to web pages) in accordance with user instructions.
[0107] In combination with the RF circuit 108, the touch screen 112, the display system controller 156, the contact module 130, the graphics module 132, the text input module 134, the email client module 140 and the browser module 147, the calendar module 148 includes executable instructions for creating, displaying, modifying and storing calendars and data associated with the calendar (e.g., calendar entries, to-do items, etc.) in accordance with user instructions.
[0108] In conjunction with the RF circuit 108, the touch screen 112, the display system controller 156, the contact module 130, the graphics module 132, the text input module 134, and the browser module 147, the desktop widget module 149 is a mini-application that is optionally downloaded and used by the user (e.g., the weather desktop widget 149-1, the stock desktop widget 149-2, the calculator desktop widget 149-3, the alarm desktop widget 149-4, and the dictionary desktop widget 149-5) or a mini-application created by the user (e.g., the user-created desktop widget 149-6). In some embodiments, the desktop widget includes an HTML (Hypertext Markup Language) file, a CSS (Cascading Style Sheets) file, and a JavaScript file. In some embodiments, the desktop widget includes an XML (Extensible Markup Language) file and a JavaScript file (e.g., the Yahoo! desktop widget).
[0109] In combination with the RF circuit 108, touch screen 112, display system controller 156, contact module 130, graphics module 132, text input module 134 and browser module 147, a desktop widget creator module (not shown) is optionally used by a user to create a desktop widget (e.g., to transfer a user-specified portion of a web page into a desktop widget).
[0110] In combination with the touch screen 112, the display system controller 156, the contact module 130, the graphics module 132 and the text input module 134, the search module 151 includes executable instructions for searching the memory 102 for text, music, sound, images, videos and / or other files that match one or more search criteria (e.g., one or more user-specified search terms) in accordance with user instructions.
[0111] In conjunction with touch screen 112, display system controller 156, contact module 130, graphics module 132, audio circuitry 110, speaker 111, RF circuitry 108, and browser module 147, video and music player module 152 includes executable instructions that allow a user to download and play back recorded music and other sound files stored in one or more file formats (such as MP3 or AAC files), as well as to display, present, or otherwise play back video (e.g., on touch screen 112 or on an external display connected via external port 124). In some embodiments, device 100 optionally includes the functionality of an MP3 player, such as the IPOD from APPLE Inc.
[0112] In conjunction with the touch screen 112, the display controller 156, the contact module 130, the graphics module 132, and the text input module 134, the notepad module 153 includes executable instructions for creating and managing notes, to-do lists, etc. according to user instructions.
[0113] In combination with the RF circuitry 108, the touch screen 112, the display system controller 156, the contact module 130, the graphics module 132, the text input module 134, the GPS module 135, and the browser module 147, the map module 154 is optionally used to receive, display, modify, and store executable instructions for maps and data associated with the maps (e.g., driving directions; data about stores and other points of interest at or near a particular location; and other location-based data) in accordance with user instructions.
[0114] In conjunction with touch screen 112, display system controller 156, contact module 130, graphics module 132, audio circuit 110, speaker 111, RF circuit 108, text input module 134, email client module 140, and browser module 147, online video module 155 includes instructions that allow a user to access, browse, receive (e.g., by streaming and / or downloading), play back (e.g., on the touch screen or on an external display connected via external port 124), send an email with a link to a particular online video, and otherwise manage online videos in one or more file formats such as H.264. In some embodiments, instant messaging module 141 is used instead of email client module 140 to send a link to a particular online video.
[0115] like Figure 1A As shown, portable multifunction device 100 also includes a multitasking module 180 for managing multitasking operations on device 100 (e.g., communicating with graphics module 132 to determine appropriate display areas for simultaneously displayed applications). Multitasking module 180 optionally includes the following modules (or instruction sets), or a subset or superset thereof:
[0116] Application selector 182;
[0117] Compatibility module 184;
[0118] Picture-in-picture / overlay module 186; and
[0119] Multitasking history 188, which is used to store information about the user's multitasking history (e.g., frequently used applications in multitasking mode, the most recent display areas of applications in multitasking mode, applications pinned together for display in split view / multitasking mode, etc.).
[0120] In conjunction with touch screen 112, display controller 156, contact module 130, graphics module 132, and contact intensity sensor 165, application selector 182 includes executable instructions to display affordances corresponding to applications (e.g., one or more of applications 136) and to allow a user of device 100 to select affordances to be used in multitasking / split-screen mode (e.g., a mode in which more than one application is simultaneously displayed and active on touch screen 112). In some embodiments, application selector 182 is a taskbar (e.g., taskbar 408 described below).
[0121] In conjunction with touch screen 112, display controller 156, contact module 130, graphics module 132, and application selector 182, compatibility module 184 includes executable instructions to determine whether a particular application is compatible with multitasking mode (e.g., by checking a flag, such as a flag stored with multitasking data 176 for each application 136, such as Figure 1B shown).
[0122] In conjunction with touch screen 112, display controller 156, contact module 130, graphics module 132, and contact force sensor 165, PIP / overlay module 186 includes executable instructions to determine the reduced size of an application to be displayed as an overlay on another application, and to determine an appropriate location on touch screen 112 for displaying the reduced-size application (e.g., a location that avoids important content within the active application being overlaid by the reduced-size application).
[0123] Each module and application identified above corresponds to a set of executable instructions for performing one or more functions and methods described in this application (e.g., computer-implemented methods and other information processing methods described herein). These modules (i.e., instruction sets) do not have to be implemented as independent software programs, processes, or modules, so various subsets of these modules are optionally combined or otherwise rearranged in various embodiments. In some embodiments, memory 102 optionally stores a subset of the above modules and data structures. In addition, memory 102 optionally stores other modules and data structures not described above.
[0124] In some embodiments, device 100 is a device in which operation of a predefined set of functions on the device is performed exclusively through a touch screen and / or a touchpad. By using a touch screen and / or a touchpad as the primary input control device for operating device 100, the number of physical input control devices (e.g., push buttons, dials, etc.) on device 100 is optionally reduced.
[0125] A predefined set of functions that are exclusively performed through the touch screen and / or trackpad optionally includes navigation between user interfaces. In some embodiments, the trackpad, when touched by the user, navigates the device 100 from any user interface displayed on the device 100 to a main menu, home menu, or root menu. In such embodiments, the trackpad is used to implement a "menu button." In some other embodiments, the menu button is a physical push button or other physical input control device, rather than a trackpad.
[0126] Figure 1B is a block diagram illustrating exemplary components for event processing according to some embodiments. In some embodiments, memory 102 ( Figure 1A ) includes an event classifier 170 (e.g., in the operating system 126) and a selected from the portable multifunction device 100 ( Figure 1A )'s corresponding application 136 - 1 among the applications 136 (eg, any of the aforementioned applications stored in the memory 102 along with the application 136).
[0127] Event classifier 170 receives event information and determines the application 136-1 and the application view 175 of application 136-1 to which the event information is to be delivered. Event classifier 170 includes an event monitor 171 and an event dispatcher module 174. In some embodiments, application 136-1 includes an application internal state 192 that indicates one or more current application views that are displayed on touch-sensitive display 112 when the application is active or executing. In some embodiments, device / global internal state 157 is used by event classifier 170 to determine which application(s) are currently active, and application internal state 192 is used by event classifier 170 to determine the application view 175 to which the event information is to be delivered.
[0128] In some embodiments, the application internal state 192 includes additional information, such as one or more of the following: resume information to be used when the application 136-1 resumes execution, user interface state information indicating that information is being displayed or is ready for display by the application 136-1, a state queue for enabling the user to return to a previous state or view of the application 136-1, and a redo / undo queue of previous actions taken by the user. In some embodiments, the multitasking module 180 uses the application internal state 192 to help facilitate multitasking operations (e.g., the multitasking module 180 retrieves resume information from the application internal state 192 in order to redisplay a previously dismissed side application).
[0129] In some embodiments, each application 136-1 stores multitasking data 176. In some embodiments, the multitasking data 176 includes a compatibility flag (e.g., a flag accessed by the compatibility module 184 to determine whether a particular application is compatible with multitasking mode), a list of compatible sizes for displaying the application 136-1 in multitasking mode (e.g., 1 / 4, 1 / 3, 1 / 2, or full screen), and graphics for various sizes (e.g., a different graphic for each size in the compatible size list).
[0130] Event monitor 171 receives event information from peripherals interface 118. The event information includes information about sub-events (e.g., a user touch on touch-sensitive display 112 as part of a multi-touch gesture). Peripherals interface 118 transmits information it receives from I / O subsystem 106 or sensors such as proximity sensor 166, one or more accelerometers 168, and / or microphone 113 (through audio circuit 110). The information that peripherals interface 118 receives from I / O subsystem 106 includes information from touch-sensitive display 112 or a touch-sensitive surface.
[0131] In some embodiments, event monitor 171 sends requests to peripheral device interface 118 at predetermined intervals. In response, peripheral device interface 118 transmits event information. In other embodiments, peripheral device interface 118 transmits event information only when there is a significant event (e.g., receiving an input above a predetermined noise threshold and / or receiving an input for more than a predetermined duration).
[0132] In some embodiments, the event classifier 170 also includes a hit view determination module 172 and / or an active event identifier determination module 173.
[0133] When the touch-sensitive display 112 displays more than one view, the hit view determination module 172 provides software procedures for determining where within one or more views a sub-event has occurred. A view consists of controls and other elements that a user can see on the display.
[0134] Another aspect of the user interface associated with an application is a set of views, sometimes also referred to herein as application views or user interface windows, in which information is displayed and touch-based gestures occur. The application views (of the respective application) in which a touch is detected optionally correspond to programmatic levels within the application's programmatic or view hierarchy. For example, the lowest-level view in which a touch is detected is optionally referred to as a hit view, and the set of events recognized as correct input is optionally determined based at least in part on the hit view of the initial touch that started the touch-based gesture.
[0135] Hit view determination module 172 receives information related to sub-events of touch-based gestures. When an application has multiple views organized in a hierarchy, hit view determination module 172 identifies the hit view as the lowest view in the hierarchy where the sub-events should be processed. In most cases, the hit view is the lowest-level view in which the initiating sub-event (i.e., the first sub-event in a sequence of sub-events that form an event or potential event) occurs. Once a hit view is identified by the hit view determination module, the hit view typically receives all sub-events related to the same touch or input source for which it was identified as the hit view.
[0136] Active event recognizer determination module 173 determines which view or views within the view hierarchy should receive a particular sequence of sub-events. In some embodiments, active event recognizer determination module 173 determines that only the hit view should receive a particular sequence of sub-events. In other embodiments, active event recognizer determination module 173 determines that all views that include the physical location of the sub-event are actively participating views, and therefore determines that all actively participating views should receive a particular sequence of sub-events. In other embodiments, even if a touch sub-event is completely confined to an area associated with one particular view, views higher in the hierarchy will still remain actively participating views.
[0137] Event dispatcher module 174 dispatches event information to event recognizers (e.g., event recognizer 178). In embodiments that include active event recognizer determination module 173, event dispatcher module 174 delivers the event information to the event recognizer determined by active event recognizer determination module 173. In some embodiments, event dispatcher module 174 stores the event information in an event queue, which is retrieved by corresponding event receiver 181.
[0138] In some embodiments, operating system 126 includes event classifier 170. Alternatively, application 136-1 includes event classifier 170. In yet another embodiment, event classifier 170 is a standalone module or part of another module stored in memory 102, such as contact / motion module 130.
[0139] In some embodiments, application 136-1 includes multiple event handlers 177 and one or more application views 175, each of which includes instructions for handling touch events that occur within a corresponding view of the application's user interface. Each application view 175 in application 136-1 includes one or more event recognizers 180. Typically, the corresponding application view 175 includes multiple event recognizers 180. In other embodiments, one or more of event recognizers 180 are part of a separate module, such as a user interface toolkit (not shown) or a higher-level object from which application 136-1 inherits methods and other properties. In some embodiments, the corresponding event handler 177 includes one or more of the following: a data updater 177-1, an object updater 177-2, a GUI updater 177-3, and / or event data 179 received from event classifier 170. Event handler 177 optionally utilizes or calls data updater 177-1, object updater 177-2, or GUI updater 177-3 to update application internal state 192. Alternatively, one or more of application views 175 include one or more corresponding event handlers 177. Additionally, in some embodiments, one or more of data updater 177-1, object updater 177-2, and GUI updater 177-3 are included in the corresponding application view 175.
[0140] A respective event identifier 178 receives event information (e.g., event data 179) from event classifier 170 and identifies an event from the event information. Event identifier 178 includes an event receiver 181 and an event comparator 183. In some embodiments, event identifier 178 also includes metadata 189 and at least one subset of event delivery instructions 190 (which optionally includes sub-event delivery instructions).
[0141] The event receiver 181 receives event information from the event classifier 170. The event information includes information about sub-events such as touches or touch movements. Depending on the sub-event, the event information also includes additional information, such as the location of the sub-event. When the sub-event involves the movement of a touch, the event information optionally also includes the rate and direction of the sub-event. In some embodiments, the event includes the device rotating from one orientation to another (e.g., from a portrait orientation to a landscape orientation, or vice versa), and the event information includes corresponding information about the current orientation of the device (also referred to as the device posture).
[0142] Event comparator 183 compares event information with predefined event or sub-event definitions and determines an event or sub-event based on the comparison, or determines or updates the state of an event or sub-event. In some embodiments, event comparator 183 includes event definition 185. Event definition 185 includes the definition of an event (e.g., a predefined sequence of sub-events), such as event 1 (187-1), event 2 (187-2), and other events. In some embodiments, the sub-events in event 187 include, for example, touch start, touch end, touch move, touch cancel, and multi-touch. In one example, the definition of event 1 (187-1) is a double-click on a displayed object. For example, a double-click includes a first touch (touch start) of a predetermined duration on a displayed object, a first lift (touch end) of a predetermined duration, a second touch (touch start) of a predetermined duration on a displayed object, and a second lift (touch end) of a predetermined duration. In another example, the definition of event 2 (187-2) is a drag on a displayed object. For example, dragging includes a touch (or contact) of a predetermined duration on a displayed object, movement of the touch on the touch-sensitive display 112, and lifting of the touch (touch end). In some embodiments, the event also includes information for one or more associated event handlers 177.
[0143] In some embodiments, event definition 186 includes definitions of events for corresponding user interface objects. In some embodiments, event comparator 183 performs a hit test to determine which user interface object is associated with a sub-event. For example, in an application view displaying three user interface objects on touch-sensitive display 112, when a touch is detected on touch-sensitive display 112, event comparator 183 performs a hit test to determine which of the three user interface objects is associated with the touch (sub-event). If each displayed object is associated with a corresponding event handler 177, the event comparator uses the result of the hit test to determine which event handler 177 should be activated. For example, event comparator 183 selects an event handler that is associated with the sub-event and the object that triggered the hit test.
[0144] In some embodiments, the definition of the corresponding event 187 also includes a delay action that delays the delivery of the event information until it has been determined that the sub-event sequence does or does not correspond to the event type of the event identifier.
[0145] When a corresponding event recognizer 178 determines that the sub-event sequence does not match any event in event definition 185, the corresponding event recognizer 178 enters the event impossible, event failed, or event ended state, after which subsequent sub-events of the touch-based gesture are ignored. In this case, other event recognizers (if any) that remain active for the hit view continue to track and process the sub-events of the ongoing touch-based gesture.
[0146] In some embodiments, the corresponding event recognizers 178 include metadata 189 with configurable properties, flags, and / or lists that indicate how the event delivery system should perform sub-event delivery for actively participating event recognizers. In some embodiments, metadata 189 includes configurable properties, flags, and / or lists that indicate how event recognizers interact or can interact with each other. In some embodiments, metadata 189 includes configurable properties, flags, and / or lists that indicate whether sub-events are delivered to different levels in a view or programmatic hierarchy.
[0147] In some embodiments, when one or more specific sub-events of an event are identified, the corresponding event recognizer 178 activates the event handler 177 associated with the event. In some embodiments, the corresponding event recognizer 178 delivers event information associated with the event to the event handler 177. Activating the event handler 177 is different from sending (and deferred sending) the sub-events to the corresponding hit view. In some embodiments, the event recognizer 178 issues a flag associated with the identified event, and the event handler 177 associated with the flag obtains the flag and performs a predefined process.
[0148] In some embodiments, event delivery instructions 190 include sub-event delivery instructions that deliver event information about a sub-event without activating an event handler. Instead, the sub-event delivery instructions deliver the event information to an event handler associated with the sub-event sequence or to an actively participating view. The event handler associated with the sub-event sequence or with the actively participating view receives the event information and performs a predetermined process.
[0149] In some embodiments, data updater 177-1 creates and updates data used in application 136-1. For example, data updater 177-1 updates phone numbers used in contact module 137 or stores video files used in video or music player module 145. In some embodiments, object updater 177-2 creates and updates objects used in application 136-1. For example, object updater 177-2 creates new user interface objects or updates the position of user interface objects. GUI updater 177-3 updates the GUI. For example, GUI updater 177-3 prepares display information and sends the display information to graphics module 132 for display on a touch-sensitive display. In some embodiments, GUI updater 177-3 communicates with multitasking module 180 to facilitate adjusting the size of various applications displayed in multitasking mode.
[0150] In some embodiments, event handler 177 includes or has access to data updater 177-1, object updater 177-2, and GUI updater 177-3. In some embodiments, data updater 177-1, object updater 177-2, and GUI updater 177-3 are included in a single module of the corresponding application 136-1 or application view 175. In other embodiments, they are included in two or more software modules.
[0151] It should be understood that the above discussion of event handling for user touches on a touch-sensitive display also applies to other forms of user input utilizing input devices to operate the multifunction device 100, and not all user input is initiated on a touch screen. For example, mouse movement and mouse button presses, optionally in conjunction with single or multiple keyboard presses or holddowns; contact movement on a trackpad, such as taps, drags, scrolls, etc.; stylus input; movement of the device; spoken commands; detected eye movement; biometric input; and / or any combination thereof, are optionally used as input corresponding to sub-events defining the event to be recognized.
[0152] Figure 1C201a ). The touch-sensitive display optionally displays one or more graphics within a user interface (UI) 201a. In this embodiment, as well as other embodiments described below, a user can select one or more of these graphics by making gestures on the screen, for example, with one or more fingers or with one or more styluses. In some embodiments, selection of one or more graphics occurs when the user breaks contact with the one or more graphics (e.g., by lifting a finger from the screen). In some embodiments, the gesture optionally includes one or more tap gestures (e.g., a series of touches on the screen after lifting), one or more swipe gestures (continuous contact along the screen surface during the gesture, e.g., from left to right, from right to left, up and / or down), and / or a scrolling of a finger that has made contact with the device 100 (e.g., from right to left, from left to right, up and / or down). In some implementations or in some cases, inadvertent contact with a graphic does not select the graphic. For example, when the gesture used to launch an application is a tap gesture, a swipe gesture that sweeps over an application enable representation (e.g., an icon) optionally does not launch (e.g., open) the corresponding application.
[0153] The device 100 optionally also includes one or more physical buttons, such as a "home" button or menu button 204. As previously described, the menu button 204 is optionally used to navigate to any application 136 in a set of applications that are optionally executed on the device 100. Alternatively, in some embodiments, the menu button is implemented as a soft key in a GUI displayed on the touch screen 112.
[0154] In one embodiment, the device 100 includes a touch screen 112, a menu button 204, a push button 206 for turning the device on and off and locking the device, one or more volume adjustment buttons 208, a subscriber identity module (SIM) card slot 210, a headset jack 212, and a docking / charging external port 124. The push button 206 is optionally used to turn the device on and off by pressing and holding the button for a predefined time interval; to lock the device by pressing and releasing the button before the predefined time interval has elapsed; and / or to unlock the device or initiate an unlocking process. In an alternative embodiment, the device 100 also accepts voice input for activating or deactivating certain functions via the microphone 113. The device 100 also optionally includes one or more contact force sensors 165 for detecting the intensity of contact on the touch screen 112, and / or one or more tactile output generators 167 for generating tactile output for a user of the device 100.
[0155] Figure 1D is used to show that the device (e.g. Figure 1A 100) having a touch-sensitive surface 195 (e.g., a tablet or trackpad) that is separate from display 194 (e.g., touch screen 112). In some embodiments, touch-sensitive surface 195 includes one or more contact intensity sensors (e.g., one or more of contact intensity sensors 359) for detecting intensity of contacts on touch-sensitive surface 195, and / or one or more tactile output generators 357 for generating tactile output for a user of touch-sensitive surface 195.
[0156] Although some of the embodiments that follow will be given with reference to input on a touch screen 112 (where a touch-sensitive surface and a display are combined), in some embodiments, the device detects input on a touch-sensitive surface that is separate from the display, such as Figure 1D In some embodiments, the touch-sensitive surface (e.g., Figure 1D 195) has a main axis (e.g., Figure 1D 198) corresponding to the principal axis (e.g., Figure 1D According to these embodiments, the device detects a position corresponding to a corresponding position on the display (e.g., Figure 1D , 197-1 corresponds to 196-1 and 197-2 corresponds to 196-2) with contact with touch-sensitive surface 195 (e.g., Figure 1D Thus, on a touch-sensitive surface (e.g., Figure 1D 195) and a display of a multifunction device (e.g., Figure 1D When the user input detected by the device on the touch-sensitive surface (e.g., contact 197-1 and contact 197-2 and their movement) is separated, the device is used to manipulate the user interface on the display. It should be understood that similar methods are optionally used for other user interfaces described herein.
[0157] In addition, although the following examples are primarily given with reference to finger inputs (e.g., finger contacts, single-finger tap gestures, finger swipe gestures), it should be understood that in some embodiments, one or more of these finger inputs are replaced by input from another input device (e.g., mouse-based input or stylus input). For example, a swipe gesture is optionally replaced by a mouse click (e.g., instead of contact), followed by movement of the cursor along the path of the swipe (e.g., instead of movement of the contact). For another example, a tap gesture is optionally replaced by a mouse click when the cursor is over the location of the tap gesture (e.g., instead of detecting the contact, followed by ceasing to detect the contact). Similarly, when multiple user inputs are detected simultaneously, it should be understood that multiple computer mice are optionally used simultaneously, or a mouse and multiple finger contacts are optionally used simultaneously.
[0158] As used herein, the term "focus selector" refers to an input element used to indicate the current portion of a user interface with which a user is interacting. In some implementations that include a cursor or other position marker, the cursor acts as a "focus selector" such that when the cursor is over a particular user interface element (e.g., a button, window, slider, or other user interface element), a focus selector is displayed on a touch-sensitive surface (e.g., Figure 1D In the event that an input (e.g., a press input) is detected on the touch-sensitive surface 195 (in some embodiments, the touch-sensitive surface 195 is a touchpad), the particular user interface element is adjusted according to the detected input. In the case of a touch screen display (e.g., a touch screen display) that enables direct interaction with user interface elements on the touch screen display Figure 1AIn some implementations of a touch-sensitive display system 112 or touch screen 112 in a user interface, a contact detected on the touch screen acts as a "focus selector," such that when input (e.g., a press input by the contact) is detected at the location of a particular user interface element (e.g., a button, window, slider, or other user interface element) on the touch screen display, the particular user interface element is adjusted based on the detected input. In some implementations, the focus moves from one area of the user interface to another area of the user interface without corresponding movement of a cursor or movement of a contact on the touch screen display (e.g., by using a tab key or arrow keys to move the focus from one button to another); in these implementations, the focus selector moves based on the movement of the focus between different areas of the user interface. Regardless of the specific form the focus selector takes, the focus selector is generally a user interface element (or contact on the touch screen display) that is controlled by the user to convey the user's intended interaction with the user interface (e.g., by indicating to the device the element of the user interface with which the user desires to interact). For example, when a press input is detected on a touch-sensitive surface (e.g., a trackpad or touch-sensitive display), the position of a focus selector (e.g., a cursor, contact, or selection box) over a corresponding button will indicate that the user intends to activate the corresponding button (rather than other user interface elements shown on the device display).
[0159] As used in this specification and claims, the term "intensity" of a contact on a touch-sensitive surface refers to the force or pressure (force per unit area) of a contact (e.g., a finger contact or a stylus contact) on the touch-sensitive surface, or to a surrogate (surrogate) for the force or pressure of a contact on the touch-sensitive surface. The intensity of a contact has a range of values that includes at least four different values and more typically includes hundreds of different values (e.g., at least 256). The intensity of a contact is optionally determined (or measured) using various methods and various sensors or combinations of sensors. For example, one or more force sensors below or adjacent to the touch-sensitive surface are optionally used to measure the force at different points on the touch-sensitive surface. In some implementations, the force measurements from multiple force sensors are combined (e.g., weighted averaged or summed) to determine an estimated contact force. Similarly, the pressure-sensitive tip of the stylus is optionally used to determine the pressure of the stylus on the touch-sensitive surface. Alternatively, the size of the contact area detected on the touch-sensitive surface and / or its change, the capacitance of the touch-sensitive surface near the contact and / or its change, and / or the resistance of the touch-sensitive surface near the contact and / or its change are optionally used as a substitute for the force or pressure of the contact on the touch-sensitive surface. In some embodiments, the substitute measurement of the contact force or pressure is used directly to determine whether an intensity threshold has been exceeded (e.g., the intensity threshold is described in units corresponding to the substitute measurement). In some embodiments, the substitute measurement of the contact force or pressure is converted to an estimated force or pressure, and the estimated force or pressure is used to determine whether the intensity threshold has been exceeded (e.g., the intensity threshold is a pressure threshold measured in pressure units). Using the intensity of the contact as an attribute of the user input allows the user to access additional device functions that the user cannot easily access on a smaller device with limited real estate for displaying indications (e.g., on a touch-sensitive display) and / or receiving user input (e.g., via a touch-sensitive display, touch-sensitive surface, or physical controls / mechanical controls such as knobs or buttons).
[0160] In some embodiments, the contact / motion module 130 uses a set of one or more intensity thresholds to determine whether an action has been performed by a user (e.g., to determine whether a user has "clicked" an icon). In some embodiments, at least a subset of the intensity thresholds are determined based on software parameters (e.g., the intensity thresholds are not determined by the activation threshold of a particular physical actuator and can be adjusted without changing the physical hardware of the portable computing system 100). For example, without changing the touchpad or touchscreen display hardware, the mouse "click" threshold of a touchpad or touchscreen display can be set to any one of a large range of predefined thresholds. In addition, in some embodiments, the user of the device is provided with a software setting for adjusting one or more intensity thresholds in a set of intensity thresholds (e.g., by adjusting individual intensity thresholds and / or by utilizing a system-level click on an "intensity" parameter to adjust multiple intensity thresholds at once).
[0161] As used in the specification and claims, the term "characteristic intensity" of a contact refers to a characteristic of the contact based on one or more intensities of the contact. In some embodiments, the characteristic intensity is based on multiple intensity samples. The characteristic intensity is optionally based on a predefined number of intensity samples or a set of intensity samples collected during a predetermined time period (e.g., 0.05 seconds, 0.1 seconds, 0.2 seconds, 0.5 seconds, 1 second, 2 seconds, 5 seconds, 10 seconds) relative to a predefined event (e.g., after contact is detected, before contact is detected to be lifted off, before or after contact begins to move, before contact ends, before or after contact is detected to increase in intensity, and / or before or after contact is detected to decrease in intensity). The characteristic intensity of a contact is optionally based on one or more of the following: the maximum value of the contact intensity, the mean value of the contact intensity, the average value of the contact intensity, the value at the top 10% of the contact intensity, the half-maximum value of the contact intensity, the 90% maximum value of the contact intensity, etc. In some embodiments, the duration of the contact is used in determining the characteristic intensity (e.g., when the characteristic intensity is the average value of the intensity of the contact over time). In some embodiments, the feature intensity is compared to a set of one or more intensity thresholds to determine whether the user has performed an operation. For example, the set of one or more intensity thresholds may include a first intensity threshold and a second intensity threshold. In this example, a contact whose feature intensity does not exceed the first threshold results in a first operation, a contact whose feature intensity exceeds the first intensity threshold but does not exceed the second intensity threshold results in a second operation, and a contact whose feature intensity exceeds the second threshold results in a third operation. In some embodiments, the comparison between the feature intensity and the one or more intensity thresholds is used to determine whether to perform one or more operations (e.g., whether to perform the corresponding option or give up performing the corresponding operation), rather than to determine whether to perform the first operation or the second operation.
[0162] In some embodiments, a portion of a gesture is identified for use in determining the characteristic strength. For example, a touch-sensitive surface may receive a continuous swipe contact that transitions from a starting position and reaches an ending position (e.g., a drag gesture) where the strength of the contact increases. In this example, the characteristic strength of the contact at the ending position may be based on only a portion of the continuous swipe contact, rather than the entire swipe contact (e.g., only a portion of the swipe contact at the ending position). In some embodiments, a smoothing algorithm may be applied to the strength of the swipe gesture before determining the characteristic strength of the contact. For example, the smoothing algorithm optionally includes one or more of: an unweighted sliding average smoothing algorithm, a triangular smoothing algorithm, a median filter smoothing algorithm, and / or an exponential smoothing algorithm. In some cases, these smoothing algorithms eliminate narrow peaks or dips in the intensity of the swipe contact to achieve the purpose of determining the characteristic strength.
[0163] In some embodiments, one or more predefined intensity thresholds are used to determine whether a particular input meets the intensity-based criteria. For example, the one or more predefined intensity thresholds include (i) a contact detection intensity threshold IT0, (ii) a light press intensity threshold IT1, and (iii) a touch detection intensity threshold IT2. L (iii) Deep pressure intensity threshold IT D (e.g., at least initially above I L ) and / or (iv) one or more other intensity thresholds (e.g., below I L The intensity threshold I H ). As used herein, IT L and I L Refers to the same light press intensity threshold, IT D and I D Refers to the same deep compression intensity threshold, while IT H and I H Refers to the same intensity threshold. In some embodiments, the light press intensity threshold corresponds to an intensity at which the device will perform an operation typically associated with clicking a button of a physical mouse or touchpad. In some embodiments, the deep press intensity threshold corresponds to an intensity at which the device will perform an operation different from the operation typically associated with clicking a button of a physical mouse or touchpad. In some embodiments, when a contact with a characteristic intensity lower than the light press intensity threshold (e.g., and higher than the nominal contact detection intensity threshold IT0, contacts lower than the nominal contact detection intensity threshold are no longer detected) is detected, the device will move the focus selector according to the movement of the contact on the touch-sensitive surface without performing the operation associated with the light press intensity threshold or the deep press intensity threshold. Generally speaking, unless otherwise stated, these intensity thresholds are consistent between different groups of user interface illustrations.
[0164] In some embodiments, the device's response to an input detected by the device depends on criteria based on the intensity of the contact during the input. For example, for some "light press" inputs, the intensity of the contact exceeding a first intensity threshold during the input triggers a first response. In some embodiments, the device's response to an input detected by the device depends on criteria that include both the intensity of the contact during the input and a time-based criterion. For example, for some "deep press" inputs, the intensity of the contact exceeding a second intensity threshold, which is greater than the first intensity threshold for a light press, during the input triggers a second response, as long as a delay time elapses between the first intensity threshold being met and the second intensity threshold being met. The duration of this delay time is typically less than 200ms (e.g., 40ms, 100ms, or 120ms, depending on the magnitude of the second intensity threshold, where the delay time increases as the second intensity threshold increases). This delay time helps avoid accidental deep press inputs. As another example, for some "deep press" inputs, a period of reduced sensitivity occurs after reaching the first intensity threshold. During this period of reduced sensitivity, the second intensity threshold is increased. This temporary increase in the second intensity threshold also helps avoid accidental deep press inputs. For other deep press inputs, the response to detecting the deep press input does not depend on time-based criteria.
[0165] In some embodiments, one or more of the input intensity thresholds and / or corresponding outputs vary based on one or more factors, such as user settings, contact motion, input timing, application running, rate at which intensity is applied, number of simultaneous inputs, user history, environmental factors (e.g., ambient noise), focus selector position, etc. Example factors are described in U.S. patent applications 14 / 399,606 and 14 / 624,296, which are incorporated herein by reference in their entireties.
[0166] For example, Figure 3A A dynamic intensity threshold 380 is shown that varies over time based in part on the intensity of the touch input 376 over time. The dynamic intensity threshold 380 is the sum of two components, where a first component 374 decays over time after a predefined delay time p1 from when the touch input 376 is initially detected, and a second component 378 tracks the intensity of the touch input 376 over time. The initial high intensity threshold of the first component 374 reduces situations where a "deep press" response is accidentally triggered, while still allowing an immediate "deep press" response if the touch input 376 provides sufficient intensity. The second component 378 reduces the unintentional triggering of a "deep press" response through gradual intensity fluctuations of the touch input. In some embodiments, when the touch input 376 meets the dynamic intensity threshold 380 (e.g., at Figure 3A ), triggering a “deep press” response.
[0167] Figure 3B Another dynamic intensity threshold 386 (eg, intensity threshold I D ). Figure 3B Two other intensity thresholds are also shown: a first intensity threshold I H and the second intensity threshold I L .exist Figure 3B Although the touch input 384 meets the first intensity threshold I before time p2, H and the second intensity threshold I L , but no response is provided until a delay time p2 has elapsed at time 382. Similarly, Figure 3B In the example, the dynamic intensity threshold 386 decays over time, wherein the decay is from time 382 (triggering the second intensity threshold I L This type of dynamic intensity threshold reduction begins at time 388 after the trigger is triggered with a lower threshold intensity (such as the first intensity threshold I H Or the second intensity threshold I L ) is triggered after or simultaneously with the response associated with the dynamic intensity threshold I D The associated response.
[0168] Figure 3C Another dynamic intensity threshold 392 (eg, intensity threshold I D ).exist Figure 3C In the example, after a delay time p2 has passed since the touch input 390 was initially detected, the trigger is triggered with the intensity threshold I L At the same time, the dynamic intensity threshold 392 decays after a predefined delay time p1 has elapsed from when the touch input 390 was initially detected. Thus, the intensity of the touch input 390 is attenuated between the trigger and intensity threshold values I without releasing the touch input 390. L The associated response then decreases and a subsequent increase in the intensity of the touch input 390 can trigger a response with a threshold intensity I D The associated response (e.g., at time 394) is performed even when the intensity of touch input 390 is below another intensity threshold, e.g., intensity threshold I L hour.
[0169] The contact characteristic strength is lower than the light press strength threshold IT L The intensity increases to between the light press intensity threshold IT L and deep press intensity threshold IT D The intensity between the deep press intensity threshold IT is sometimes referred to as a "light press" input. D The intensity of the deep press increases to above the deep press intensity threshold IT DThe intensity of the contact feature increases from an intensity below the contact detection intensity threshold IT0 to an intensity between the contact detection intensity threshold IT0 and the light press intensity threshold IT0. L A decrease in the characteristic intensity of a contact from an intensity above the contact detection intensity threshold IT0 to an intensity below the contact detection intensity threshold IT0 is sometimes referred to as detecting liftoff of the contact from the touch surface. In some embodiments, IT0 is zero. In some embodiments, IT0 is greater than zero. In some examples, shaded circles or ellipses are used to represent the intensity of a contact on the touch-sensitive surface. In some examples, unshaded circles or ellipses are used to represent corresponding contacts on the touch-sensitive surface without specifying the intensity of the corresponding contacts.
[0170] In some embodiments described herein, one or more operations are performed in response to detecting a gesture that includes a corresponding press input or in response to detecting a corresponding press input performed using a corresponding contact (or multiple contacts), wherein the corresponding press input is detected at least in part based on detecting an increase in the strength of the contact (or multiple contacts) to above a press input strength threshold. In some embodiments, the corresponding operation is performed in response to detecting an increase in the strength of the corresponding contact to above the press input strength threshold (e.g., the corresponding operation is performed on a "down stroke" of the corresponding press input). In some embodiments, the press input includes an increase in the strength of the corresponding contact to above the press input strength threshold and a subsequent decrease in the strength of the contact to below the press input strength threshold, and the corresponding operation is performed in response to detecting that the strength of the corresponding contact subsequently decreases to below the press input threshold (e.g., the corresponding operation is performed on an "up stroke" of the corresponding press input).
[0171] In some embodiments, the device employs intensity hysteresis to avoid unintended input, sometimes referred to as "jitter," where the device defines or selects a hysteresis intensity threshold that has a predefined relationship to a press input intensity threshold (e.g., the hysteresis intensity threshold is X intensity units lower than the press input intensity threshold, or the hysteresis intensity threshold is 75%, 90%, or some reasonable proportion of the press input intensity threshold). Thus, in some embodiments, a press input includes an increase in the intensity of the corresponding contact to above the press input intensity threshold and a subsequent decrease in the intensity of the contact to below a hysteresis intensity threshold corresponding to the press input intensity threshold, and a corresponding operation is performed in response to detecting that the intensity of the corresponding contact subsequently decreases below the hysteresis intensity threshold (e.g., performing the corresponding operation on an "up stroke" of the corresponding press input). Similarly, in some embodiments, a press input is detected only when the device detects that the contact strength increases from an strength equal to or less than a hysteresis strength threshold to an strength equal to or greater than a press input strength threshold and, optionally, the contact strength subsequently decreases to an strength equal to or less than the hysteresis strength, and a corresponding operation is performed in response to detecting the press input (e.g., an increase in contact strength or a decrease in contact strength, depending on the circumstances).
[0172] For ease of explanation, descriptions of operations performed in response to a press input associated with a press input intensity threshold, or in response to a gesture including a press input, are optionally triggered in response to detecting: the intensity of the contact increasing above the press input intensity threshold, the intensity of the contact increasing from an intensity below a hysteresis intensity threshold to an intensity above the press input intensity threshold, the intensity of the contact decreasing below the press input intensity threshold, or the intensity of the contact decreasing below a hysteresis intensity threshold corresponding to the press input intensity threshold. Additionally, in examples where operations are described as being performed in response to detecting a decrease in the intensity of the contact below the press input intensity threshold, the operations are optionally performed in response to detecting a decrease in the intensity of the contact below a hysteresis intensity threshold that corresponds to and is less than the press input intensity threshold. As described above, in some embodiments, triggering of these operations is also dependent on satisfying a time-based criterion (e.g., a delay time having elapsed between satisfying the first intensity threshold and satisfying the second intensity threshold).
[0173] Exemplary User Interfaces and Associated Processes
[0174] Attention is now turned to embodiments of a user interface ("UI") and associated processes that may be implemented on an electronic device having display generating components and one or more input devices, such as device 100 having a touch-sensitive display or a device having a separate display and a touch-sensitive surface.
[0175] Figure 2is a schematic diagram of a touch-sensitive display according to some embodiments, which is used to show a user interface of a menu of applications. A similar user interface is optionally provided on device 100 ( Figure 1A In some embodiments, the user interface 201a includes the following elements, or a subset or superset thereof:
[0176] One or more signal strength indicators 202 of one or more wireless communications, such as cellular signals and Wi-Fi signals;
[0177] ·time;
[0178] Bluetooth indicator 205;
[0179] Battery status indicator 206;
[0180] A tray 203 with icons for commonly used applications, such as:
[0181] o an icon 216 labeled “Phone” of the phone module 138, which optionally includes an indicator 214 of the number of missed calls or voice messages;
[0182] o an icon 218 of the email client module 140 labeled “Mail,” which optionally includes an indicator 210 of the number of unread emails;
[0183] o An icon 220 labeled "Browser" of the browser module 147; and
[0184] o an icon 222 labeled “iPod” of a video and music player module 152 (also referred to herein as a video or video browsing application, also referred to as an iPod (trademark of APPLE Inc.) module 152); and
[0185] Icons for other apps, such as:
[0186] o Icon 224 of the IM module 141 labeled "Messages";
[0187] o The icon 226 labeled “Calendar” of the calendar module 148;
[0188] o Icon 228 labeled “Photos” of the image management module 144;
[0189] o An icon 230 labeled “Camera” of the camera module 143;
[0190] o An icon 232 labeled “Online Video” of the online video module 155;
[0191] o Icon 234 labeled "Stock Market" of the Stock Market widget 149-2;
[0192] o The icon 236 of the map module 154 labeled “Map”;
[0193] o Icon 238 labeled "Weather" of the weather widget 149-1;
[0194] o The icon 240 labeled “Clock” of the alarm clock widget 149-4;
[0195] o An icon 242 labeled “Fitness” of the fitness module 142;
[0196] o An icon 244 labeled “Memo” of the memo module 153;
[0197] o a settings application or module icon 246 that provides access to settings for the device 100 and its various applications; and
[0198] o Other icons for additional applications such as App Store, iTunes, Voice Memos, and Utilities.
[0199] It should be noted that Figure 2 The icon labels shown in FIG are merely exemplary. Other labels are optionally used for various application icons. For example, icon 242 of fitness module 142 is alternatively labeled "Fitness Support," "Workout," "Workout Support," "Sports," "Sports Support," or "Health." In some embodiments, the label of a respective application icon includes the name of the application corresponding to the respective application icon. In some embodiments, the label of a particular application icon is different from the name of the application corresponding to the particular application icon.
[0200] In some embodiments, the home screen includes two areas: a tray 203 and an icon area 201. Figure 2 As shown, icon area 201 is displayed above tray 203. However, icon area 201 and tray 203 (also referred to as a "taskbar") are optionally displayed in locations other than those described herein.
[0201] Tray 203 optionally includes icons for the user's favorite applications on computing device 100. Initially, tray 203 may include a set of default icons. The user can customize tray 203 to include other icons in addition to the default icons. In some embodiments, the user customizes tray 203 by selecting an icon from icon area 201 and dragging and dropping the selected icon into tray 203 to add the icon to tray 203. In order to remove an icon from tray 203, the user selects the icon displayed in the favorites area for a threshold amount of time, which causes computing device 100 to display a control for removing the icon. The user's selection of the control causes computing device 100 to remove the icon from tray 203. In some embodiments, tray 203 is replaced by taskbar 4006 (as described in more detail below), and therefore, the details provided above with reference to tray 203 also apply to taskbar 4006, which can supplement the description of taskbar 4006 provided below.
[0202] In this disclosure, references to "split screen mode" refer to a mode in which at least two applications are displayed side by side on the display 112 at the same time and in which the two applications can interact (e.g., an email application and an instant messaging application are displayed side by side on the display 112). Figure 4E15E2 ). Split-screen mode is also referred to as a “side-by-side” display configuration or a “split-screen” display configuration. In some embodiments, the at least two applications displayed simultaneously in split-screen mode may also be “pinned” together, which refers to an association between the at least two applications (stored in the memory of the device 100) such that the two applications open together when any one of the at least two applications is launched. In some embodiments, an enable representation (e.g., a drag handle displayed near the top edge of the application window) may be used to unpin an application and instead display one of the at least two applications as overlaying the other, and this overlay display mode is referred to as a side-by-side display mode (e.g., the email application and instant messaging application in the side-by-side mode shown in FIG5E2 ). Side-by-side mode is also referred to as a “side-by-side” display configuration or a “side-by-side view”. The side-by-side window may also be referred to as a background full-screen window or an “overlay” of a pair of split-screen windows. In some embodiments, the at least two applications displayed simultaneously in side-by-side mode are not “pinned” together; therefore, when one of the at least two applications is displayed, the other application is optionally not displayed simultaneously, and yet another application is optionally displayed simultaneously. In some embodiments, an affordance (e.g., a drag handle displayed near the top edge of an application window) can be used to pin applications together and display them in split-screen mode. The user is also able to use a boundary affordance that is displayed within a boundary extending between the at least two applications while they are displayed in split-screen mode to unpin or clear one of the at least two applications (e.g., by dragging the boundary affordance until it reaches the edge of the display 112 adjacent to the first of the at least two applications, which is then cleared and the at least two applications are subsequently unpinned). Using a boundary affordance (or a gesture at the boundary between two applications) to unpin applications is discussed in more detail in co-owned U.S. patent application No. 14 / 732,618 (e.g., in Figures 37H to 37M and related descriptive paragraphs), which is hereby incorporated by reference in its entirety. Although many of the examples provided herein refer to different applications displayed in split-screen mode and side-by-side mode, many of the examples are also valid if windows of different applications are replaced with different windows of the same application displayed in split-screen mode or side-by-side mode, unless otherwise expressly stated.
[0203] Figures 4A1 to 4A50 、 Figures 4B1 to 4B51 、 Figures 4C1 to 4C48 、 Figures 4D1 to 4D19 and Figures 4E1 to 4E28is a schematic diagram of a touch-sensitive display for illustrating a user interface for interacting with multiple applications and / or windows according to some embodiments.
[0204] Figures 4A1 to 4A50 The user interface behavior of an application window displayed in a side-by-side mode according to some embodiments is shown. Interaction with an overlay switcher user interface that simultaneously displays multiple side-by-side windows corresponding to different applications is also described. The user interfaces in these figures are used to illustrate the processes described below, including 5A to 5I For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0205] As context for the description below, in some embodiments, the home screen user interface includes multiple application icons corresponding to different applications installed on the device. Each application icon, when activated by the user (e.g., by a tap input), causes the device to launch the corresponding application and display the application's user interface on the display (e.g., a default initial user interface or the last displayed user interface). The taskbar is a container user interface object that includes a subset of application icons selected from the home screen user interface to provide quick access to a small number of commonly used applications. The application icons included in the taskbar are optionally selected by the user (e.g., via a settings user interface) or automatically selected by the device based on various criteria (e.g., frequency of use or time since last use). In some embodiments, the taskbar is displayed as part of the home screen user interface (e.g., covering the bottom portion of the home screen user interface). In some embodiments, in response to a user request (e.g., a gesture that meets the taskbar display criteria (e.g., an upward swipe gesture starting from the bottom edge of the touch screen)), the taskbar is displayed above a portion of another user interface (e.g., an application user interface) that is independent of the home screen user interface. The application switcher user interface displays representations of multiple recently opened applications (e.g., arranged in an order based on the time when the application was last displayed). When selected (e.g., by a tap input), the representation of the corresponding recently opened application (e.g., a snapshot of the last displayed user interface of the corresponding recently opened application) causes the device to redisplay the last displayed user interface of the corresponding recently opened application on the screen. In some embodiments, the application switcher user interface displays windows of different display configurations that may correspond to the same or different applications (e.g., full screen windows, side-by-side windows and split-screen windows, minimized windows and / or draft windows, etc.).
[0206] like Figure 4A1 As shown, a first application window of a first application (e.g., window 4002 of a map application) is displayed on touch screen 112 in an independent display configuration (e.g., also a full-screen display configuration) without being displayed simultaneously with another application window of the same application or another application. First application window 4002 displays a portion of a first user interface of the first application (e.g., a map interface capable of searching). An input that meets the taskbar display criteria (e.g., an upward edge swipe input performed by contact 4004) is detected on touch screen 112 (e.g., near a bottom edge portion of touch screen 112), as shown. Figures 4A1 to 4A2As shown. In response to detecting input that meets the taskbar display criteria, the taskbar 4006 is displayed to cover the first application window of the first application (e.g., window 4002). The taskbar 4006 includes multiple application icons corresponding to different applications (e.g., icon 216 for the phone application, icon 218 for the email application, icon 220 for the browser application, and icon 232 for the online video application). In some embodiments, the taskbar includes application icons for the currently displayed application (e.g., a map application) and one or more recently displayed applications. In some embodiments, in response to input that meets the taskbar clearing criteria (e.g., a downward swipe gesture on the taskbar moving toward the bottom edge of the touch screen), the taskbar is temporarily removed from the display.
[0207] exist Figures 4A4 to 4A7 In some embodiments, a second application window (e.g., Figure 4A7 4010 in FIG. 40 is displayed in a side-by-side display configuration to cover a first application window (e.g., window 4002) of a first application. A second application window of a second application displays a portion of a second user interface of the second application (e.g., a media player user interface of an online video application). Figure 4A4 As shown, while a first window 4002 of a first application (e.g., a map application) is displayed, an input satisfying a selection criterion (e.g., a stationary touch hold input or a light press input via contact 4008) is detected on the application icon 232 of the online video application, and a subsequent movement of the input (e.g., movement of contact 4008 away from its touch-pressed position) enables initiation of a drag operation on the application icon 232. Figure 4A5 and Figure 4A6 In the embodiment of the present invention, a representation of a second application (e.g., representation 4012) is dragged on the touch screen according to movement of an input (e.g., movement of contact 4008). When contact 4008 is over a portion of the touch screen displaying a first user interface of a first application (e.g., a map application) and outside a first predefined portion of the touch screen (e.g., within a predefined area 4014 (within a threshold distance of a predefined side edge (e.g., right edge and / or left edge)), Figure 4D3 Also referred to as predefined area 4308, in Figure 4E8 Also called F zone))), such as Figure 4A5As shown, the representation 4012 of the second application dragged by contact 4008 has a first appearance (e.g., the same appearance as the original application icon 232), indicating that if the input ends at the current location (e.g., the lift-off of contact 4008 is detected), the drag operation will be canceled and the display state displayed before the input was detected will be restored. When contact 4008 moves on a portion of the touch screen within a first predetermined portion of the touch screen (e.g., predetermined area 4014), the electronic device displays as shown. Figure 4A6 Visual feedback is shown (e.g., representation 4012 of the second application is stretched) indicating that if the input ends at the current position within the first predetermined portion of the touch screen, the window of the second application will be displayed together with the first window of the first application in a corresponding simultaneous display configuration (e.g., a side-by-side display configuration in which the window of the second application covers a portion of the first window of the first application). In some embodiments, other visual feedback is provided such as a reduction in the size of the display of the first window 4002 of the first application on the touch screen (e.g., revealing an underlying background around the reduced first window) and / or a change in the visual clarity of the first window 4002 of the first application (e.g., blurring and / or dimming of window 4002) to indicate that the second application (e.g., an online video application) will be opened in a side-by-side display configuration with the currently open application (e.g., a map application). Figure 4A7 As shown, after the input ends when the contact 4008 is above the first predefined portion 4014 of the touch screen, the device opens a window of the second application (e.g., window 4010 of the online video application), which covers a portion of the first window of the first application (e.g., window 4002 of the map application) and covers at least a portion of the first predefined portion 4014 of the touch screen. In some embodiments, if the second application has no open windows or a single open window when the contact 4008 is detected, the window 4002 is opened with Figure 4A7 In some embodiments, if the second application has multiple windows open, representations of the multiple windows of the second application are displayed (e.g., in a window selector user interface for the second application), and the user selects one of the multiple windows to be displayed with the first application in a side-by-side configuration (e.g., by tapping the representation of the desired window of the second application in the window selector user interface). For example, with respect to Figures 4D1 to 4D19 Provides more details about behavior related to multiple windows of a second application.
[0208] exist Figures 4A8 to 4A11, another input through contact 4016 selects a third application (e.g., a touch-and-hold input or a light press input to the application icon 220 of the browser application) and according to the movement of the input (e.g., movement of contact 4016 after the initial stationary portion of the input through contact 4016), the third application is selected. Figures 4A4 to 4A7 The representation of the third application (e.g., representation 4018) is dragged on the touch screen in the same manner as the second application (e.g., online video application) shown. Figure 4A10 As shown, when contact 4016 is within predefined area 4014 near the side edge of the touch screen, representation 4018 of the third application is elongated and expanded laterally to indicate that if input ends at the current location, the window of the third application (e.g., a browser application) will be displayed in a side-by-side display configuration along with the first window 4002 of the first application (e.g., a map application). Figure 4A11 In response to detecting the end of input through contact 4016 (e.g., detecting lift-off of contact 4016), the device displays a window 4020 of the browser application that overlays a portion of the window 4002 of the map application. Figure 4A11 As shown, when the currently displayed slide-out window covers the window 4002 of the map application, the window 4020 of the browser application completely blocks the window 4010 or replaces the window 4010 .
[0209] In some embodiments, Figures 4A1 to 4A11 The interaction shown in causes multiple Slide Over windows (eg, window 4010 and window 4020 ) to be added to a list of zero or more Slide Over windows stored in memory of the device. Figures 4A12 to 4A50 Shown from Figure 4A12 The state shown begins various interactions with the Side Pull window list, for example, a Side Pull window of one application is displayed as part of a full-screen window covering another application (e.g., the same or different application as the application corresponding to the Side Pull window).
[0210] exist Figure 4A12In some embodiments, multiple inputs (e.g., multiple swipe inputs) are represented on the touch screen (e.g., by different contacts 4021, 4022, 4023, 4024, 4025, 4026, 4027, and 4066), corresponding to inputs at different locations and / or with different movement directions. In some embodiments, these inputs are separate inputs detected at different times on the screen when the screen displays window 4020 and window 4002 in side-by-side mode. In some embodiments, the device detects a single input, based on the location and / or movement direction of the input, and determines the characteristics of the input based on the location and / or movement direction of the input (e.g., evaluated according to different criteria for performing different operations (e.g., system-level operations (e.g., navigating between applications, switching between side-by-side windows, converting between display configurations, opening documents across applications, etc.) or application-level operations (e.g., activating user interface elements within the user interface of the displayed application, scrolling the user interface within the displayed application, etc.), performing operations such as relative to the input. Figures 4A13 to 4A50 Different operations described.
[0211] exist Figures 4A13 to 4A14 in Figure 4A12 Thereafter, input by contact 4024 is detected at a location corresponding to the drag handle area of Slide Over window 4020 (e.g., near the top edge of window 4020), and the input includes contact 4024 moving in a first direction (e.g., leftward, substantially horizontally) toward the opposite side edge of the display on the side occupied by window 4020. Figure 4A13 As shown, a side-pull window 4020 is dragged on the display to cover a portion of the window 4002. Figure 4A13 , even if window 4020 is dragged away from its original position on the right side of the display, the previously displayed Slide Over window 4010 is not revealed or displayed at that position on the right side of the display after window 4020 is moved away by the drag input made by contact 4024. Figure 4A14 In the embodiment, after the input by contact 4024 ends near the left edge of the display (e.g., within a first threshold distance from the left edge of the display and within a second threshold distance from the top edge of the display (e.g., within a Figure 4E8 When lift-off of contact 4024 is detected in zone H or zone B of the display, the device displays window 4020 covering a portion of window 4002 on the left side of the display (e.g., in a previously changed simultaneous display configuration (e.g., switching sides but remaining in side-pull mode)).
[0212] exist Figure 4A12 After Figure 4A15, input by contact 4025 is detected at a location corresponding to the drag handle area of side pull window 4020 (e.g., near the top edge of window 4020), and the input includes movement of contact 4025 along a second direction (e.g., to the right, slightly downward) toward a side edge of the display (e.g., a side edge on the side occupied by window 4020) and ending at Figure 4E8 In the E area shown. Figure 4A15 As shown, in response to the E zone ( Figure 4E8 ), the side-by-side window 4020 is converted to a side-by-side window 4028, and the full-screen window 4002 is converted to a side-by-side window 4030. Window 4028 and window 4030 are displayed in a side-by-side display configuration (or split-screen mode). In this case, window 4028 and window 4030 are fixed together and will be displayed together in a split-screen configuration when one of the windows is later recalled to the display. In addition, side-by-side window 4020 is removed from the list of side-by-side windows stored in the memory and will not be recalled to the display as a side-by-side window.
[0213] exist Figure 4A12 After Figures 4A16 to 4A18 In the embodiment of the present invention, input by contact 4021 is detected at a location within the bottom edge region of the touch screen, and the input includes movement of contact 4021 in a third direction (e.g., upward) toward the top edge of the touch screen. Based on determining that the input meets the application switcher display criteria (e.g., the speed and / or distance of the input meets the predefined speed and / or distance thresholds for navigating to the application switcher user interface), as shown in FIG. Figures 4A16 to 4A18 As shown, an animation sequence is shown, showing the current display state of the screen (e.g., Figure 4A12 ) to display application switcher user interface 4032 (e.g., also known as a multitasking user interface) (e.g., Figure 4A18 ) transition. In this animation sequence, the full screen window 4002 decreases in size and moves upward as the contact 4021 moves. The side pull window 4020 decreases in size and moves away from the representation of the window 4002 so that they are Figure 4A16 The transition user interface 4032' is shown as no longer overlapping. Figure 4A17 In the transition user interface 4032', other windows stored in the device's memory (for example, windows with stored states that were recently opened in the memory) are revealed, including full-screen windows, split-screen windows, and side-pull windows that are currently available on the device, which will be called to the display in the stored display states. Figure 4A18An application switcher user interface 4032 is shown, which includes representations of full screen windows (e.g., representation 4002' of window 4002, representation 4034' of full screen email window 4034), representations of window pairs displayed in split screen mode (e.g., representation 4036' of window 4030 and window 4028 displayed in split screen mode and representation 4038' of a browser window and an email window displayed in split screen mode), and representations of side-by-side windows (e.g., representation 4020' of window 4020, representation 4010' of window 4010, representation 4040' of an email side-by-side window, and representation 4042' of a photo side-by-side window).
[0214] In some embodiments, windows with different display configurations are grouped and displayed in different areas of the application switcher user interface 4032, and within each group, the windows are sorted according to the corresponding timestamps of when the windows were last displayed. For example, in the area including representations for side-by-side windows, window 4020 is the most recently displayed side-by-side window, and its corresponding representation 4020' is displayed in the leftmost position in the row, with representation 4010' for side-by-side window 4010 displayed next to it. The side-by-side windows represented by representations 4040' and 4042' were displayed earlier than the time when window 4010 was last displayed.
[0215] In some embodiments, each representation of an application window in the application switcher user interface 4032 is displayed with an identifier for the application for the window (e.g., the application name and the application icon) and is displayed with an identifier for the application window (e.g., a window name that is automatically generated based on the contents of the window).
[0216] In some embodiments, each representation of a window in the application switcher user interface causes the device to redisplay the window on the display when activated (e.g., by tapping input). If the activated representation corresponds to a full-screen window (e.g., window 4002 or window 4034), the window is called to the screen in the full-screen independent display configuration without displaying another application on the screen at the same time. In some embodiments, even if the full-screen window is last displayed simultaneously with the other side-pull window at the top, when the full-screen window is called to the screen from the application switcher user interface 4032, the full-screen window is displayed without displaying the side-pull window at the top. In some embodiments, when a representation of a side-pull window (e.g., window 4010, window 4020, window 4040, or window 4042) is activated in the application switcher user interface 4032, the side-pull window is called to the display together with another full-screen or split-screen window (e.g., window 4002, window 4034, or a pair of windows in the split-screen configuration) below the side-pull window. In some embodiments, the window below the side pull window is the full screen window or the pair of split screen windows that was displayed immediately before the application switcher user interface 4032 was displayed. In some embodiments, the window below the side pull window is the last window displayed simultaneously with the side pull window. In some embodiments, when the representation of a pair of split screen windows (e.g., representation 4036' or representation 4038') is activated in the application switcher user interface 4032, the pair of split screen windows are called together to the display in split screen mode.
[0217] exist Figure 4A12 After Figures 4A19 to 4A21 , input by contact 4022 is detected at a position within the bottom edge area of the side pull window 4020, and the input includes movement of contact 4022 along a fourth direction (e.g., substantially horizontally) toward an edge on a side of the screen where the side pull window 4020 is displayed (e.g., the right edge of the screen). In response to the input by contact 4022, the side pull window 4020 is dragged toward the right edge of the screen and is removed from the screen after the end of the input. During the movement of contact 4022 and window 4020, other windows in the side pull window stack stored in the memory of the device are represented on the display. For example, as Figure 4A19 and Figure 4A20 As shown, representations of windows 4010, 4040, and 4042 are revealed from below window 4020. The order of windows 4020, 4010, 4040, and 4042 corresponds to the order in which these windows were last displayed on the screen. In some embodiments, windows 4020, 4010, 4040, and 4042 are displayed at different depths in a direction perpendicular to the surface plane of the screen (e.g., with decreasing size and decreasing clarity as the distance from the surface plane of the screen increases). This is similar to Figures 4A13 to 4A14The situation shown is different, in that when window 4020 is dragged toward the other side of the screen, there is no indication that other windows are below window 4020 (e.g., no other windows are revealed below window 4020). Figure 4A19 and Figure 4A20 , when window 4020 is dragged toward the right edge of the screen by input pointing to the bottom edge of window 4020, the next window in the side-pull window stack (e.g., window 4010) gradually reveals itself and eventually becomes the top window shown overlaying full-screen window 4002 (e.g., Figure 4A21 shown).
[0218] exist Figure 4A21 After Figures 4A22 to 4A25 , input by contact 4046 is detected at a position within the bottom edge area of the side pull window 4010, and the input includes movement of contact 4046 along a fourth direction (e.g., substantially horizontally) toward an edge on a side of the screen where the side pull window 4010 is displayed (e.g., the right edge of the screen). In response to the input by contact 4046, the side pull window 4010 is dragged toward the right edge of the screen and is removed from the screen after the end of the input. During the movement of contact 4046 and window 4010, other windows in the side pull window stack stored in the memory of the device are represented on the display. For example, as Figure 4A23 As shown, representations of windows 4040, 4042, and 4020 are revealed from below window 4010. Generally speaking, if input via contact 4046 is detected within a threshold amount of time after input via contact 4022, the original top window 4020 is randomized to the bottom of the overlay (e.g., as Figure 4A23 4020 is the most recently displayed window other than window 4010. If input via contact 4046 is detected after window 4010 has been displayed as the top window for more than a threshold amount of time, the overlays are sorted based on the order in which the windows were last displayed, and window 4020 is inserted into the top window. Figure 4A23 In some embodiments, when the entire side-pull window stack is removed from the display, the entire side-pull window stack is reordered based solely on when the windows were last displayed (e.g., as Figures 4A28 to 4A29 shown). Figure 4A24 , after the input through contact 4046 ends, window 4040 is displayed as a side-pull window covering the full-screen window 4002.
[0219] exist Figure 4A24 After Figures 4A25 to 4A27, input by contact 4048 is detected at a position within the bottom edge area of side pull window 4040, and the input includes movement of contact 4048 in a fifth direction (e.g., substantially horizontally) away from an edge on a side of the screen where side pull window 4040 is displayed (e.g., the right edge of the screen). In response to the input by contact 4048, side pull window 4010, which was just removed from the display, is dragged back onto the screen, covering window 4040. During the movement of contact 4048 and window 4010, other windows in the side pull window stack stored in the memory of the device are represented on the display. For example, as Figure 4A26 As shown, representations of windows 4040, 4042, and 4020 are revealed from below window 4010. In some embodiments, the windows in the side-by-side window stack are arranged on a circular carousel with the bottom card and the top card arranged adjacent to each other. A swipe in one direction around the circular carousel scrolls through the windows in that direction, and a swipe in the opposite direction scrolls through the windows in the opposite direction. After detecting the end of input by contact 4048, window 4010 is displayed as a side-by-side window covering full-screen window 4002, as shown in FIG. Figure 4A27 4010) above the dragged window (e.g., window 4040), and at least one window (e.g., window 4042 and window 4020) is shown below the dragged window (e.g., window 4010).
[0220] exist Figure 4A12 After Figures 4A28 to 4A29 , an input by contact 4027 is detected at a position near the left edge of the side pull window 4020, and the input includes movement of contact 4027 along a sixth direction (e.g., substantially horizontally) toward an edge of the screen on the side where the side pull window 4020 is displayed (e.g., the right edge of the screen). In some embodiments, the device requires that the input be detected at or within a threshold distance of the left edge of the window 4020 in order to trigger the operation of removing the side pull window overlay from the display. In some embodiments, as Figure 4A28As shown, during the movement of contact 4027 toward the right edge of the display, window 4020 is gradually dragged away from the display, and visual indications of the other windows in the Side Pull window stack are shown trailing the movement of window 4020. After the end of the input made by contact 4027 is detected, window 4020 is removed from the display, and no other Side Pull windows are shown on the display simultaneously with background window 4002. Window 4002 is displayed as a full-screen window in the standalone display configuration, rather than as a full-screen background window of the Side Pull window in the Side Pull display configuration. This is consistent with the following FIG5A12 Figure 4A50 , where an input detected outside of Slide Over window 4020 and comprising movement in a sixth direction (e.g., substantially horizontally toward the right edge of the display) causes the user interface within window 4002 to shift rightward in accordance with the movement of contact 4026 without causing any movement of Slide Over window 4020. This is also different from the rightward swipe input detected outside of Slide Over window 4020 and comprising movement in a sixth direction (e.g., substantially horizontally toward the right edge of the display). Figure 4A12 After Figures 4A19 to 4A21 The opposite is true of the situation in which the window 4020 slides out of the display and the lower window 4010 becomes a side-pull window covering the background window 4002 after the input ends.
[0221] exist Figure 4A29 After Figures 4A30 to 4A32 , input by contact 4052 is detected on a side edge of the display (e.g., on a side of the screen where a side pull window (e.g., window 4020) was previously displayed), and the input includes movement of contact 4052 in a seventh direction (e.g., substantially horizontally) away from the side edge on the display. In response to detecting the input by contact 4052, the last displayed side pull window (e.g., window 4020) is dragged back onto the display, covering the currently displayed full screen window (e.g., window 5004), as shown. Figure 4A32 As shown. In some embodiments, if a window on the display has been switched to another full-screen window in an independent display configuration (e.g., a full-screen window displayed in response to a tap on an application icon in the taskbar, a selection from an application's list of open windows after tapping an application icon, or an application switching gesture (e.g., a horizontal swipe along the bottom edge of a currently displayed independent window)), input by contact is detected on a side edge of the display (including horizontal movement of the contact from the side edge to the screen), and the last displayed side-pull window (e.g., window 4020) is dragged back onto the display, covering the currently displayed full-screen window (e.g., a full-screen window other than window 4002). Figure 4A31 , when window 4020 is dragged back onto the display as contact 4052 moves to the left, representations of the other windows in the side-pull window stack are shown below window 4020.
[0222] In some embodiments, Figure 4A12 After Figures 4A30 to 4A32 , input by contact is detected in an area that is a threshold distance away from a side edge of the display (e.g., a side edge on a side of the screen on which the side pull window (e.g., window 4020) was previously displayed), and the input includes movement of contact 4052 in a seventh direction (e.g., substantially horizontally) away from the side edge on the display. In response to detecting the input by the contact, the last displayed side pull window (e.g., window 4020) will not be dragged back onto the display. Instead, the input causes an operation in an application (e.g., a map application) corresponding to the input to be performed, such as moving a searchable map user interface displayed in window 4002 relative to the display in accordance with the movement of the contact.
[0223] exist Figures 4A33 to 4A34 in Figure 4A12 Afterwards, input is detected by contact 4023 on the bottom edge of the side-pull window (e.g., window 4020), and the input includes movement of contact 4023 on the display along an eighth direction (e.g., upward). In response to detecting input by contact 4023 and based on determining that the movement of contact 4023 meets a preset standard (e.g., exceeding a threshold amount of movement along the eighth direction, or exceeding a threshold speed along the eighth direction), the device displays a transition user interface 4053, which includes a representation of the side-pull window 4020 that moves according to the movement of contact 4023 (e.g., representation 4020'). In some embodiments, the background window (e.g., window 4002) is visually obscured (e.g., blurred and dimmed) below the representation of the side-pull window in the transition user interface 4053. In some embodiments, as the representation of the top side pull window is dragged around the display in accordance with movement of contact 4023, representations of other side pull windows in the side pull window stack (e.g., representations 4010', 4040', and 4042') are shown below the representation of the top side pull window (e.g., representation 4020'). In some embodiments, the representation of the side pull window is dynamically updated (e.g., resized) in accordance with the current position of the representation (and contact 4023) on the display. Figure 4A34 In some embodiments, a lift-off of contact 4023 has been detected, and the device displays the Side Pull Window switcher user interface or overlay switcher user interface 4054 only for the Side Pull Window currently stored in the Side Pull Window stack stored in memory. In some embodiments, representations of the Side Pull Window in the Side Pull Window stack are displayed and can be individually selected in overlay switcher user interface 4054. Overlay switcher user interface 4054 behaves similarly to an application switcher user interface (e.g., Figure 4A184032 in the application switcher user interface), because tapping the representation of the side pull window in the overlay switcher user interface 4054 causes the side pull window to be displayed. Figure 4A34 As shown, in some embodiments, the representations of the side pull windows in the stored side pull window stack are spread out on the background without overlapping each other. In some embodiments, the representation of the side pull window is a reduced scale image of the side pull window. In some embodiments, due to the limitation of the display size and the total number of side pull windows in the stack, some of the representations of the side pull windows are not displayed. For example, in Figure 4A34 , there are a total of four Slide Over windows in the overlay, and the representation of one of those windows (e.g., representation 4042') is initially only partially visible in overlay switcher user interface 4054. If there were additional Slide Over windows in the overlay, the representations of those additional Slide Over windows would not initially be visible in overlay switcher user interface 4054. In some embodiments, instead of displaying the representations of the Slide Over windows in a fully expanded configuration in the overlay switcher user interface, those representations are displayed in the overlay with the underlying representations offset by different amounts from the representation of the top Slide Over window.
[0224] Figure 4A35 An overlay switcher user interface 4054 is displayed, including a representation of the side pull window currently in the side pull window stack. Multiple inputs corresponding to different locations, input types, and / or different movement directions (e.g., tap inputs and swipe inputs) are represented on the touch screen (e.g., by different contacts 4056, 4058, 4059, 4060, 4062, and 4064). In some embodiments, these inputs are separate inputs detected at different times on the screen when the screen displays the overlay switcher user interface 4054. In some embodiments, the device detects a single input, based on the location, input type, and / or movement direction of the input, and determines the characteristics of the input based on the location, input type, and / or movement direction of the input (e.g., evaluated according to different criteria for performing different operations (e.g., different system-level operations, such as navigating or browsing within the overlay switcher user interface, exiting the overlay switcher user interface to display a previously displayed window or a selected window, closing a window in the side pull window stack, etc.), performing operations such as relative to the input. Figures 4A36 to 4A42 Different operations described.
[0225] exist Figure 4A35 After Figures 4A36 to 4A37, input via contact 4056 is detected on one of the displayed representations (e.g., representation 4010'), and the input includes movement of contact 4056 on the display along a ninth direction (e.g., horizontally (e.g., to the right)). In response to detecting the input via contact 4056 and based on determining that the input meets a preset criterion (e.g., the position of contact 4056 is on the representation of the side-pull window, and the direction of movement of contact 4056 is horizontal), the device scrolls the overlay switcher user interface 4054 to reveal representations of the side-pull window that are not currently displayed or not fully displayed in the overlay switcher user interface. In some embodiments, a representation displayed near one side of the display (e.g., representation 4020') gradually moves out of the display, and a representation on the other side of the display gradually enters the display based on the movement of contact 4056, as shown in FIG. Figure 4A35 and Figure 4A36 As shown. Figure 4A37 In some embodiments, the representation that moves off the display is added to the end of the overlay (e.g., the overlay whose end and beginning are connected to each other, similar to a circular turntable) and is redisplayed on the other side of the display if contact 4056 continues to move in the same direction. In some embodiments, the device does not require that contact 4056 be detected on the representation of the side pull window in the overlay switcher user interface 4054, as long as the input includes movement in the horizontal direction exceeding a threshold amount, scrolling of the overlay switcher user interface 4054 is performed. In some embodiments, the direction of scrolling is determined based on the direction of movement of the contact on the display.
[0226] exist Figure 4A35 After Figures 4A38 to 4A39 , input by contact 4058 is detected on one of the displayed representations (e.g., representation 4010'), and the input includes movement of contact 4058 on the display in a tenth direction (e.g., vertically (e.g., upward)). In response to detecting the input by contact 4058, the representation is removed from the overlay switcher user interface 4054, and the side pull window represented by the removed representation is removed from the side pull window stack stored in memory. In other words, the side pull window corresponding to the removed representation is "closed." Figure 4A39 , representations of other windows that are not closed (eg, representations 4042 ′, 4040 ′, and 4020 ′) remain displayed in overlay switcher user interface 4054 .
[0227] exist Figure 4A35 After Figure 4A40, a tap input by contact 4059 is detected on representation 4010′ of window 4010; and in response to detecting the tap input by contact 4059, the device stops displaying the overlay switcher user interface and displays the full-screen background window in Slide Over mode with Slide Over window 4010. In some embodiments, the full-screen background window is the last full-screen window displayed (e.g., window 4002), regardless of whether the full-screen window was last displayed with the selected Slide Over window. In some embodiments, the full-screen background window is the full-screen window last displayed with the selected Slide Over window (e.g., window 4002).
[0228] exist Figure 4A35 After Figure 4A41 , a tap input by contact 4060 is detected on representation 4040′ of window 4040; and in response to detecting the tap input by contact 4060, the device stops displaying overlay switcher user interface 4054 and displays the full-screen background window in side-by-side mode with side-by-side window 4040. In some embodiments, the full-screen background window is the full-screen window that was last displayed (e.g., window 4002), regardless of whether the full-screen window was last displayed with the selected side-by-side window. In some embodiments, the full-screen background window is the full-screen window that was last displayed with the selected side-by-side window (e.g., window 4002 or another window different from window 4002).
[0229] exist Figure 4A35 After Figure 4A42 , a tap input by contact 4062 is detected on representation 4020′ of window 4020; and in response to detecting the tap input by contact 4062, the device stops displaying overlay switcher user interface 4054 and displays the full-screen background window in Slide Over mode with Slide Over window 4020. In some embodiments, the full-screen background window is the last full-screen window displayed (e.g., window 4002), regardless of whether the full-screen window was last displayed with the selected Slide Over window. In some embodiments, the full-screen background window is the full-screen window last displayed with the selected Slide Over window (e.g., window 4002).
[0230] also, Figure 4A42The shown state is also displayed in response to a tap input via contact 4064 detected on a portion of overlay switcher user interface 4054 that is not occupied by any representation of the side-up window. In some embodiments, overlay switcher user interface 4054 includes a close affordance, and the tap input detected on the close affordance also causes the device to stop displaying overlay switcher user interface 4054 and redisplay the last displayed user interface state (e.g., window 4020 overlaying window 4002 in side-up mode).
[0231] Figure 4A42 After Figures 4A43 to 4A46 4034 is shown as being a full-screen window that was last displayed before window 4002. Figures 4A43 to 4A45 As shown, when the background full screen window changes, the side pull window 4020 is not affected by the input made by the contact 4066. After the input made by the contact 4066 ends, the side pull window 4020 is covered on the window 4034 in the side pull mode, as shown in FIG. Figure 4A46 In some embodiments, Figures 4A43 to 4A46 The process shown in Figure 4A12 In some embodiments, Figure 4A12 The user interface shown does not include a taskbar (e.g., after removing the taskbar by swiping down on the taskbar). In some embodiments, window 4034 is a full-screen window for another application (e.g., an email application) that is different from the application whose full-screen window was initially displayed below the Slide Over window 4020 (e.g., a map application). In some embodiments, window 4034 is a full-screen window for the same application as the full-screen window that was initially displayed below the Slide Over window 4020.
[0232] exist Figure 4A46, another input by contact 4068 is detected on a document represented in window 4034 (e.g., an email message in a list of email messages in an email application). An initial portion of the input by contact 4068 has satisfied criteria for initiating a drag operation on the document (e.g., the input is a tap-and-hold input in which the contact remains substantially stationary for at least a threshold amount of time after being pressed down on the document, or the input is a light press input with a contact intensity exceeding a threshold intensity that is greater than a nominal contact detection intensity threshold), and the document is selected (e.g., as indicated by visual highlighting of the document).
[0233] exist Figure 4A47 , a representation 4070 of the document is dragged on the display in accordance with the movement of contact 4068. Figure 4A48 , when contact 4068 is within a predefined area of the display (e.g., predefined area 4014 for opening a side pull window by placing an application icon thereon, or a reduced-size version of predefined area 4014), the representation of the document is converted (e.g., to representation 4044') to a state showing a preview of a new side pull window that displays the document in the document's native application.
[0234] exist Figure 4A49 , after the input ends (e.g., lift-off of contact 4068 is detected within predefined area 4014 or a reduced-size version of predefined area 4014), the document is opened in a side-pull window of a local application of the document (e.g., a side-pull window of an email application), and the side-pull window 4044 displaying the document becomes a top side-pull window covering the background full-screen window 4034.
[0235] In some embodiments, if the input ends at another location on the display, other operations may be performed. For example, in some embodiments, if the input ends in an area of the display corresponding to opening a new window in split-screen view mode, the document will be opened in a new window displayed side by side with a resized version (e.g., a reduced width version) of the email application window 4034. In some embodiments, if the input ends in an area of the display above the side-pull window but outside the predefined area of the new window for opening a document, and the side-pull window presents an acceptable placement location for the document, the document will be inserted into the placement location in the side-pull window (e.g., inserted into another document or message or storage location shown in the side-pull window). In some embodiments, if the input ends outside the side-pull window, the document will be placed in an acceptable placement location (if any) in window 4034 corresponding to the end location of the input, or returned to the original location if no acceptable placement location is available.
[0236] exist Figure 4A12 After Figure 4A50 , input is detected outside of Slide Over window 4020 via contact 4026, including movement of contact 4026 in a corresponding direction. In response to the movement of the contact, the device performs an operation within the application corresponding to background full-screen window 4002, for example, shifting a map according to the movement of contact 4026. Because the initial position of contact 4026 is outside of Slide Over window 4020, even if the contact later moves over the area where Slide Over window 4020 is displayed, the application-level operation is initiated and continued.
[0237] Figures 4B1 to 4B51 User interface behavior in response to a user request to switch applications by selecting an application icon is shown according to some embodiments. The request to switch applications is integrated with a request to view a window switcher user interface for the application with the same gesture. The device automatically determines whether to switch applications or display a window switcher user interface for the currently displayed application based on whether the currently displayed application currently has more than one window. According to some embodiments, user interaction with a window switcher user interface that simultaneously displays multiple windows corresponding to corresponding applications is also described. The user interfaces in these figures are used to illustrate the processes described below, including Figures 6A to 6E For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0238] Figures 4B1 to 4B4 An interaction is shown in which a user selects an application icon to open the corresponding application when the corresponding application is currently displayed.
[0239] like Figure 4B1As shown, a full screen window 4102 of an email application is displayed on touch screen 112. In this example, full screen window 4102 is displayed in a full screen standalone display configuration, and no other windows are displayed on the screen at the same time. In some embodiments, the device has the same response as described below regardless of whether full screen window 4102 is displayed in a standalone configuration or as a background window for a side-by-side window in side-by-side mode (e.g., a side-by-side window of the same or a different application). Figure 4B1 , input by contact 4104 is detected on the screen at a location corresponding to a first application icon (e.g., application icon 218 for an email application) in taskbar 4006 overlaid on full screen window 4102. In response to detecting the input, and based on determining that the input satisfies selection criteria (e.g., the input satisfies criteria (e.g., location and timing criteria) for detecting a tap input on an application icon), the device determines whether the selected icon corresponds to an application for a currently displayed window. In this case, both the currently displayed window (e.g., window 4102) and the selected application icon (e.g., application icon 218) correspond to the email application. In response to determining that both the currently displayed window (e.g., window 4102) and the selected application icon (e.g., application icon 218) correspond to the email application, the device determines whether the application is associated with multiple windows (e.g., multiple open windows are saved in memory as "open" windows that can be recalled to the screen using the saved last displayed state). In this case, based on determining that the email application has more than one open window at this time, the device displays window switcher user interface 4018 ( Figure 4B4 ), the window switcher user interface simultaneously displays representations of multiple open windows associated with the email application. This is in contrast to the case where the application icon for the email application is activated by input that meets the selection criteria if the email application is not the currently displayed application (e.g., when another application is the currently displayed application or a system user interface (e.g., a home screen user interface) is currently displayed).
[0240] exist Figure 4B2 to Figure 4B3 In response to determining that the input made by contact 4104 has satisfied the selection criteria and that the currently displayed window and the selected application icon correspond to the same application, and that the application is associated with multiple windows, an animated transition is displayed. The animated transition shows that the currently displayed full-screen window 4102 is reduced in size and becomes a representation (e.g., a reduced-scale image) 4102' of window 4102, and representations of other windows (e.g., Figure 4B44108. In FIG, a representation 4016' of the side-pull email window 4106 and representations 4110' of the email window and photo window shown in split-screen mode appear on the screen overlaying the background of the window switcher user interface 4108. Figure 4B4 , after the end of the input made by contact 4104 and the completion of the animated transition, window switcher user interface 4108 is displayed, replacing full screen window 4102 of the email application on the screen. In this case, window switcher user interface 4108 is displayed with representations of all saved windows associated with the mail application, overlaid on a background (e.g., a blurred or dimmed image of full screen window 4102), including representations of all full screen windows (e.g., representation 4102′ of full screen window 4102), representations of all side-by-side windows (e.g., representation 4106′ of side-by-side window 4106), and representations of all windows displayed in split screen mode (e.g., representation 4102′ of the email window displayed in split screen mode with a photo window). Each representation in the window switcher user interface 4108, when activated by input that meets the selection criteria (e.g., a tap input), causes the device to cease displaying the window switcher user interface and display the window corresponding to the selected representation, completing the task of returning to the previously displayed window (e.g., if a representation of the window originally displayed was selected) or switching to a different window of the same application (e.g., if a representation of a window other than the window originally displayed was selected).
[0241] Likewise Figure 4B4 As shown, a close affordance 4114 is provided in window switcher user interface 4108. The close affordance, when activated by an input that satisfies selection criteria (e.g., a tap input), causes the device to cease displaying window switcher user interface 4108 and redisplay full screen window 4102. A new window affordance 4112 is also provided in window switcher user interface 4108. The new window affordance 4112, when activated by an input that satisfies selection criteria (e.g., a tap input), causes the device to cease displaying window switcher user interface 4108 and display a new window for the email application (e.g., a default window (e.g., an email inbox user interface, a draft email user interface, a new message user interface, etc.)).
[0242] exist Figure 4B4 , input via contact 4118 is detected on representation 4102′ of originally displayed full screen window 4102. In response to detecting input via contact 4118 and based on determining that the input meets a first criterion (e.g., the input is a tap input), the device stops displaying window switcher user interface 4108 and displays full screen window 4102, as shown. Figure 4B5 shown.
[0243] Figure 4B5 4 shows that while displaying a full screen window 4102 for an email application, input via contact 4120 is detected on application icon 224 for a messaging application. Based on determining that the input via contact 4120 satisfies a first criterion (e.g., the input is a tap input), the device determines whether application icon 224 and currently displayed window 4102 correspond to the same application. Based on determining that application icon 224 and currently displayed window 4102 do not correspond to the same application, the device stops displaying full screen window 4102 and displays a full screen window 4122 corresponding to the messaging application (e.g., a default window for the messaging application (e.g., the last displayed full screen window for the messaging application)), as shown. Figure 4B6 As shown. Figures 4B5 to 4B6 In the example scenario shown, the user's request to switch applications is satisfied regardless of whether the messaging application is associated with multiple windows at the time or whether the email application is associated with multiple windows at the time because the user selected an application icon other than the currently displayed application.
[0244] Figures 4B7 to 4B8 Shown with Figures 4B1 to 4B4 The opposite of the situation shown. Figures 4B7 to 4B8 In the example case shown, a full screen window 4122 of a messaging application is displayed on touch screen 112. In some embodiments, the device has the same response as described below regardless of whether full screen window 4102 is displayed in a standalone configuration or as a background window for a side-by-side window in side-by-side mode (e.g., a side-by-side window of the same or a different application). Figure 4B7, an input via contact 4124 is detected on the screen at a location corresponding to application icon 224 of a messaging application in taskbar 4006 overlaid on full-screen window 4122 of messaging window 4122. In response to detecting the input, and based on determining that the input satisfies the selection criteria, the device determines whether the selected application icon corresponds to an application for a currently displayed window. In this case, both the currently displayed window (e.g., window 4122) and the selected application icon (e.g., application icon 224) correspond to the messaging application. In response to determining that both the currently displayed window (e.g., window 4122) and the activated application icon (e.g., application icon 224) correspond to the messaging application, the device determines whether the application is associated with multiple windows (e.g., multiple open windows are saved in memory as "open" windows that can be recalled to the screen using the saved last displayed state). In this case, based on determining that the messaging application does not have more than one open window at this time, the device provides one or more outputs (e.g., outputs corresponding to visual feedback, audio feedback, and / or tactile feedback) to indicate that an application switching operation or a window switcher display operation will not be initiated in response to input made through contact 4124. Figure 4B8 , application icon 224 shakes in response to input through contact 4124, optionally in combination with an audio or tactile alert, to indicate that the currently displayed window and the selected application icon correspond to the same application and that the application is not associated with multiple windows, and to indicate that an application switching or window switcher display operation will not be performed.
[0245] Figure 4B8 After Figures 4B9 to 4B13 A process is shown in which additional windows are opened in a messaging application so that at the end of the process there is more than one window associated with the messaging application. There are other ways to open additional windows in a messaging application, and Figures 4B9 to 4B13 The process shown in is just one of many ways to open additional windows in an application.
[0246] like Figure 4B9 As shown, input by contact 4128 is detected at a location on full screen window 4122 corresponding to representation 4130 of a conversation with Greg Kane. In response to detecting the input by contact 4128, and based on determining that the initial portion of the input meets object movement criteria (e.g., time or intensity criteria for detecting a tap-and-hold input or a light press input to initiate a drag operation on an object (e.g., a document, a user interface object, a content item, etc.), the device displays representation 4130 in a highlighted state. Figures 4B10 to 4B11, another representation 4132 of the conversation with Greg Kane (e.g., a copy of representation 4130) is dragged on the display based on movement of contact 4128 detected after the initial portion of input through contact 4128 satisfies the object movement criteria. Figure 4B12 , when representation 4132 is dragged to a predefined area 4308 near the right edge of the display (e.g., also in Figure 4C28 As shown in FIG, the predefined area 4308 is Figure 4A6 4E8 and a reduced width version of zone F in 4E8) to open content in a side-pull window for an application, the device provides visual feedback (e.g., the full-screen window 4122 is reduced in size and converted to a scaled-down representation 4122' of window 4122, thereby revealing the background beneath the scaled-down representation 4122', and representation 4132 is simultaneously stretched and expanded laterally) to indicate that if the input ends at this time, the side-pull window of the messaging application will be displayed as covering the full-screen window 4122 on the right side of the screen. In some embodiments, the visual feedback also includes visually blurring the resized full-screen window and displaying an application icon corresponding to the full-screen window on the visually blurred window. In some embodiments, the application icon for the messaging application is shown on representation 4132. Figure 4B13 , a side pull window 4136 of the messaging application is opened and displayed on the right side of the display, covering a portion of the full-screen window 4122 of the messaging application. Within side pull window 4136, the conversation with Greg Kane is displayed. In other words, the content object (e.g., the conversation with Greg Kane) dragged to the right side of the screen (e.g., dragged into predefined area 4308 for opening the content in the side pull window) is opened in the side pull window of the application corresponding to the content object (e.g., the side pull messaging window). After the input via contact 4128 ends, there is now more than one window associated with the messaging application, including full-screen window 4122 and side pull window 4136.
[0247] exist Figure 4B13 After Figures 4B14 to 4B17 , another input is detected by contact 4138 on application icon 228 in taskbar 4006, and the other input causes a slide-out window to be opened in the photos application. There are many ways to open a new window in an application, Figures 4B14 to 4B17 The process shown in is just one of many ways to open a new window. In this example, the new window is the first window opened in the Photos application. Figure 4B14As shown, when the full screen window 4122 and the Slide Over window 4136 of the Messages application are displayed in Slide Over mode, input via contact 4138 is detected at a location on the display corresponding to the application icon 228 of the Photos application. Figures 4B15 to 4B16 , after an initial portion of the input satisfies the object movement criteria for initiating a drag operation on the application icon, a representation 4140 of the photos application is dragged on the display based on movement of contact 4138 detected after the initial portion of the input satisfies the object movement criteria. Figure 4B16 , when contact 4138 drags representation 4140 of the photo application into predefined area 4014 for opening a side-pull window on the right side of the display (e.g., area 4014 for opening a side-pull application window by dropping an application icon is wider than Figure 4B12 In the area 4308 for opening the content in the new side pull window), the representation 4140 is stretched and expanded horizontally to indicate that the drop zone for opening the side pull window of the dragged application has been reached. Figure 4B17 , after the input ends in the predefined area 4014 (e.g., after contact 4138 is lifted off in the predefined area 4014), the side-pull window 4142 of the photo application is displayed as a top side-pull window covering the full screen window 4122.
[0248] Figures 4B18 to 4B19 Shows something like Figures 4B1 to 4B4 The situation shown, and with Figures 4B5 to 4B6 as well as Figures 4B7 to 4B8 The opposite is true for those shown.
[0249] exist Figures 4B18 to 4B19 In the example scenario shown, a full screen window 4122 for a messaging application is displayed on touch screen 112 along with a side-by-side window 4142 for a photos application. In some embodiments, the device has the same response as described below regardless of whether full screen window 4122 is displayed in a standalone display configuration or as a background window for a side-by-side window in side-by-side mode (e.g., a side-by-side window of the same or a different application). Figure 4B18, input by contact 4144 is detected on the screen at a location corresponding to application icon 224 for a messaging application in taskbar 4006 overlaid on full screen window 4122. In response to detecting the input, and based on determining that the input satisfies the first criterion, the device determines whether the selected icon corresponds to an application for a currently displayed window. In this case, both the currently displayed window (e.g., window 4122) and the selected application icon (e.g., application icon 224) correspond to the messaging application. In response to determining that both the currently displayed window (e.g., window 4122) and the activated application icon (e.g., application icon 224) correspond to the messaging application, the device determines whether the messaging application is associated with multiple windows (e.g., multiple open windows are saved in memory as "open" windows that can be recalled to the screen using the saved last displayed state). In this case, based on determining that the messaging application does have more than one open window at this time (e.g., because window 4136 is also already open, as shown in FIG. 2 ). Figure 4B15 ), the device displays a window switcher user interface 4018 that simultaneously displays representations of multiple open windows associated with the messaging application. This is different from when an application icon for a messaging application is activated by an input that meets the selection criteria but the messaging application is not the currently displayed application (e.g., Figures 4B5 to 4B6 ), and the application switching operation is immediately performed in response to the input. This is also in contrast to the case where the application corresponding to the activated application icon is the currently displayed application but has only a single open window, and neither application switching nor display of the window switcher occurs (e.g., as shown in Figures 4B7 to 4B8 shown).
[0250] like Figure 4B19As shown, after the input made through contact 4144 ends, window switcher user interface 4108 is displayed, replacing full-screen window 4122 of the Messages application and side-by-side window 4142 of the Photos application. In this case, window switcher user interface 4108 is displayed with representations of all saved windows associated with the Messages application, overlaid on a background (e.g., a blurred or dimmed image of full-screen window 4122). These representations include representations of all full-screen windows (e.g., representation 4122' of full-screen window 4122), representations of all side-by-side windows (e.g., representation 4136' of side-by-side window 4136), and representations of all windows displayed in split-screen mode (e.g., none at this time). Each representation in window switcher user interface 4108, when activated by input that meets selection criteria (e.g., a tap input), causes the device to stop displaying the window switcher user interface and display the window corresponding to the selected representation, completing the task of returning to a previously displayed window (or, optionally, a simultaneously displayed window) or switching to a different window of the same application (e.g., window 4136'). In window switcher user interface 4108, the same new window enable representation 4112 and close enable representation 4114 are displayed. New window enable representation 4112, when activated, causes the device to open a new window of the message application. Close enable representation 4114, when activated, causes the device to stop displaying window switcher user interface 4108 and redisplay full screen window 4122 and side pull window 4142. In some embodiments, each application has its own copy of the window switcher user interface, with customizations (e.g., user interface objects, functionality, and appearance) configured within the application. In some embodiments, the window switcher user interface is a system user interface displayed in different states that correspond to the respective applications that called the window switcher user interface.
[0251] Figure 4B20 to Figure 4B21 Interaction with new window affordance 4112 in window switcher user interface 4108 is shown. Figure 4B20 , an input is detected by contact 4146 at a location corresponding to new window affordance 4112. In response to the input, and based on determining that the input meets the selection criteria (e.g., the input is a tap input), the device displays a new window for the messaging application. In an embodiment, the new window is a default window for the messaging application (e.g., window 4148 displaying a new message template for composing a new message with a new recipient and a list of existing conversations).
[0252] Figures 4B22 to 4B23 Navigation to another user interface within full screen window 4148 is shown without opening a new window. Figure 4B22, input by contact 4152 is detected at a location corresponding to representation 4150 of the conversation with Mary Ford. In response to the input, and based on a determination that the input meets the first criteria (e.g., the input is a tap input), the user interface in window 4148 is transformed, and the new message template in the window is replaced with the conversation with Mary Ford, as shown in FIG. Figure 4B23 To improve clarity, window 4148 has been relabeled as window 4154 to indicate that the contents of the window have changed, but no new window has been opened in the messaging application. Alternatively, a navigation operation within the messaging application causes window 4148 to close and window 4154 to open in the messaging application.
[0253] Figures 4B24 to 4B27 A process for opening a window in a Photos application in split-screen mode and simultaneously converting a full-screen window in a Messages application to a split-screen window is shown according to some embodiments. In this process, the window in the Photos application is a newly opened window, while the window in the Messages application is not a newly opened window but an existing window that has been resized.
[0254] like Figure 4B24 As shown, while displaying a full screen window 4154 of a messaging application, an input by contact 4156 is detected at a location corresponding to an application icon 228 of a photo application. In response to detecting the input and based on determining that the initial portion of the input satisfies a second criterion (e.g., a criterion for initiating a drag operation on an object at the location of the input), the device highlights application icon 228 to indicate that the criterion for initiating a drag operation has been met. Figure 4B25 , a representation 4158 of the photos application is dragged based on movement of contact 4156 detected after the initial portion of the input has satisfied the second criteria. Figure 4B26 , the representation 4158 of the Photos application is dragged to a predefined area 4162 near the left edge of the display (e.g., Figure 4E8In some embodiments, the predefined area 4162 for opening a window in split screen mode is closer to the left edge of the display than the predefined area 4014 (for opening a window in side-pull mode) near the right edge of the display. In response to determining that the contact 4156 is within the predefined area 4162 for opening an application window in split screen mode, the device provides visual feedback to indicate that if the input ends at this time, the window of the dragged application will be opened in split screen mode. In some embodiments, the visual feedback includes, for example, resizing the full screen window 4154 in a horizontal direction to reveal a background on one side of the display in which the new window will be displayed. In some embodiments, when the full screen window 4154 is resized, the contents of the full screen window are visually obscured (e.g., blurred or dimmed), wherein the application icon of the corresponding application is displayed on the visually obscured window. In some embodiments, the visual feedback includes, for example, stretching the representation 4158 of the application and reducing the lateral width of the representation 4158 so that the representation 4158 does not overlap with the reduced width representation 4154' of the window 4154 of the messaging application. Figure 4B27 , after detecting the end of the input made by contact 4156, a new window 4166 is opened in the photo application on the left side of the display in split-screen mode. In addition, the full-screen window 4154 of the message application is resized and displayed simultaneously with the new window 4166 of the photo application in split-screen mode. For clarity, window 4154 is relabeled as 4164 to indicate that it has been resized and converted from a full-screen window to a split-screen window, but no new window is opened in the message application. In some embodiments, the above-mentioned window resizing operation in the message application is completed by closing the full-screen window 4154 and opening the split-screen window 4164 in the message application. Window 4166 and window 4164 are associated (e.g., fixed) as a pair of split-screen windows and are represented together by a single representation in the application switcher user interface (e.g., application switcher user interface 4032). In addition, in some embodiments, each window in the pair of split-screen windows is also counted as an open window of its corresponding application in the window switcher user interface corresponding to the corresponding application. In some embodiments, the pair of split-screen windows are represented by a single representation in the window switcher user interface. In some embodiments, when the single representation of the pair of split-screen windows is selected (e.g., by a tap input), the pair of split-screen windows are recalled to the display together from the application switcher user interface and / or the window switcher user interface.
[0255] Figures 4B28 to 4B31 Window switching operations using a window switcher user interface according to some embodiments are shown. Figure 4B28As shown, window 4166 of the Photos application and window 4164 of the Messages application are displayed side by side in split-screen mode. Input is detected via contact 4168 on application icon 224 corresponding to the Messages application. Based on determining that the input satisfies selection criteria (e.g., the input is a tap input), based on determining that one of the currently displayed windows (e.g., window 4166 and window 4164) and the activated application icon correspond to the same application (e.g., both window 4164 and application icon 224 correspond to the Messages application), and based on determining that the application of the activated application icon (e.g., the Messages application) is associated with multiple windows, the device displays window switcher user interface 4108 in a state corresponding to the Messages application (e.g., displaying representations of multiple windows associated with the Messages application at this time), as shown. Figure 4B29 As shown. Figure 4B29 , representation 4122′ is displayed for full screen window 4122, representation 4136′ is displayed for side pull window 4136, and representation 4168′ is displayed for split screen window 4164 (e.g., the same representation is also used for split screen window 4166 in the window switcher user interface of the Photos application). Figure 4B30 , an input by contact 4170 is detected on representation 4122′ in window switcher user interface 4108 of the messaging application. In response to the input and based on determining that the input meets the selection criteria (e.g., the input is a tap input), the device stops displaying window switcher user interface 4108 of the messaging application and redisplays full screen window 4122 of the messaging application on the screen in an independent display configuration, as shown. Figure 4B31 At this point, the window switcher user interface 4108 is used to complete the switch from Figure 4B28 Window switching operation from split-screen window 4164 to full-screen window 4122 is shown in FIG.
[0256] Figures 4B32 to 4B33 Shown is a diagram similar to Figures 4B5 to 4B6 The illustrated case is a case where an application switching operation is performed from a first application to a second application in response to selection of an application icon of the second application, regardless of the number of windows associated with the second application.
[0257] Figure 4B324 shows that while displaying full screen window 4122 for a messaging application, input via contact 4172 is detected on application icon 218 for an email application. Based on determining that the input via contact 4172 satisfies the selection criteria (e.g., the input is a tap input), the device determines whether application icon 218 and currently displayed window 4122 correspond to the same application. Based on determining that application icon 218 and currently displayed window 4122 do not correspond to the same application, the device stops displaying full screen window 4122 and displays full screen window 4102 corresponding to the email application (e.g., a default window for the email application (e.g., the last displayed full screen window for the email application)), as shown. Figure 4B33 As shown. Figures 4B32 to 4B33 In the example scenario shown, the user's request to switch applications is satisfied regardless of whether the email application is associated with multiple windows at the time or whether the messaging application is associated with multiple windows at the time because the user activates an application icon other than the currently displayed application.
[0258] Figures 4B34 to 4B35 exist Figure 4B33 After that, and shows something like Figures 4B1 to 4B5 An example scenario is shown in which an application switcher user interface is displayed in response to activating an application icon of a currently displayed application via a tap input. Figure 4B34 , while window 4102 of an email application is displayed on the screen, input by contact 4174 is detected on application icon 218 of the email application. Based on determining that the input satisfies selection criteria (e.g., the input is a tap input), and based on determining that the activated application icon and the currently displayed window correspond to the same application, and based on determining that the application has more than one window, the device displays a window switcher user interface 4108 for the application (e.g., the email application), as shown in FIG. Figure 4B35 As shown. Figure 4B35 , all windows associated with the email application are now displayed in window switcher user interface 4108. Each representation of a window is displayed with an application icon and a unique name of the window that is automatically generated based on the content of the window to distinguish between windows with similar or identical content.
[0259] According to some embodiments, Figures 4B32 to 4B35It is shown that a double-click (e.g., two consecutive inputs both satisfy the selection criteria and, optionally, are separated by less than a threshold amount of time) causes the device to perform an operation of switching from displaying a first application to displaying a second application and displaying a window switcher user interface for the second application. In some embodiments, the intermediate state of displaying the second application is not displayed, and the device changes directly from displaying the first application to displaying the window switcher user interface of the second application in response to the double-click input, and then, in response to an input selecting a window from the window switcher user interface or an existing window switcher user interface, changes from displaying the window switcher user interface of the second application to displaying a window of the second application (e.g., by selecting a close enable representation or a new window enable representation, tapping outside of the representation of the window, etc.).
[0260] Figures 4B36 to 4B37 An example process is shown in which input by contact 4176 is detected on an application icon 228 in a taskbar 4006 that is overlaid on a window switcher user interface 4108. In some embodiments, when the window switcher user interface 4108 is displayed, the taskbar 4006 is initially hidden and is recalled to the screen by an input that meets the taskbar display criteria (e.g., the input is an upward swipe gesture starting from the bottom edge of the touch screen). In response to detecting the input and based on determining that the input meets the selection criteria (e.g., the input is a tap input), the device stops displaying the window switcher user interface 4108 and displays a window 4178 of the application (e.g., a photos application) corresponding to the activated application icon 228, as shown in FIG. Figure 4B37 shown.
[0261] Figures 4B38 to 4B42 An example process is shown of switching from a first window (e.g., a full screen window (e.g., window 4178)) to a second window (e.g., a side-pull window (e.g., window 4142)) of an application (e.g., a photo application) using the application's window switcher user interface 4108 in accordance with some embodiments.
[0262] like Figure 4B38 As shown, while full screen window 4178 of the photos application is displayed, input via contact 4180 is detected on application icon 228 of the photos application. In response to the input via contact 4180, the device displays a window switcher user interface 4108 in a state corresponding to the photos application, including representations of multiple windows that are now associated with the photos application (e.g., representation 4168' of full screen window 4168, representation 4142' of side pull window 4142, and representation 4178' of full screen window 4178). Figure 4B40, an input by contact 4182 is detected on representation 4142′ of side pull window 4142. In response to detecting the input and based on determining that the input meets the selection criteria (e.g., the input is a tap input), the device stops displaying window switcher user interface 4108 and displays side pull window 4142, as shown. Figure 4B41 or Figure 4B42 As shown. Figure 4B41 In some embodiments, the side pull window 4142 is displayed simultaneously with the same background window (e.g., a full screen window or a pair of split screen windows) that was last displayed with the side pull window 4142 (e.g., the full screen window or a pair of split screen windows that was last displayed with the side pull window 4142). Figure 4B18 4142 in the side-pull window). Figure 4B42 In some embodiments, before the window switcher user interface 4108 is displayed (e.g., window 4178 is the last full-screen window displayed immediately before the window switcher user interface 4108 is displayed), the pull-out window 4142 is displayed simultaneously with the last full-screen window displayed (e.g., a full-screen window or a pair of split-screen windows).
[0263] Figure 4B43 to Figure 4B43 Another example process for invoking the window switcher user interface 4108 for an application according to some embodiments is shown. Figure 4B43 to Figure 4B43 The example shown in shows the photos application's window switcher UI 4108 being invoked by input detected while the photos application is displayed, but the example process is used to invoke the application's window switcher UI 4108 regardless of whether that application is the currently displayed application (e.g., another application or a system UI could be displayed when the input is initially detected).
[0264] like Figure 4B43 As shown, while an application (e.g., a photo application or another application different from the photo application) and taskbar 6004 are displayed, an input by contact 4183 is detected on an application icon (e.g., application icon 228 of the photo application) in the taskbar. In response to detecting the input and based on determining that the input meets the menu display criteria (e.g., the input is a tap-and-hold input or a light press input), application icon 228 is highlighted to indicate that the input has met the menu criteria. Figure 4B44 In the embodiment, in response to detecting the end of the input (e.g., in response to detecting the lift-off of contact 4183), a menu 4182 of selectable options 4184 for window management of an application corresponding to the selected application icon (e.g., a photo application) is displayed. Figure 4B44As shown, the selectable options include a first option for displaying all windows associated with the photo application in the window switcher user interface, a second option for opening a new window (e.g., a new default window) in the photo application, and a third option for closing all windows associated with the photo application. Figure 4B45 , an input by contact 4186 is detected on a first selectable option for displaying all windows. In response to detecting the input and based on determining that the input meets the selection criteria (e.g., the input is a tap input), the device displays a window switcher user interface 4108 that includes representations of all windows associated with the photos application, as shown in FIG. Figure 4B46 shown.
[0265] exist Figure 4B4 、 Figure 4B19 、 Figure 4B29 、 Figure 4B35 and Figure 4B40 In the window switcher user interface 4108 shown in , a new window enable representation 4112 is displayed, and the new window enable representation, when activated (e.g., by tapping input), initiates a process of opening a new window of the application, which new window corresponds to the currently displayed window switcher user interface. In some embodiments, the newly opened window is the default new window of the application. In some embodiments, a second version of the window switcher user interface 4108 is displayed with two different new window enable representations, one new window enable representation for opening a new document in a new window, and the other new window enable representation for opening an existing document in a new window. In some embodiments, the device selects which version of the window switcher user interface 4108 based on whether the corresponding application of the window switcher user interface is a document editor application (e.g., a word processing application, a spreadsheet application, a presentation editor application, a drawing application, a pdf document generation application, a publishing application, etc.) or a document creation application (e.g., a browser application, an email application, an instant messaging application, a photo application, etc.). Figures 4B47 to 4B50 Two different versions of the new window capability representation in a second version of the window switcher user interface 4108 according to some embodiments are shown.
[0266] like Figure 4B47 As shown, a full screen window 4188 of the memo application is displayed. The memo application is a document editor application because users can frequently create and edit documents and reopen previously created and edited documents to further edit the document. Figure 4B47As shown, while the window 4188 of the memo application is displayed, an input by contact 4190 is detected on the application icon 244 of the memo application in the taskbar 6004. In response to detecting the input and based on determining that the input meets the selection criteria, the device displays a window switcher user interface 4108 corresponding to the memo application, as shown in FIG. Figure 4B48 As shown. Figure 4B48 , the version of window switcher user interface 4108 displayed for the memo application includes representations of windows associated with the memo application (e.g., representation 4188' for full screen window 4188 and representation 4192' for the side-pull window of the memo application). In addition to representations of the memo application's open windows, the window switcher user interface also includes an "open" affordance 4194 for opening an existing document in a new window of the memo application, and a "new" affordance 4196 for opening a new document in a new window of the memo application. Figure 4B48 Input through contact 4198 and input through contact 4200 are indicated on window switcher user interface 4108 as shown.
[0267] exist Figure 4B49 , in response to detecting input through contact 4200 on “new” affordance 4196 and based on determining that the input meets the first criterion (e.g., the input is a tap input), the device stops displaying the window switcher user interface and displays a new window 4202, which displays a new memo document (e.g., a new document created based on the default memo template in the memo application, which is opened in an editable state with a keyboard covering the document). In some embodiments, instead of directly opening a new document based on the default new document template, the device displays a document creation user interface that includes selectable options corresponding to different new document formats and / or different new document templates. Once the user selects a corresponding one of the new document format and / or new document template, the device creates and opens the new document in a new window of the application according to the selected document format and / or document template.
[0268] exist Figure 4B50 , in response to detecting input via contact 4198 on “open” affordance 4194 and based on determining that the input satisfies a first criterion (e.g., the input is a tap input), the device stops displaying window switcher user interface 4108 and displays a new window 4204 with a document picker user interface for the notes application. In some embodiments, the document picker user interface includes selectable options corresponding to different existing folders and documents that can be opened in an application (e.g., a notes application). For example, Figure 4B50As shown, a list of existing memos is shown in a document picker user interface of a memo application. Once the user selects a corresponding one of the existing memos, the device opens the selected document (e.g., a previously created selected memo) in a new window of the application (e.g., the memo application). In some embodiments, the application is a document management application and is configured to open documents corresponding to different applications. In this case, the document picker of the document management application optionally displays representations of documents corresponding to different applications in its document picker user interface, and calls the different application corresponding to the selected document to open the selected document in response to the user's selection input.
[0269] Figure 4B51 A home screen user interface 4205 is displayed that includes a plurality of application icons corresponding to different applications installed on the device. In response to an input that meets the menu display criteria (e.g., a tap-and-hold input or a light press input followed by a lift-off; an ultra-long touch-and-hold input without lifting off the contact; or a deep press input without lifting off the contact), a quick action menu 4206 is displayed. In the quick action menu 4206, selectable options corresponding to actions within the application (e.g., display recent photos, display favorite folders, search for photos, etc.) are displayed in conjunction with menu 4182 ( Figure 4B44 ) are displayed simultaneously, including a first option for displaying all windows associated with the photos application in the window switcher user interface, a second option for opening a new window (e.g., a new default window) in the photos application, and a third option for closing all windows associated with the photos application.
[0270] Figures 4C1 to 4C48A process for dragging and dropping objects (e.g., user interface objects representing content items or application icons) at different locations (e.g., side areas) on a display is shown in accordance with some embodiments. In some embodiments, placing objects corresponding to content items in different areas on the display optionally causes the device to perform different operations based on various position-based criteria (e.g., based on the ending location of the drag input, the location of the object at the end of the drag input, or a comparison of the predicted final location of the dragged object based on past movement of the input relative to different predefined areas on the display). In some embodiments, the operations performed in response to placing an object corresponding to a content item in a different area on a display include: (1) displaying the content item or a representation thereof at a different location in the same window (e.g., performing an object move or object copying in the same application window); (2) displaying the content item or a representation thereof at a location in a different window displayed simultaneously with the object's original window (e.g., performing an object move or object copying between two simultaneously displayed windows (e.g., windows of the same application or two different applications); (3) opening the content item and displaying the content item in a new window displayed in a first simultaneous display configuration together with the object's original window (e.g., displaying the content item in a new side-pull window of a local application corresponding to the content item, covering the object's original window); (4) opening the content item and displaying the content item in a new window displayed in a second simultaneous display configuration together with the object's original window (e.g., resizing the object's original window and displaying the content item in a new split-screen window of a local application corresponding to the content item, covering the object's original window). (e.g., displaying the content item in a new window that is displayed with the object's original window in a third simultaneous display configuration (e.g., displaying the content item in a draft window that covers a central portion of the object's original window and, optionally, visually obscures the object's original window); (6) opening the content item and displaying the content item in a new window that is displayed with the object's original window in a fourth simultaneous display configuration (e.g., displaying the content item in a minimized window that is simultaneously visible with the content item's original window); and / or (7) opening the content item and displaying the content item in a new full-screen window based on the position or projected position of the dragged object at the drag input or at the end of the drag input (e.g., opening the content item in a new full-screen window that replaces the object's original window on the display (and replaces other windows that are simultaneously displayed on the display). In some embodiments, a predefined area (e.g., Figure 4B12 and Figure 4C28) relative to a predefined area (e.g., Figure 4B16 Area 4014 and Figure 4B26 For example, in some embodiments, the predefined area for placing an application icon to create a side-pull window for the application is wider than the predefined area for placing an object representing a content item to create a side-pull window for displaying the content item. Similarly, in some embodiments, the predefined area for placing an application icon to create a split-screen window for the application is wider than the predefined area for placing an object representing a content item to create a split-screen window for displaying the content item. The user interfaces in these figures are used to illustrate the processes described below, including Figures 7A to 7H as well as Figure 7I For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0271] Figures 4C1 to 4C5 The process of opening a content item in a side-pull window by dragging and dropping is shown according to some embodiments. Figures 4C1 to 4C5 , dragging an object representing a content item from a first window shown on the display and dropping it to a first predefined area near a side edge of the display (e.g., Figure 4C3 ), and thus, the content item is opened in a new side-pull window of the application corresponding to the content item. Figure 4A5 、 Figure 4B16 The first predefined area for placing content items is reduced in size (e.g., has a reduced width and / or a reduced distance from a respective side edge of the display) compared to the predefined area 4014 in the first window, etc. This allows more area to be used for performing operations with respect to content items in the first window and, optionally, in a second window displayed simultaneously with the first window.
[0272] like Figure 4C1As shown, a full-screen window 4122 of a messaging application is displayed (e.g., in a standalone configuration). Input by contact 4302 is detected at a location corresponding to object 4304 representing a first content item (e.g., a conversation with Greg Kane). An initial portion of the input by contact 4302 has satisfied object movement criteria for initiating a drag operation on object 4304 representing the first content item or a copy of object 4304 (e.g., an initial portion of the input by contact 4302 has satisfied a touch hold time threshold or an intensity threshold for a light press input), and the device highlights object 4304 to indicate that the criteria for initiating a drag operation on the object have been met.
[0273] exist Figure 4C2 43. In some embodiments, in accordance with movement of contact 4302 detected after the second criterion is met, a representation 4306 of the first content item (e.g., a copy of object 4304) is dragged on the display. In some embodiments, representation 4306 has a first appearance that indicates that no acceptable drop location is available for the object in the portion of window 4122 outside of first predefined area 4308, and that if the input ends at this point, no object move operation or object copy operation will be performed relative to the first content item in window 4122.
[0274] exist Figure 4C3 , the representation 4306 of the first content item is dragged to a position within the first predefined area 4308 based on the movement of the contact 4302 after the object movement criteria are met. In some embodiments, the representation 4306 takes on a second appearance (e.g., the representation is elongated and expanded laterally) that indicates that if the input ends at this time, the first content item will be displayed in a new side-pull window of the application (e.g., a messaging application) corresponding to the first content item. Figure 4C4 In some embodiments, in addition to changing the appearance of the representation 4306 of the first content item, when the representation is dragged to a position within the first predefined area 4308, the device also provides additional visual feedback to indicate that the input and / or the current position of the representation 4306 meets the position criteria for opening the first content item in the side pull window. In some embodiments, the additional visual feedback includes reducing the overall size of the first window 4122 to display the representation 4122' of the first window 4122, and revealing the background 4134 below the representation 4122'.
[0275] exist Figure 4C5 In response to detecting the end of input through contact 4302 (e.g., detecting lift-off of contact 4302), the first content item is displayed in a new side-pull window 4136 of the messaging application, covering the first window 4122.
[0276] Figure 4C4 After Figures 4C6 to 4C7 The input of contact 4302 is shown continuously evaluating position criteria corresponding to different predefined areas on the display for different operations performed after the input ends (e.g., object moved within the same window, object moved to a different window, content opened in a new side pull window, content opened in a new split screen window, etc.), and if the input were to end at the current location, the visual feedback is dynamically updated to indicate the corresponding possible results. Figures 4C6 to 4C7 , before the end of the input by contact 4302 is detected, the movement of contact 4302 drags the representation 4306 of the first content object from the first predefined area 4308 to a position outside of the first predefined area 4308 in the center portion of the display, and therefore, the visual feedback is dynamically updated to indicate that the position criteria for opening the first content item in the side pull window is no longer met, and if the input is not at this time (for example, in Figure 4C7 The object move or object copy operation will not be performed if the time indicated by the .
[0277] Figures 4C8 to 4C11 The process of opening a content item in a split-screen window by dragging and dropping according to some embodiments is shown. Figures 4C8 to 4C11 , dragging an object representing a content item from a first window shown on the display and dropping it to a second predefined area near a side edge of the display (e.g., Figure 4C10 ), and thus, the content item is opened in a new split-screen window of the application corresponding to the content item. Figure 4B26 The second predefined area 4310 for placing content items is reduced in size (e.g., has a reduced width and / or a reduced distance from the corresponding side edge of the display) compared to the predefined area 4162 in the first window, etc. The second predefined area and the first predefined area on the same side of the display are optionally adjacent to each other and share a common border between them. For example, the second predefined area is defined by the side edge of the display and a first boundary line that is a first distance from the side edge of the display, and the first predefined area is defined by the first boundary line and a second boundary line that is a second distance (greater than the first distance) from the side edge of the display. In some embodiments, a third predefined area outside the first predefined area (and the second predefined area) is used to determine whether to perform an operation with respect to the first content item within the first window, rather than opening a new window for the first content item.
[0278] like Figure 4C8As shown, a full screen window 4122 of a messaging application is displayed (e.g., in a standalone configuration). Input by contact 4312 is detected at a location corresponding to object 4304 representing a first content item (e.g., a conversation with Greg Kane). An initial portion of the input by contact 4312 has satisfied object movement criteria for initiating a drag operation on object 4304 representing the first content item or a copy of object 4304 (e.g., an initial portion of the input by contact 4312 has satisfied a touch hold time threshold or an intensity threshold for a light press input), and the device highlights object 4304 to indicate that the criteria for initiating a drag operation on the object have been met. In some embodiments, contact 4312 can be the same as contact 4302, and input by contact can trigger different actions depending on the location of the input at the end of the input (e.g., Figures 4C1 to 4C7 or Figures 4C8 to 4C15 In some embodiments, contact 4312 and contact 4302 are different contacts corresponding to two different inputs detected at different times on the same window displaying the same user interface state.
[0279] exist Figure 4C9 43. In some embodiments, in accordance with movement of contact 4312 detected after the second criterion is met, a representation 4306 of the first content item (e.g., a copy of object 4304) is dragged on the display. In some embodiments, representation 4306 has a first appearance that indicates that no acceptable drop location is available for the object in the portion of window 4122 outside of first predefined area 4308 (and second predefined area 4310), and that if the input ends at this point, no object move operation or object copy operation will be performed relative to the first content item in window 4122.
[0280] exist Figure 4C10 , the representation 4306 of the first content item is dragged to a position within the second predefined area 4310 based on the movement of the contact 4312 after the second criterion is met. In some embodiments, the representation 4306 presents a third appearance (e.g., the representation is further stretched and laterally contracted), which indicates that if the input ends at this time, the first content item will be displayed in a new split-screen window of the application corresponding to the first content item (e.g., the messaging application), where the split-screen window of the messaging application is converted from the full-screen window 4122. Figure 4C10In some embodiments, in addition to changing the appearance of the representation 4306 of the first content item, when the representation is dragged to a position within the second predefined area 4310, the device also provides additional visual feedback to indicate that the input and / or the current position of the representation 4306 meets the position criteria for opening the first content item in the split-screen window. In some embodiments, the additional visual feedback includes reducing the width of the first window 4122 to display the representation 4122' of the first window 4122, and revealing the background 4134 below the representation 4122' on the side of the display on which the representation 4306 is currently located.
[0281] exist Figure 4C11 In response to detecting the end of input through contact 4312 (e.g., detecting lift-off of contact 4312), the first content item is displayed side by side in a new split screen window 4316 of the messaging application along with another split screen window 4314 converted from the first window 4122.
[0282] exist Figure 4C12 , when the pair of split-screen windows 4314 and 4316 are displayed, input via contact 4320 is detected on close enable indication 4318 of split-screen window 4316. In response to detecting the input via contact 4320 and based on determining that the input meets the selection criteria (e.g., the input is a tap input), split-screen window 4316 is closed, and split-screen window 4314 is converted back to independent full-screen window 4122, as shown. Figure 4C13 shown.
[0283] Figure 4C10 After Figures 4C14 to 4C15 The input of contact 4312 is shown continuously evaluating position criteria corresponding to different predefined areas on the display for different operations performed after the input ends (e.g., object moved within the same window, object moved to a different window, content opened in a new side pull window, content opened in a new split screen window, etc.), and if the input were to end at the current location, the visual feedback is dynamically updated to indicate the corresponding possible results. Figures 4C14 to 4C15 , before the end of the input by contact 4312 is detected, the movement of contact 4312 drags the representation 4306 of the first content object from the second predefined area 4310 to a position outside the first predefined area 4308 in the center portion of the display, and therefore, the visual feedback is dynamically updated to indicate that the position criteria for opening the first content item in the split-screen window is no longer met, and if the input is not at this time (e.g., at Figure 4C15 As long as the end of input is not detected, Figure 4C2 、 Figure 4C3 、 Figure 4C4 、 Figure 4C6 、 Figure 4C7 、 Figure 4C9 、 Figure 4C10 、 Figure 4C14 as well as Figure 4C15 The dynamic visual feedback shown in the figure can be displayed in any order and repeated any number of times based on the current location of the contact. Figure 4C5 、 Figure 4C11 and Figure 4C13 The final state of the screen shown, which depends on whether the final end location of the input is in the first predefined area 4308, the second predefined area 4310, or a third predefined area outside the first and second predefined areas (as well as any other predefined areas for opening new windows in various display modes (e.g., full screen, draft mode, minimized mode, side-pull windows on different sides of the display, split screen on different sides of the display, etc.)).
[0284] Figures 4C16 to 4C17 An input is shown via contact 4322 at a location corresponding to object 4304 representing a first content item in window 4122 (e.g., a conversation from Greg Kane). In response to detecting the input via contact 4322 and based on determining that the input meets selection criteria (e.g., the input is a tap input), the device navigates to another user interface in the messaging application without opening a new window. For clarity of description, the window showing the new user interface is labeled window 4324, as shown in FIG. Figure 4C17 In some embodiments, the operation corresponding to the user interface navigation within the application is implemented by closing the current window showing the current user interface and opening a new window with the new user interface. In some embodiments, contact 4322 can be the same as contact 4302 and / or 4312, and the input made by the contact can trigger different operations (e.g., the input is located at the end of the input and the type of input (e.g., drag input or tap input) depending on the location of the input and the type of input (e.g., drag input or tap input). Figures 4C1 to 4C7 and / or Figures 4C8 to 4C15 In some embodiments, contact 4322, contact 4312, and contact 4302 are different contacts corresponding to different inputs detected at different times on the same window displaying the same user interface state.
[0285] Figures 4C18 to 4C23 shows content items associated with different applications (e.g., an email application) similar to Figures 4C1 to 4C17 The example procedures shown in . Figures 4C1 to 4C17 Many aspects of the examples shown apply to Figures 4C18 to 4C23 Example shown.
[0286] Figures 4C18 to 4C21The process of opening another content item in a split screen window by dragging and dropping according to some embodiments is shown. Figures 4C18 to 4C21 , dragging an object representing a content item from a first window shown on the display and dropping it to a second predefined area (e.g., near a side edge (e.g., right edge) of the display) Figure 4C20 The content item is opened in a predefined area 4310 as shown, and thus, the content item is opened in a new split-screen window of the application corresponding to the content item.
[0287] like Figure 4C18 As shown, a full-screen window 4102 of an email application is displayed (e.g., in a standalone configuration). Input by contact 4328 is detected at a location corresponding to object 4326 representing a second content item (e.g., an email message from MobileFind). An initial portion of the input by contact 4328 has satisfied object movement criteria for initiating a drag operation on object 4326 representing the second content item or a copy of object 4326 (e.g., an initial portion of the input by contact 4328 has satisfied a touch hold time threshold or an intensity threshold for a light press input), and the device highlights object 4326 to indicate that the criteria for initiating a drag operation on the object have been met.
[0288] exist Figure 4C19 43. In some embodiments, in accordance with movement of contact 4328 detected after the second criterion is met, a representation 4330 of the second content item (e.g., a copy of object 4326) is dragged on the display. In some embodiments, representation 4330 has a first appearance that indicates that no acceptable drop location is available for the object in the portion of window 4102 outside of first predefined area 4308 (and second predefined area 4310), and that if the input ends at this point, the object move operation or the object copy operation will not be performed relative to the first content item in window 4102.
[0289] exist Figure 4C20 , the representation 4330 of the second content item is dragged to a position within the second predefined area 4310 based on the movement of contact 4328 after the second criterion is met. In some embodiments, the representation 4330 presents a second appearance (e.g., the representation is stretched), which indicates that if the input ends at this time, the second content item will be displayed in a new split-screen window of the application (e.g., an email application) corresponding to the second content item, where the split-screen window of the email application is converted from the full-screen window 4102. Figure 4C20In some embodiments, in addition to changing the appearance of the representation 4330 of the second content item, when the representation is dragged to a position within the second predefined area 4310, the device also provides additional visual feedback to indicate that the input and / or the current position of the representation 4330 meets the position criteria for opening the second content item in the split-screen window. In some embodiments, the additional visual feedback includes reducing the width of the full-screen window 4102 to display the representation 4102' of the window 4102, and revealing a background 4134 below the representation 4102' on the side of the display on which the representation 4330 is currently located.
[0290] exist Figure 4C21 In response to detecting the end of input through contact 4330 (e.g., detecting lift-off of contact 4330), the second content item is displayed side by side in a new split screen window 4334 of the email application along with another split screen window 4332 converted from window 4102.
[0291] Figure 4C22 and Figure 4C23 from Figure 4C18 、 Figure 4C19 and Figure 4C20 Continuing with any of the examples, and illustrating an example situation, in which the second content item is opened in a new side-pull window 4336 of the email application, covering the full screen window 4102. Figure 4C22 As shown, the representation 4330 of the second content item is dragged to a position within the first predefined area 4308 based on the movement of contact 4328 after the object movement criteria are met. In some embodiments, the representation 4330 presents a third appearance (e.g., the representation is less stretched and expanded laterally than the state shown in 4C20), which indicates that if the input ends at this time, the second content item will be displayed in a new side-pull window of the application (e.g., an email application) corresponding to the second content item. Figure 4C22 In some embodiments, in addition to changing the appearance of the representation 4330 of the second content item, when the representation is dragged to a position within the first predefined area 4308, the device also provides additional visual feedback to indicate that the input and / or the current position of the representation 4330 meets the position criteria for opening the second content item in the side pull window. In some embodiments, the additional visual feedback includes reducing the overall size of the window 4102 to display the representation 4102' of the window 4102 and revealing the background 4134 below the representation 4102'.
[0292] exist Figure 4C23 In response to detecting the end of input through contact 4328 (e.g., detecting lift-off of contact 4328), a second content item is displayed in a new side pull window 4336 of the email application, covering window 4102.
[0293] Figures 4C23 to 4C24 Detection of input via contact 4338 on affordance 4340 to create a new draft email in an email application is shown. In response to detecting the input via contact 4338 and based on determining that the input satisfies selection criteria (e.g., the input is a tap input), the device opens a new draft window containing the new draft email (e.g., a new reply email to the email shown in side pull window 4336 (e.g., because affordance 4340 is part of side pull window 4336)), as shown in FIG. Figure 4C24 In some embodiments, the new draft window 4342 can be opened through other user interaction processes. Figure 4C24 The configuration shown displays (eg, an existing draft email is opened in a slide-out window or a split-screen window and displayed in draft mode by dragging the window to a center portion of the display).
[0294] exist Figures 4C24 to 4C26 , input via contact 4344 is detected on drag handle 4344 of draft window 4342, and the input includes movement of contact 4344 toward a side edge (e.g., a right edge) of the display. In response to detecting the input and based on determining that the current position of contact 4346 is within the first predefined area 4308, a representation 4348 of the draft window 4342 is displayed with an appearance (e.g., an elongated application icon that also expands laterally) that indicates that if the input were to end at the current position, the draft window 4342 would be converted to a side-pull window that covers the original background window 4102. In some embodiments, the visual feedback also includes reducing the overall size of the background window 4102 to display the representation 4102', and revealing the background 4134 below the representation 4102'. In Figure 4C26 , in which contact 4344 and representation 4348 are in predefined area 4014 (or Figure 4E8 After detecting the end of input within the F area in the draft window 4342, the draft window 4342 is converted into a side pull window 4348 covering the background window 4102. The side pull window 4348 displays the draft email reply to John. According to some embodiments, with respect to Figures 4E1 to 4E28 Other related examples of dragging a currently displayed window and converting a window in one display configuration to a window in another display configuration are described in more detail.
[0295] Figures 4C27 to 4C40 Various examples are shown in which, after a drag operation is initiated on a content object, a final outcome of the input is determined based on the location of the contact or the location of the dragged object at the end of the input (eg, after the end of the input is detected).
[0296] exist Figure 4C27 43. In the example, the display is generally divided into several areas, including a first predefined area 4308, a second predefined area 4310, a third predefined area 4354, a fourth predefined area in an area outside the first, second, and third predefined areas of window 4102 and outside the search input field 4355, and a fifth predefined area corresponding to the search input field 4355 in window 4102. In this example, the area of window 4102 outside the search input field 4335 does not correspond to any operations that can be performed on the dragged content item in response to the end of the drag input. However, in some embodiments, if window 4102 does include a sub-area in which operations can be performed with respect to the dragged content item (e.g., moving the dragged item within the sub-area, copying the dragged item to a folder within the sub-area, sending the dragged item to another user (e.g., dropping the content item via a "Send" button), deleting the dragged item (e.g., dropping the content item on a virtual recycle bin in the window), printing the dragged item (e.g., dropping the content item on a printer icon shown in the window), etc.), the dragged item can be displayed in the form of a cursor.
[0297] exist Figure 4C27 , input by contact 4350 has been detected at a location corresponding to object 4352 representing a document (e.g., image "Attachment 1"). In response to detecting an initial portion of the input that satisfies criteria for moving the object (e.g., a tap-and-hold input or a light press input without lifting off the contact), the device displays visual feedback (e.g., highlighting object 4352) indicating that the criteria for initiating a drag operation on the document have been met by the initial portion of the input.
[0298] exist Figure 4C28 , a first movement of contact 4350 is detected after an initial portion of the input satisfies the object movement criteria, and a representation 4356 of the document is dragged on the display in accordance with the movement of contact 4350. When contact 4356 is over a portion of window 4102 outside of first predefined area 4308, second predefined area 4310, and third predefined area 4354, the appearance of representation 4356 indicates that no acceptable drop location is available at that location, and if the input were to end at the current location, no operation would be performed relative to the document. In some embodiments, if an acceptable drop location is available at the current location, the device provides visual feedback to indicate that an operation would be performed relative to the document if the input ended at the current location (e.g., changing the appearance of representation 4356 in a manner that indicates a particular operation to be performed if the end of the input is detected at that location).
[0299] exist Figure 4C29, a second movement of contact 4350 is detected after the initial portion of the input satisfies the second criteria, and a representation 4356 of the document is dragged on the display in accordance with the movement of contact 4350 to the search input field 4355. The appearance of representation 4356 changes (e.g., from an icon to a file name) to indicate that an acceptable drop location is available at that location, and if the input ends at the current location, a search will be performed based on the file name of the document.
[0300] exist Figure 4C30 4, a third movement of contact 4350 is detected after the initial portion of the input satisfies the second criterion, and a representation 4356 of the document is dragged on the display in accordance with the movement of contact 4350 to a third predefined area 4354 in Slide Over window 4348. The appearance of representation 4356 changes (e.g., decreases in size, with a preview of the document (e.g., image 4358) displayed in Slide Over window 4348) to indicate that an acceptable drop location is available at that location, and that if the input ends at the current location, the contents of the document will be inserted into the draft email.
[0301] exist Figure 4C31 , the end of the input is detected when the contact and representation 4356 are within the third predefined area 4354. Thus, the document (e.g., image 4358) is inserted at the insertion point in the draft email shown in the side pull window 4348.
[0302] exist Figure 4C32 , a fourth movement of contact 4350 is detected after the initial portion of the input satisfies the object movement criteria, and a representation 4356 of the document is dragged on the display in accordance with the movement of contact 4350 to first predefined area 4308 in Slide Over Window 4348. If the input were to end at the current location, the appearance of representation 4356 changes (e.g., with Figure 4C28 elongated and expanded horizontally compared to the appearance shown) to indicate that the document will be opened in a new side-pull window.
[0303] exist Figure 4C33 , the end of the input is detected when the contact and representation 4356 are within the first predefined area 4354. As a result, the document (e.g., image 4358) is opened in a new Slide Over window 4360 of the Photos application (e.g., a native application for image documents), overlaying the full screen window 4102 of the email application.
[0304] In some embodiments, a fifth movement of contact 4350 is detected after the initial portion of the input satisfies the second criterion, and a representation 4356 of the document is dragged on the display based on the movement of contact 4350 to the second predefined area 4310 in the side pull window 4348. If the input is to end at the current location, the appearance of representation 4356 changes (e.g., with Figure 4C32 43. The document (e.g., image 4358) is opened in a new split-screen window of the photo application (e.g., a native application for image documents) alongside the split-screen window converted from the full-screen window 4102 of the email application.
[0305] In some embodiments, the position of the contact and the dragged object is continuously evaluated, and the position of the contact / dragged object is determined based on the position of the contact / dragged object relative to the above different predefined areas (e.g., relative to the Figure 4C27 、 Figure 4C28 、 Figure 4C29 、 Figure 4C30 and Figure 4C32 ) to dynamically update the visual feedback. Before detecting the end of input, Figures 4C27 to 4C30 as well as Figure 4C32 The display states shown may be repeated any number of times in any order based on the current location of the input.
[0306] Figures 4C34 to 4C40 Operations performed with respect to a content object in response to the completion of a drag operation performed on the content object are shown according to some embodiments.
[0307] exist Figure 4C34 , side pull window 4348 is displayed overlaying full screen window 4102. Input via contact 4366 is detected at a location corresponding to object 4364 (e.g., a hyperlink) representing a web page. An initial portion of the input via contact 4366 has satisfied the object move criteria, and the device highlights object 4364 to indicate that the criteria for initiating a drop operation on object 4364 have been met.
[0308] exist Figure 4C35 In response to a first movement of contact 4366 detected after the object movement criteria have been met, representation 4368 is dragged on the display according to the movement of contact 4366. Figure 4C35As shown, when the contact and representation 4368 is over a portion of the display that does not present an acceptable placement location for an object representing a web page (e.g., in an area outside the first predefined area 4308, the second predefined area 4310, the third predefined area 4354, and the search input field 4355), the representation 4368 has a first appearance to indicate that if the input ends at this time, the object move or object copy operation will not be performed relative to the object in the email application.
[0309] exist Figure 4C36 , a second movement of contact 4366 is detected after the initial portion of the input satisfies the object criteria, and a representation 4368 of a web page is dragged on the display in accordance with the movement of contact 4366 to search input field 4355. The appearance of representation 4368 changes (e.g., from an icon to a web address (e.g., URL) or title of a web page) to indicate that an acceptable drop location is available at that location and that a search based on the URL or title of the web page will be performed if the input ends at the current location.
[0310] exist Figure 4C37 , a third movement of contact 4336 is detected after the initial portion of the input satisfies the object movement criteria, and a representation 4368 of a web page is dragged on the display based on the movement of contact 4336 to a third predefined area 4354 in the side pull window 4348. The appearance of representation 4368 changes (e.g., decreases in size, with a website address (e.g., URL) or a preview of the web page displayed in the side pull window 4348) to indicate that an acceptable drop location is available at that location, and if the input ends at the current location, the URL or content of the web page will be inserted into the draft email. In some embodiments, if the end of the input is detected while the contact and representation 4336 are within the third predefined area 4354, the URL or content of the web page is inserted at the insertion point in the draft email shown in the side pull window 4348.
[0311] exist Figure 4C38 , a fourth movement of contact 4336 is detected after the initial portion of the input satisfies the object movement criteria, and representation 4368 of the web page is dragged on the display in accordance with the movement of contact 4336 to first predefined area 4308 in side pull window 4348. If the input is to end at the current location, the appearance of representation 4368 changes (e.g., with Figure 4C35 elongated and expanded horizontally compared to the appearance shown) to indicate that the web page will be opened in a new pull-out window of the browser application.
[0312] exist Figure 4C39, the end of the input is detected when the contact and representation 4368 are within the first predefined area 4308. As a result, the document (e.g., a web page) is opened in a new Slide Over window 4372 of the browser application (e.g., a native application for the web page), overlaying the full screen window 4102 of the email application.
[0313] exist Figure 4C40 , a fifth movement of contact 4336 is detected after the initial portion of the input satisfies the object movement criteria, and a representation 4368 of the web page is dragged on the display based on the movement of contact 4336 to the second predefined area 4310 on the display. The appearance of representation 4368 changes (e.g., with Figure 4C38 4368 is further stretched and laterally contracted compared to the appearance shown) to indicate that if the input were to end at the current location, the web page would be opened in a new split-screen window. In some embodiments, the background full-screen window 4102 is resized (e.g., reduced in width) to create space to display the new split-screen window. Background 4134 is revealed behind representation 4102' of the resized window 4102. In some embodiments, side-pull window 4348 displayed on the same side of the display as representation 4368 is shifted to the other side of the display. Figure 4C41 , the end of the input is detected when contact 4336 and representation 4368 are within second predefined area 4310, and the web page is opened in a new split-screen window 4376 of a browser application (e.g., a native application for the web page) alongside split-screen window 4374 that was converted from full-screen window 4102 of the email application. In some embodiments, side-by-side window 4348 is shifted to the other side of the display, such as Figure 4C41 In some embodiments, the side pull window 4348 remains on the same side of the display as before (e.g., the right side), with the pair of split-screen windows 4374 and 4376 as the background.
[0314] In some embodiments, the position of the contact and drag object is continuously evaluated, and the position of the contact / drag object is determined based on the position of the contact / drag object relative to the different predefined areas (e.g., relative to the Figure 4C35 、 Figure 4C36 、 Figure 4C37 、 Figure 4C38 and Figure 4C40 ) to dynamically update the visual feedback. Before detecting the end of input, Figure 4C35 、 Figure 4C36 、 Figure 4C37 、 Figure 4C38 and Figure 4C40 The display states shown in may be repeated any number of times in any order based on the current position of the input.
[0315] In the above example, the content object is dragged to the area of the display including the side-pull window. In some embodiments, identical predefined areas 4308 and 4310 exist on the display and work in the same manner as described above, regardless of whether there is a side-pull window or a split-screen window in those predefined areas.
[0316] Figures 4C42 to 4C46 It is shown that according to some embodiments, the predefined area for opening a new side-pull window or a new split-screen window by dragging and dropping an application icon is expanded relative to the predefined area for opening a new side-pull window or a new split-screen window by dragging and dropping an object representing a content item (e.g., a document or other content).
[0317] like Figure 4C42 As shown, input is detected on application icon 220 of the browser application by contact 4378. The initial portion of the input has satisfied the object movement criteria, and the device highlights application icon 220 to indicate that a drag operation can be initiated on application icon 220 by movement of contact 4378.
[0318] exist Figure 4C43 , a first movement of contact 4378 is detected, and based on the movement of contact 4378 detected after the initial portion of the input satisfies the object movement criteria, a representation 4380 of application icon 220 (e.g., for a browser application) is dragged on the display. Figure 4C43 As shown, when the contact 4378 is anywhere within the extended first predefined area 4308' (e.g., Figures 4C35 to 4C31 4308 in the image), the device provides visual feedback (e.g., representation 4380 being stretched and expanded laterally, with the overall size of background window 4102 decreasing to reveal backstage 4134) to indicate that if the end of input were to be detected at the current location, a new side-pull window of the browser application would be opened. Figure 4C44 , the end of the input by the contact is detected while the contact is within the expanded first predefined area 4308' (e.g., optionally, in an area outside the original first predefined area 4308), and a new side-pull window 4382 of the browser application is displayed, overlaying the full-screen window 4102 of the email application. In some embodiments, if the browser application is associated with more than one window, the device optionally opens a window selector user interface 4508 for the browser application (e.g., as shown in FIG. Figure 4D5 ), rather than a side-swipe window for the browser application. Figures 4D1 to 4D19 Describes more details.
[0319] exist Figure 4C45, a second movement of contact 4378 is detected, and based on the movement of contact 4378 detected after the initial portion of the input satisfies the object movement criteria, a representation 4380 of application icon 220 (e.g., for a browser application) is dragged on the display. Figure 4C45 As shown, when contact 4378 is anywhere within the expanded second predefined area 4310', the device provides visual feedback (e.g., representation 4380 further stretches and contracts laterally, the width of background window 4102 decreases, thereby revealing background 4134) to indicate that if the end of input is detected at the current location, a new split-screen window of the browser application will be opened. Figure 4C46 , the end of the input by the contact is detected when the contact is within the expanded second predefined area 4310' (e.g., optionally, within an area outside the original second predefined area 4310 and within the original first predefined area 4308), and a new split-screen window 4384 of the browser application is displayed alongside the new split-screen window 4186 converted from the full-screen window 4102 of the email application. In some embodiments, if the browser application is associated with more than one window, the device optionally opens a window selector user interface 4508 for the browser application (e.g., as shown in FIG. Figure 4D19 ), rather than a split-screen window for the browser application. Figures 4D1 to 4D19 Describes more details.
[0320] As described above, the expanded second predefined area 4310' is defined by a side edge of the display and a border that is displaced away from the side edge by a distance greater than the distance between the border of the first predefined area 4310 and the same side edge of the display. The expanded first predefined area 4308' is defined by the border of the expanded second predefined area and a new border that is displaced away from the side edge by a distance greater than the distance by which the border of the second predefined area 4310' has been displaced. As a result of these border adjustments, the width of the expanded first predefined area 4308' is greater than the width of the first predefined area 4308, and the width of the expanded second predefined area 4310' is greater than the width of the second predefined area 4310. This allows application icons to be more easily placed in predefined areas on the display to open new windows of the desired type, as object moving and copying operations are rare or unavailable for application icons in background windows.
[0321] Figures 4C47 to 4C48 It is shown that according to some embodiments, in addition to opening a content item in a new window (e.g., a new side-pull window, a new split-screen window) by a drag-and-drop operation performed on an object, a quick action menu can also be used to achieve the same result. Figure 4C47As shown, input by contact 4386 is detected on object 4326 representing an email from MobileFind. The initial portion of the input has satisfied the menu display criteria (e.g., a time threshold for the tap hold input and / or an intensity threshold for the light press input has been met), and the device highlights object 4326 to indicate that the menu display criteria have been met. In some embodiments, if movement of the contact is not detected before the contact is lifted, the object movement criteria for initiating the drag operation is also used to determine whether the quick action menu will be presented when the contact is lifted. Figure 4C48 , the end of input is detected without movement of the contact (e.g., lift-off of contact 4386 is detected), and in response, a quick action menu 4388 is displayed adjacent to object 4326, where the menu includes at least a first selectable option for opening the content item represented by object 4326 in a full screen window of a local application for the content item (e.g., Open in Application), a second selectable option for opening the content item in a new side pull window (e.g., Open as a side pull window), and a third selectable option (e.g., Open as a split screen window).
[0322] In some embodiments, when the first selectable option is activated by an input that meets the selection criteria (e.g., a tap input), if the local application for the content item is not the currently displayed application, the device optionally switches to the local application for the content item and displays the content item in a new full-screen window of the local application. If the local application for the content item is the same as the application that is currently displaying the object representing the content item, the content item is opened in the currently displayed window that includes the object or in a new full-screen window of the currently displayed application, according to various embodiments. In some embodiments, the operation performed in response to activation of the first selectable option is the same as the operation performed when an input that meets the selection criteria (e.g., a tap input) is detected on the object representing the content item.
[0323] In some embodiments, when the second selectable option is activated by an input that meets the selection criteria (e.g., a tap input), the device displays the content item in a new side-pull window of the content item's native application (e.g., as shown in FIG. Figure 4C23 In some embodiments, the operation performed in response to activation of the second selectable option is the same as the operation performed when the input that meets the object movement criteria initiates a drag operation on the object and ends in the first predefined area 4308 on the display.
[0324] In some embodiments, when the third selectable option is activated by an input that meets the selection criteria (e.g., a tap input), the device displays the content item in a new split-screen window of the content item's native application (e.g., as shown in FIG. Figure 4C21 In some embodiments, the operation performed in response to activation of the third selectable option is the same as the operation performed when an input that meets the object movement criteria initiates a drag operation on the object and ends in the second predefined area 4310 on the display.
[0325] Figures 4D1 to 4D19 The user interface behavior when an application icon is dragged and dropped into a predefined area on a display to open an application in a corresponding simultaneous display configuration (e.g., side-by-side mode or split-screen mode) with a currently displayed full-screen window according to some embodiments is shown. Specifically, according to some embodiments, when the application corresponding to the dragged application icon has multiple windows associated with it, a window selector user interface area is displayed to allow the user to select a desired window of the application to open in simultaneous display mode. Other user interface interactions with the window selector user interface are also described. The user interfaces in these figures are used to illustrate the processes described below, including Figures 8A to 8E For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0326] Figures 4D1 to 5D 5 shows a heuristic according to which, if there are multiple windows associated with an application, then when the application icon of the application is dragged over a predefined area of the display for opening the application in a simultaneous display configuration (e.g., predefined areas 4308', 4310') is displayed to allow the user to select a window from the multiple windows to open in the simultaneous display configuration; and according to some embodiments, if there is a single window associated with the application, then the single window associated with the application is displayed in the simultaneous display configuration instead of the window selector area.
[0327] like Figure 4D1As shown, while full screen window 4122 is displayed, input by contact 4502 is detected on application icon 220 of a browser application in taskbar 4006. After an initial portion of the input satisfies the criteria for initiating a drag operation on an application icon (e.g., the input is a tap-and-hold input or a light press input), movement of contact 4502 is detected. In response to the movement of contact 4502, representation 4504 of application icon 220 is dragged on the display in accordance with the movement of contact 4502, as shown in FIG. Figure 4D2 As shown. Figure 4D3 , when contact 4502 drags representation 4504 to a location within the predefined area for opening a side-pull window (e.g., expanded first predefined area 4308'), the device presents visual feedback indicating that the location criteria for opening the side-pull window are met and that if the input ends at the current location, the application will be opened in the side-pull window.
[0328] exist Figure 4D3 After Figure 4D4 In the embodiment of the present invention, according to the first branch of the heuristic method, when the application (e.g., a browser application) being dragged application icon 220 is currently associated with zero windows (e.g., the application is not open) or only a single window (e.g., only one recently opened window is stored in memory), the device opens the application in a side pull window 4506 that covers a portion of background window 4122 (e.g., on the right side of the screen). In some embodiments, if the application is associated with zero windows, the side pull window 7506 displays the default start user interface of the application. In some embodiments, if the application is now associated with a single window, the side pull window 7506 displays the user interface or content last displayed in the single window. In some embodiments, the single window stored in memory does not have to be a side pull window. In some embodiments, the single window stored in memory is converted from a full-screen window or a split-screen window to a side pull window before being displayed in response to input made by contact 4502.
[0329] exist Figure 4D3 After Figure 4D5In some embodiments, according to a second branch of the heuristic, in a case where the application (e.g., a browser application) being dragged application icon 220 is currently associated with multiple windows (e.g., multiple recently opened windows are saved in memory), the device opens a window selector user interface area 4508 (e.g., in a side-by-side window or overlay) that covers a portion (e.g., on the right side of the screen) of background window 4122. In some embodiments, all windows associated with the application are available for viewing and selection in window selector user interface area 4508 (e.g., initially displayed, or displayed in response to scrolling or browsing input), regardless of the display configuration (e.g., full screen, split-screen windows, side-by-side windows, draft windows, minimized windows, etc.).
[0330] exist Figure 4D5 In the embodiment, window selector user interface area 4508 includes representations of windows associated with the application corresponding to the dragged application icon (e.g., representation 4510 of a first window of a browser application and representation 4512 of a second window of the browser application). The representations of the windows include an identification of the application and a unique name corresponding to each of these windows. In some embodiments, the name of the window is automatically generated by the device based on the displayed content of the window (e.g., the title, user name, subject line, etc. of the document, email, message, web page, image, etc.). The representation of each window includes a close enable representation (e.g., enable representation 4518 and enable representation 4520) for closing the window individually without closing other saved windows of the application. In some embodiments, window selector user interface area 4508 includes a close enable representation 4514 for closing window selector user interface area 4508 without closing the saved windows of the application. In some embodiments, window selector user interface area 4508 includes an enable representation for closing all windows associated with the application without closing window selector user interface area 4508. In some embodiments, window selector user interface area 4508 includes an affordance 4516 for opening a new window for an application. In some embodiments, the new window is displayed in side-by-side mode immediately after it is opened. In some embodiments, a representation of the new window is first displayed in window selector user interface area 4508, and in response to another user input selecting the representation of the new window, only the new window is displayed in side-by-side mode. Figures 4D6 to 4D17 Some features of the window selector user interface area 4508 are described according to some embodiments.
[0331] exist Figures 4D6 to 4D8, input by contact 4522 is detected on representation 4512 of window 2 of a browser application in window selector user interface area 4508. The input includes movement of contact 4522 toward the right edge of the display. In response to detecting movement of contact 4522, representation 4512 is dragged off the display, and the window corresponding to representation 4512 is closed, as shown. Figures 4D7 to 4D8 As shown. Figure 4D8 , only the representation 4510 of window 1 of the browser application remains in the window selector user interface area 4508.
[0332] Figures 4D8 to 4D9 It is shown that in some embodiments, if all windows shown in window selector user interface area 4508 except one window (e.g., window 1) have been closed, the device stops displaying window selector user interface area 4508 and displays a single persistent window of the application in a side-by-side mode (e.g., as side-by-side window 4506), as shown. Figure 4D9 As shown, without the need for additional user input to select the representation of a single retained window. In some embodiments, the window selector user interface area remains displayed, and user input (e.g., tap input) selecting the representation of the last retained window opens the last retained window in side-pull mode.
[0333] Figures 4D10 to 4D11 Input is shown being detected via contact 4524 on a representation of one of the windows associated with an application (e.g., representation 4510), and in response to detecting the input and based on determining that the input satisfies a first criterion (e.g., the input is a tap input), the device ceases displaying window selector user interface area 4508 and displays the selected window (e.g., window 1) in a side-by-side mode (e.g., as side-by-side window 4506).
[0334] Figures 4D12 to 4D13 According to some embodiments, Figures 4D6 to 4D8 The window shown is an alternative way to close the window. Figure 4D12 As shown, input by contact 4526 is detected at a location corresponding to close affordance 4520 of window 2 represented in window selector user interface area 4508. In response to the input and based on a determination that the input meets the first criteria (e.g., the input is a tap input), the device stops displaying representation 4512 of window 2 and closes window 2 of the browser application, as shown. Figure 4D13 shown.
[0335] exist Figures 4D13 to 4D14In some embodiments, if all windows except one window (e.g., window 1) shown in window selector user interface area 4508 have been closed, the device stops displaying window selector user interface area 4508 and displays a single persistent window of the application in a side-by-side mode (e.g., as side-by-side window 4506), as shown in FIG. Figure 4D14 As shown, without the need for additional user input to select the representation of a single retained window. In some embodiments, the window selector user interface area remains displayed, and user input (e.g., tap input) selecting the representation of the last retained window opens the last retained window in side-pull mode.
[0336] exist Figures 4D15 to 4D17 In some embodiments, a series of inputs uses close affordances on window representations in window selector user interface area 4508 to individually close all windows represented in window selector user interface 4508. Figure 4D15 As shown, a tap input via contact 4528 is detected on close-enabled representation 4520 of Window 2. In response to the input via contact 4528, representation 4512 of Window 2 is removed from window selector user interface area 4508, and the corresponding window is closed (e.g., removed from memory). Figure 4D16 , another tap input via contact 4530 is detected on close-enabled representation 4518 of window 1. In response to detecting the input via contact 4530, representation 4524 is removed from window selector user interface area 4508, and the corresponding window is closed (e.g., removed from memory), as shown. Figure 4D17 shown.
[0337] In some embodiments, by interacting with the window selector user interface area (e.g., as described above in Figures 4D6 to 4D8 and Figures 4D15 to 4D17 After all windows associated with the application are closed (as described in the Figure 4D17In some embodiments, the user can use affordance 4516 to open additional new windows and have them represented in window selector user interface area 4508. In some embodiments, after all windows in window selector user interface area 4508 have been closed, user input (e.g., a tap input on close affordance 4514, or a horizontal swipe input originating from outside window selector user interface area 4508 that continues on window selector user interface area 4508) is required to remove the area from the display. In some embodiments, after all windows represented in window selector user interface 4508 have been closed, the device stops displaying window selector user interface area 4508, without requiring input to close window selector user interface area 4508.
[0338] Figures 4D18 to 4D19 43. In some embodiments, a similar window selector user interface area 4534 is shown displayed when an application icon for a browser application is dragged and dropped into a second predefined area 4310' for opening a window for an application in split-screen mode (if there are multiple windows associated with the application). The window selector user interface area 4534 is optionally displayed in a side-by-side configuration with the background window to indicate to the user that the selected window from the window selector user interface area 4534 will be displayed in the split-screen view along with the split-screen window 4532 converted from the full-screen background window 4122.
[0339] As in Figure 4D2 or Figure 4D3 After Figure 4D18 , the movement of contact 4502 has dragged representation 4504 into an expanded second predefined area 4310' on the display, which is used to open a new split-screen window for the application on the right side of the display. In some embodiments, if input through contact 4502 ends while the contact and representation 4504 are in the expanded second predefined area 4310', and the browser application is associated with zero windows or a single window at this time, the device displays the new default window or single window in a split-screen configuration together with the split-screen window 4532 converted from the background window 4122. In some embodiments, if input through contact 4502 ends while the contact and representation 4504 are in the expanded second predefined area 4310', and the browser application is associated with multiple windows at this time, the device displays the window selector user interface area 4534 in a split-screen configuration together with the split-screen window 4532 converted from the background window 4122.
[0340] like Figure 4D19 As shown, according to some embodiments, the window selector user interface area 4534 is similarly configured relative to Figures 4D5 to 4D17Window selector user interface area 4508 is described. For example, user selector user interface area 4534 includes the same set of representations (e.g., representations 4510 and 4512 of the browser application's saved recently opened windows) and affordances (e.g., a single close affordance 4518 and 4520, close affordance 4514, new window affordance 4516, etc.). In some embodiments, the user interface interactions described with respect to window selector user interface area 4508 also apply to window selector user interface area 4534.
[0341] Figures 4E1 to 4E28 FIG2 illustrates user interface behavior in response to input of dragging a representation of a window to different locations on a display and releasing it into different drop zones on the display according to some embodiments. Figures 4E1 to 4E28 As shown, before the end of the input is detected, dynamic visual feedback is provided to indicate the result of the input based on the current position of the input and the dragged representation of the window compared to multiple predefined drop zones on the display. In some embodiments, a drag operation performed on a window displayed in a corresponding simultaneous display configuration (e.g., a side-by-side display configuration, a split-screen display configuration, a minimized display configuration, a draft mode display configuration, etc.) causes the window to be displayed in the same simultaneous display configuration, a different simultaneous display configuration, or an independent display configuration, depending on the position of the representation of the window when the end of the input is detected, as relative to different drop zones corresponding to different simultaneous display configurations and independent display configurations (e.g., Figure 4E8 The placement area shown in ) is evaluated. Figures 4E9 to 4E17 Shown is a device display according to some embodiments to indicate various intermediate states that could result if the input were to end at the current location. Figures 4E9 to 4E17 Also shown is the dynamic nature of the visual feedback and the fact that the intermediate states can be repeated any number of times in any order, depending on the movement of the input and the current position of the input relative to different drop zones on the display, before the end of the input is detected. The user interfaces in these figures are used to illustrate the processes described below, including Figures 9A to 9J For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0342] Figures 4E1 to 4E7 Seven different starting states of a window (e.g., a window of an email application) are shown. For ease of explanation, the window in this example is given different labels based on the current display configuration of the window. The same content is displayed in the window, and the display configuration of the window is changed from one configuration to another configuration due to the drag-and-drop operation performed on the window. In some embodiments, the starting configuration of the window includes any one of the configurations in a variety of configurations, including the side-pull window on the left, the side-pull window on the right, the background window with the side-pull window on the left, the background window with the side-pull window on the right, the split-screen window on the right, the split-screen window on the left, the draft window, the background window of the draft window, minimized window, the full-screen window displayed simultaneously with the minimized window, an independent full-screen window, etc. In some embodiments, the final configuration of the window includes any one of the configurations in a variety of configurations, including the side-pull window on the left, the side-pull window on the right, the background window with the side-pull window on the left, the background window with the side-pull window on the right, the background window with the side-pull window on the right, the split-screen window on the right, the split-screen window on the left, the draft window, the background window of the draft window, minimized window, the full-screen window displayed simultaneously with the minimized window, an independent full-screen window, etc. The number of transitions between possible starting configurations and possible final configurations is too numerous to list separately herein. According to some embodiments, for purposes of illustration, representative starting and final states of possible window display configurations are described. In some embodiments, either window in a pair of simultaneously displayed windows can be the subject of a drag-and-drop operation to convert the display configuration of the windows to another state. In some embodiments, a window can be converted from an independent display configuration to a simultaneous display configuration, and vice versa. In some embodiments, the drag handles of the simultaneously displayed windows switch between a first display state (e.g., active) and a second display state (background) depending on which of the simultaneously displayed windows has input focus.
[0343] like Figures 4E1 to 4E7 , seven example starting states of the display configuration of the window of the email application are shown.
[0344] exist Figure 4E1 , in an example starting state A of a display configuration of a window of an email application, the window of the email application is a split-screen window (e.g., window 4602) displayed simultaneously with split-screen window 4604 of a message application. Split-screen window 4602 of the email application is displayed on the left side of the display. Input via contact 4610 is detected on drag handle 4606 of split-screen window 4602, and drag handle 4606 is displayed in an active state (e.g., solid color, bright color). Drag handle 4608 of the simultaneously displayed split-screen window that does not have input focus is displayed in a background state (e.g., semi-transparent, dark color).
[0345] exist Figure 4E2 , in an example starting state B of a display configuration of a window for an email application, the window for the email application is a side-by-side window (e.g., window 4614) displayed simultaneously with a full-screen background window 4612 for a messaging application. Side-by-side window 4614 for the email application is displayed on the left side of the display, overlaying background window 4612 for the messaging application. Input via contact 4610 is detected on drag handle 4606 of side-by-side window 4614, and drag handle 4606 is displayed in an active state (e.g., solid color, light color). Drag handle 4608 of full-screen background window 4612, which is not having input focus, is displayed in a background state (e.g., translucent, dark color). For clarity of explanation, the same drag handle label is used when the window corresponding to the drag handle transitions from one configuration to another.
[0346] exist Figure 4E3 , in an example starting state C of a display configuration of windows for an email application, the window of the email application is a draft window (e.g., window 4615) overlaid on a full-screen background window 4612 of a message application. Draft window 4615 of the email application is displayed in the center area of the display and displays an editable draft of an email document. Input via contact 4610 is detected on handle 4606 of draft window 4615, and handle 4606 is displayed in an active state (e.g., solid color, bright color). Handle 4608 of background window 4612, which is displayed while not having input focus, is displayed in a background state (e.g., semi-transparent, dark color).
[0347] exist Figure 4E4 , in the example starting state D of the display configuration of the window of the email application, the window of the email application is a minimized window (e.g., window 4616) displayed at the peripheral portion of the full-screen window 4612 of the message application. Minimized window 4616 of the email application does not display the content of the email application. Input via contact 4610 is detected on minimized window 4615 without a visible drag handle. Drag handle 4608 of full-screen window 4612, which is displayed while not having input focus, is displayed in a background state (e.g., semi-transparent, dark).
[0348] exist Figure 4E5, in an example starting state E of a display configuration of a window of an email application, the window of the email application is a split-screen window (e.g., window 4602) displayed simultaneously with split-screen window 4604 of a message application. Split-screen window 4602 of the email application is displayed on the right side of the display. Input via contact 4610 is detected on drag handle 4606 of split-screen window 4602, and drag handle 4606 is displayed in an active state (e.g., solid color, bright color). Drag handle 4608 of the simultaneously displayed split-screen window without input focus is displayed in a background state (e.g., semi-transparent, dark color).
[0349] exist Figure 4E6 , in an example starting state F of a display configuration of a window for an email application, the window for the email application is a side-by-side window (e.g., window 4614) displayed simultaneously with a full-screen background window 4612 for a messaging application. Side-by-side window 4614 for the email application is displayed on the right side of the display, overlaying background window 4612 for the messaging application. Input via contact 4610 is detected on handle 4606 of side-by-side window 4614, and handle 4606 is displayed in an active state (e.g., solid color, light color). Handle 4608 of full-screen background window 4612, which is displayed simultaneously without input focus, is displayed in a background state (e.g., semi-transparent, dark color).
[0350] exist Figure 4E7 , in the example starting state G of the display configuration of the window of the email application, the window of the email application is an independent full-screen window (e.g., window 4618) that is not displayed simultaneously with another window. Full-screen window 4618 of the email application substantially occupies the entire display and has input focus. Input via contact 4610 is detected on drag handle 4606 of full-screen window 4618, and drag handle 4606 is displayed in an active state (e.g., solid color, light color). In some embodiments, even when the drag handle of the independent full-screen window has input focus, it is invisible or in an inactive state (e.g., translucent, dark color), and when input is detected on the drag handle, the drag handle switches to an active state (e.g., solid color, light color).
[0351] Figure 4E8Shown are different placement zones (e.g., the boundaries between zones are represented by dotted lines) that are predefined on a display and correspond to different final display configurations of the dragged window at the end of the input according to some embodiments. In some embodiments, the G zone is defined as the center portion of the display near the top edge of the display. The G zone is used to convert the window from a simultaneous display configuration to an independent full-screen display configuration when the window is placed in the G zone. In some embodiments, the H zone is a horizontal band that spans the width of the display near the top edge of the display, excluding the center portion corresponding to the G zone. The H zone is used to change which side of the display the side-pull window or split-screen window occupies. When the side-pull window or split-screen window is dragged from one side of the display to the other, its starting position and end position are within the H zone. In some embodiments, the A zone and the E zone are narrow areas defined by the corresponding side edge of each free display and the boundary at a first threshold distance from the corresponding side edge. The A zone and the E zone do not include the area occupied by the above-mentioned H zone. The A zone is used to convert the dragged window into a split-screen window that is displayed on the left side of the display simultaneously with another split-screen window. Zone E is used to convert the dragged window into a split-screen window, which is displayed on the right side of the display simultaneously with another split-screen window. In some embodiments, Zone B and Zone F are respectively adjacent to Zone A and Zone E and wider than ...
Claims
1. A method for displaying a user interface, comprising: At an electronic device comprising a display generating component and one or more input devices, the one or more input devices comprising a touch-sensitive surface: Displaying a first user interface of a first application program by the display generation component; receiving, while displaying the first user interface of the first application, a first input corresponding to a request to display a second application with the first application in a corresponding simultaneous display configuration; In response to receiving the first input, displaying a second user interface of the second application and the first user interface of the first application according to the corresponding simultaneous display configuration in which at least a portion of the first user interface of the first application is displayed simultaneously with the second user interface of the second application; receiving a second input while displaying the second application and the first application according to the respective simultaneous display configuration, including detecting a first contact at a location on the touch-sensitive surface corresponding to the second application and detecting movement of the first contact on the touch-sensitive surface; as well as In response to detecting that the second input is received while the second application and the first application are displayed according to the corresponding simultaneous display configuration: Based on determining that the second input satisfies the first criterion, while continuing to detect the second input, simultaneously displaying at least a portion of the second application, at least a portion of a third application, and at least a portion of the first application, and after detecting the end of the second input, replacing the display of the second application with the display of the third application, so as to display the third application and the first application according to the corresponding simultaneous display configuration; Based on determining that the second input satisfies a second criterion different from the first criterion: Maintaining display of the first application; as well as Stop displaying the second application and do not display the third application; and Based on determining that the second input satisfies a third criterion different from the first criterion and the second criterion, an operation is performed within the second application based on the second input.
2. The method of claim 1, wherein the corresponding simultaneous display configuration is a first simultaneous display configuration, and wherein according to the first simultaneous display configuration, the second user interface of the second application is displayed to cover a portion of the first user interface of the first application.
3. The method of claim 2, wherein based on determining that the second input satisfies the first criterion, a third user interface of the third application is displayed to cover the portion of the first user interface of the first application according to the corresponding simultaneous display configuration.
4. The method according to claim 1, wherein: The second input satisfies the first criterion, and display of the third application replaces display of the second application in the corresponding simultaneous display configuration, and the method comprises: When the third application and the first application are displayed according to the corresponding simultaneous display configuration after the second input satisfies the first criterion, detecting the third input includes detecting a second contact and detecting movement of the second contact on the touch-sensitive surface: In response to detecting the third input: Based on determining that the third input satisfies the first criterion, display of the third application is replaced with display of a fourth application to display the fourth application and the first application according to the corresponding simultaneous display configuration.
5. The method according to claim 1, comprising: In response to detecting a corresponding input satisfying the first criterion, an indication of one or more application views available for display in the corresponding simultaneous display configuration is displayed.
6. A method according to claim 1, wherein the first criterion and the second criterion have a first movement criterion, wherein the first movement criterion requires that the movement of the first contact on the touch-sensitive surface corresponds to a movement of the currently displayed user interface of the second application in a first predefined direction, wherein the first criterion has a first starting position criterion, wherein the first starting position criterion requires that the movement of the first contact starts at a position within a threshold distance of the side edge of the second user interface of the second application, and wherein the second criterion has a second starting position criterion, wherein the second starting position criterion requires that the movement of the first contact starts at a position within a threshold distance of the bottom edge of the second user interface of the second application.
7. A method according to claim 1, wherein the first standard has a first movement standard, the first movement standard requiring that the movement of the first contact on the touch-sensitive surface corresponds to the movement of the currently displayed user interface of the second application in a first predefined direction, and wherein the second standard has a second movement standard, the second movement standard requiring that the movement of the first contact on the touch-sensitive surface corresponds to the movement of the currently displayed user interface of the second application in a second predefined direction different from the first predefined direction.
8. The method according to claim 1, comprising: In response to detecting the second input: Based on determining that the second input satisfies a fourth criterion, corresponding representations of multiple application views most recently displayed in the corresponding simultaneous display configuration are simultaneously displayed with another application, the corresponding representations including representations of application views corresponding to the second application and representations of application views corresponding to the third application.
9. A method according to claim 8, wherein the representation of the application view corresponding to the second application includes an identifier of the second application and an identifier of the application window corresponding to the second application, and the representation of the application view corresponding to the third application includes an identifier of the third application and an identifier of the application window corresponding to the third application.
10. A method according to claim 8, wherein the fourth criterion includes a corresponding starting position criterion, the corresponding starting position criterion requiring that the movement of the first contact starts within a threshold range of the first edge of the second application, and the third criterion includes a corresponding movement criterion, the corresponding movement criterion requiring that the movement of the first contact satisfies a first movement condition in order to satisfy the fourth criterion.
11. A method according to claim 8, wherein the corresponding representations of the multiple application views do not include a representation of an application view of the first application in the corresponding representations of the multiple application views, and the corresponding representations of the multiple application views were most recently displayed together with another application in the corresponding simultaneous display configuration.
12. The method according to claim 8, comprising: while displaying the respective representations of the plurality of application views most recently displayed in the respective simultaneous display configuration together with another application, wherein the respective representations include the representation of the application view corresponding to the second application and the representation of the application view corresponding to the third application, detecting a fourth input that satisfies a fifth criterion; as well as In response to detecting the fourth input: ceasing to display the representation of the application view corresponding to the second application based on determining that the fourth input is directed to the representation of the second application; as well as Based on determining that the fourth input points to the representation of the third application, ceasing to display the representation of the application view corresponding to the third application.
13. The method according to claim 8, comprising: while displaying the respective representations of the plurality of application views most recently displayed in the respective simultaneous display configuration together with another application, wherein the respective representations include the representation of the application view corresponding to the second application and the representation of the application view corresponding to the third application, detecting a fifth input that satisfies a sixth criterion; as well as In response to detecting the fifth input, a relative display prominence of the first application view and the second application view is changed according to the fifth input.
14. The method according to claim 8, comprising: detecting a sixth input satisfying a seventh criterion while displaying the respective representation of the plurality of application views most recently displayed in the respective simultaneous display configuration and another application; as well as In response to detecting the sixth input: ceasing to display said respective representations of said plurality of application views; as well as A respective application view selected from the plurality of application views in the respective simultaneous display configuration is displayed along with the first application, wherein the respective application view is selected based on a location of the sixth input.
15. The method according to claim 8, comprising: In response to detecting the second input: Based on determining that the second input satisfies the fourth criterion, visually obscuring a portion of a display of the first user interface of the first application relative to the corresponding representation of the multiple application views that was most recently displayed in the corresponding simultaneous display configuration with another application.
16. The method of claim 1, wherein a horizontal swipe gesture detected near a bottom edge of a respective application displayed with the first application in the respective simultaneous display configuration satisfies the first criterion.
17. The method of claim 1, wherein: When a previous input satisfies the second criterion and the first application is displayed after the corresponding application is removed from simultaneous display with the first application in the corresponding simultaneous display configuration, detecting a seventh input includes detecting a third contact and detecting movement of the third contact on the touch-sensitive surface: In response to detecting the seventh input: Based on determining that the seventh input satisfies an eighth criterion, display of the corresponding application is restored to redisplay the corresponding application and the first application according to the corresponding simultaneous display configuration.
18. The method according to claim 17, comprising: In response to detecting the seventh input: Based on determining that the seventh input satisfies the eighth criterion, an indication of one or more application views available for display in the corresponding simultaneous display configuration is displayed.
19. The method of claim 1, wherein: While displaying the respective application and the first application according to the respective simultaneous display configuration, detecting an eighth input, including detecting a fourth contact, detecting movement of the fourth contact on the touch-sensitive surface, and detecting liftoff of the fourth contact after the movement of the fourth contact: In response to detecting the eighth input: Based on determining that the eighth input satisfies a ninth criterion, wherein the ninth criterion requires that the fourth contact is detected at a position on the touch-sensitive surface corresponding to first content represented in the first user interface of the first application, and that movement of the fourth contact on the touch-sensitive surface corresponds to movement from the position of the first content to a position above the corresponding application, replacing the display of the corresponding application with the display of the first content in an application corresponding to the first content, so that the application corresponding to the first content is displayed together with the first application according to the corresponding simultaneous display configuration.
20. The method according to claim 1, comprising: While displaying the respective application and the first application according to the respective simultaneous display configuration, detecting a ninth input, including detecting a fifth contact, detecting movement of the fifth contact on the touch-sensitive surface, and detecting liftoff of the fifth contact after the movement of the fifth contact: In response to detecting the ninth input: Based on determining that the ninth input satisfies the tenth criterion, wherein the tenth criterion requires that the fifth contact be detected on the touch-sensitive surface at a position corresponding to a first application icon in a taskbar that is displayed simultaneously with the first application, and that movement of the fifth contact on the touch-sensitive surface corresponds to movement from the position of the first application icon to a position above the corresponding application, replacing the display of the corresponding application with the display of the application corresponding to the first application icon to display the application corresponding to the first application icon together with the first application according to the corresponding simultaneous display configuration.
21. The method according to claim 1, comprising: In response to detecting the second input: The second input is determined to satisfy the eleventh criterion according to: moving the second application relative to the first application based on the movement of the first contact; and The second application is maintained displayed with the first application in the corresponding simultaneous display configuration.
22. The method of claim 1, wherein the corresponding simultaneous display configuration is a first simultaneous display configuration in which the second application is displayed to overlay a portion of the first application, and the method comprises: In response to detecting the second input: Based on determining that the second input satisfies a twelfth criterion, switching from displaying the second application and the first application in the first simultaneous display configuration to displaying the second application and the first application in a second simultaneous display configuration, wherein the first application and the second application are displayed side by side in the second simultaneous display configuration.
23. The method according to claim 1, comprising: while displaying the first application after receiving the second input, detecting a twelfth input corresponding to a request to display an application switcher user interface including representations of a plurality of recently opened applications; and In response to detecting the twelfth input, replacing display of the first application with display of the application switcher user interface, wherein the application switcher user interface includes representations of multiple application views corresponding to the multiple recently opened applications, including one or more first application views as full screen windows and one or more second application views as side-by-side windows to be displayed together with another application view including any one of the first application views.
24. A computer-readable storage medium storing executable instructions which, when executed by an electronic device having one or more processors, a display generating component, and a touch-sensitive surface, cause the electronic device to perform the method according to any one of claims 1 to 23.
25. An electronic device comprising: one or more processors; Display generated components; one or more input devices including a touch-sensitive surface; and A memory storing one or more programs configured to be executed by the one or more processors, the one or more programs comprising instructions for executing the method according to any one of claims 1 to 23.