Interface display methods, electronic devices, storage media, chip systems, and computer program products

By gradually hiding the dock and shrinking the taskbar window in multi-task scheduling mode, the problem of the taskbar not being able to completely cover the dock is solved, improving the smoothness and aesthetics of interface switching.

CN119225587BActive Publication Date: 2026-01-30HONOR DEVICE CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202411295389.7
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2024-09-13
Publication Date
2026-01-30
Estimated Expiration
2044-09-13

AI Technical Summary

Technical Problem

When an electronic device switches from multitasking mode to normal mode, the taskbar window cannot completely cover the dock, resulting in overlapping display of the interface and affecting the user experience.

Method used

During the switching process, the taskbar window that covers the dock is first displayed, and then the taskbar window is gradually shrunk and the dock is hidden to avoid overlapping display.

Benefits of technology

It improves the smoothness and continuity of interface transitions, thus enhancing the user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119225587B_ABST
    Figure CN119225587B_ABST
Patent Text Reader

Abstract

This application provides an interface display method, electronic device, storage medium, chip system, and computer program product, relating to the field of terminal technology. The method includes: a dock bar containing a first control; responding to a trigger operation on the first control, sequentially displaying a first-stage window, a second-stage window, and a third-stage window; wherein the length and width of the first-stage and second-stage windows are both greater than the length and width of the dock bar; the height of the third-stage window may be less than the height of the dock bar, but the dock bar is hidden before the third stage. Thus, during the switch from the dock bar to the taskbar window, the taskbar window can cover the dock bar; or, the electronic device may not display the dock bar; thereby reducing scenarios where the taskbar window cannot completely cover the dock bar during switching, improving the smoothness of the mode switching process, and enhancing the user experience.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of terminal technology, and in particular to an interface display method, electronic device, storage medium, chip system, and computer program product. Background Technology

[0002] Electronic devices can support multitasking. For example, an electronic device may include a multitasking scheduling mode, during which multiple application windows can be displayed on the screen to allow the user to perform multiple tasks simultaneously.

[0003] In one possible implementation, a first control for switching between multitasking modes could be displayed in the desktop dock. Upon receiving a click on this first control, the electronic device could switch to multitasking mode. In multitasking mode, the electronic device could display a taskbar window that overlays the dock. The taskbar window could include the first control and multiple application icons. The first control could be used to exit multitasking mode.

[0004] When multitasking mode is enabled, electronic devices can switch from the dock to the taskbar window. However, during this switch, there may be instances where both the taskbar window and the dock are displayed simultaneously, impacting the user experience. Summary of the Invention

[0005] This application provides an interface display method, electronic device, storage medium, chip system, and computer program product, applied in the field of terminal technology. When entering or exiting a multi-task scheduling mode, the dock is hidden before the taskbar window shrinks and the animation is displayed, thereby reducing the problem of the taskbar window not being able to completely cover the dock during the switching process, improving the smoothness of the mode switching process, and enhancing the user experience.

[0006] Firstly, embodiments of this application propose an interface display method. The method includes: displaying a dock bar (e.g., on the desktop of an electronic device) on the screen. Figure 5 The dock (501 shown in Figure 'a') includes a first control (e.g., the multitasking scheduler icon 103) and multiple icons (e.g., ...). Figure 1 (The icons in the dock bar 101 of the interface shown in Figure a, excluding the multitasking scheduling icon 103, include, for example, application icons and folders).

[0007] In response to a triggering operation on the first control (e.g., a click on the multitasking scheduling icon 103), the first-stage window is displayed (e.g., ...). Figure 5The first-stage window is located above the dock and covers the dock. The first-stage window includes a first control and multiple icons from the dock (e.g., all icons from the dock 501 are included in the taskbar window 502). The length of the first-stage window is greater than or equal to the length of the dock, and the height of the first-stage window is greater than or equal to the height of the dock. This embodiment uses the example of both windows having the same length and height to illustrate the solution. In practical applications, the length or height of the first-stage window is not less than the length or height of the dock to achieve the effect of the first-stage window covering the dock. This embodiment does not impose any limitations on this.

[0008] This displays the second phase (the second phase can correspond to time points from the second to the fourth, for example, from...). Figure 5 Enter the taskbar window 502 in the interface shown in b. Figure 5 The first stage window (as shown in step d) is the window displayed in the taskbar window (process 504). The second stage window is the window that follows the first stage window (the second stage is located after the first stage). The length of the second stage window is greater than the length of the first stage window, and the height of the second stage window is equal to the height of the first stage window. This process corresponds to the process of displaying the animation of adding icons in the taskbar window. When adding icons to the taskbar window, the length of the taskbar window continuously increases, while the height remains constant. In the second stage, the size of the taskbar window is also larger than the dock window, that is, the taskbar window can cover the dock.

[0009] The third stage is displayed (the third stage may correspond to the fourth to fifth time points, for example, from...). Figure 5 The taskbar window 504 in the interface shown by d enters Figure 5 The process of displaying the taskbar window (505) in the interface shown in Figure 'e' is as follows: The third stage window is the window that follows the second stage window (the third stage is located after the second stage); the length of the third stage window is less than the length of the second stage window, and the height of the third stage window is less than the height of the second stage window; during the display of the third stage window, the electronic device hides the dock. This process corresponds to the process of displaying a shrink animation in the taskbar window. During the shrinking of the taskbar window, both the length and height of the taskbar window decrease, and the height of the taskbar window may be less than the height of the dock. Therefore, the electronic device hides the view of the dock before executing the shrink animation. If the taskbar window may not be able to cover the dock area, the dock is not displayed to reduce the problem scenario of the taskbar window and the dock appearing simultaneously.

[0010] In this way, during the process from the first to the third stage mentioned above, the taskbar window can cover the dock; or, if the taskbar window cannot cover the dock, the dock can be hidden; thus, during the process of switching from the dock to the taskbar window, the problem of the taskbar window not being able to cover the dock will not occur, improving the smoothness and continuity of the switching process and enhancing the user experience.

[0011] Optionally, the number of icons in the first-stage window (e.g., 8 icons in taskbar window 502) is equal to the number of icons in the dock (e.g., 8 icons in dock 501), and the icon size in the first-stage window is equal to the icon size in the dock (no scaling occurs, icon size remains unchanged); the number of icons in the second-stage window (e.g., 10 icons in taskbar windows 503 or 504) is greater than the number of icons in the first-stage window, and the icon size in the second-stage window is equal to the icon size in the first-stage window (no scaling occurs, icon size remains unchanged); the number of icons in the third-stage window (e.g., 10 icons in taskbar window 505) is equal to the number of icons in the second-stage window, and the icon size in the third-stage window is smaller than the icon size in the third-stage window (scaling occurs, icon size shrinks).

[0012] It should be noted that the number of icons in the dock and taskbar window in this embodiment is for illustrative purposes only, and the number of icons can also be other values.

[0013] In this way, when switching to multitasking mode, electronic devices can display animations of adding and shrinking icons in the taskbar window, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0014] Optionally, displaying a third-stage window includes: displaying a first animation (e.g., a shrinking animation) in the third-stage window, the first animation indicating that the third-stage window is shrinking; wherein the view of the dock is invisible and the view of the third-stage window is visible.

[0015] See Figure 9 Before the electronic device displays the zoom-out animation, the dock's view is set to invisible. When the zoom-out animation is displayed, the dock's view remains invisible, while the view of the third-stage window remains visible.

[0016] It should be noted that the windows in the first to third stages are different transformations of the same window. After setting the show attribute of the taskbar window, the taskbar window will retain the show attribute unless it is switched to the hide attribute. For example, if the window in the first stage is set to show, the taskbar window will retain the show attribute in all three stages.

[0017] Similarly, if the visibility property of the dock view is set to invisible at any time during the first or second phase, the dock view will remain invisible in the third phase.

[0018] This way, the dock bar won't be displayed if the height of the shrunk taskbar window cannot cover it, thus reducing the problem of the taskbar window and dock bar overlapping.

[0019] Optionally, the first animation effect is displayed in the third-stage window, including: for any icon in the third-stage window, obtaining the first position of the icon (e.g., start X). i ), second position (e.g., end X) i The first icon size (e.g., start value1) and the second icon size (e.g., end value1); the first position is the position of the icon in the third stage window before the first animation is displayed, and the second position is the position of the icon in the third stage window after the first animation is displayed; the first icon size is the size of the icon before the first animation is displayed, and the second icon size is the size of the icon after the first animation is displayed; Figure 5 Taking the multitasking icon 103 as an example, its position in taskbar window 504 is the first position; its position in taskbar window 505 is the second position; the icon size of multitasking icon 103 in taskbar window 504 is the first icon size, and the icon size of multitasking icon 103 in taskbar window 505 is the second icon size. Then, the icon is moved from the first position to the second position, and simultaneously, the icon size is reduced from the first icon size to the second icon size.

[0020] This allows for a synchronized shrinking animation between the taskbar window and the icons within it, enhancing aesthetics.

[0021] Optionally, during the display of the dock, the view of the dock is visible, while the view of the first-stage window is invisible; displaying the first-stage window includes: setting the view of the first-stage window to be visible, while keeping the view of the dock visible.

[0022] In this way, when switching from the dock to the taskbar window, both views can be displayed simultaneously first, and then the dock view can be hidden and displayed later, thus avoiding the problem of a blank interface appearing at the bottom of the desktop when the dock and taskbar window are hidden at the same time.

[0023] Optionally, displaying a second-stage window includes: displaying a second animation effect (e.g., an icon-adding animation effect) in the second-stage window. The second animation effect is used to indicate the addition of a first icon and a second icon in the second-stage window. Both the first icon and the second icon are associated with the function of the first control (e.g., multi-window template icon 106 and application list icon 107, with the added icon being an icon specific to the multi-task scheduling mode).

[0024] In this way, after switching to multitasking mode, electronic devices can display icons specific to this mode to perform corresponding functions, such as the function of arranging multiple application windows and the function of bringing up the application list window, helping users to use multitasking mode more conveniently.

[0025] Optionally, displaying a second animation effect in the second stage window includes: obtaining the third position (e.g., start X1) and the fourth position (e.g., end X1) of the first control; the third position is the position of the first control in the second stage window before displaying the second animation effect, and the fourth position is the position of the first control in the second stage window after the second animation effect is displayed; translating the first control from the third position to the fourth position; during the translation of the first control, the third position also displays a fixed first icon, the transparency of the first icon gradually decreases (e.g., from transparent to opaque, the transparency value gradually increases, from 0 to 1), and the first icon is located below the first control.

[0026] Taking the first icon as the multi-window template icon 106 as an example, the third position can be, for example, the position of the multi-task scheduling icon 103 in the taskbar window 502. At this time, the multi-task scheduling icon 103 overlaps with the multi-window template icon 106, and the multi-task scheduling icon 103 is located on top of the multi-window template icon 106.

[0027] This allows the icons added to the taskbar window to be displayed, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0028] Optionally, displaying a second animation effect in the second-stage window also includes: controlling the second-stage window to expand along the boundary of the first direction, and gradually displaying a second icon as the second-stage window expands; the first direction includes the left or right.

[0029] Taking the application list icon 107 as an example, the second icon is close to the right edge of the taskbar window 503. When the animation of adding the icon is displayed, the right edge of the taskbar window 503 expands to the right to increase the length of the window, and the second icon is gradually displayed in the newly added area of ​​the window.

[0030] This allows the icons added to the taskbar window to be displayed, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0031] Optionally, the dock includes an icon for the first application. After the dock is displayed on the desktop of the electronic device, the process further includes: in response to a trigger action on the icon of the first application, the electronic device displays the page content of the first application in full screen. This process can correspond to a scenario where the icon in the dock is used in normal mode.

[0032] The third-stage window includes the icon of the first application. After the third-stage window is displayed, it also includes: in response to a triggering operation on the icon of the first application, the electronic device displays the page content of the first application in the form of a floating window.

[0033] This process corresponds to scenarios where a taskbar window is used in multi-task scheduling mode; see [link / reference]. Figure 2 The interface shown.

[0034] In this way, users can launch multiple application windows simultaneously in the form of floating windows in multi-task scheduling mode, thereby realizing multi-window quick business and improving office efficiency.

[0035] Optionally, after displaying the third-stage window (e.g., taskbar window 505 or taskbar window 601), the process further includes: in response to a triggering operation on the first control, displaying a fourth-stage window (the fourth stage may correspond to moments six through eight, such as the transition from taskbar window 601 to taskbar window 603); the fourth-stage window is the window that follows the third-stage window; the length of the fourth-stage window is less than the length of the third-stage window, and the height of the fourth-stage window is equal to the height of the third-stage window. During this process, the taskbar window may display an animation of decreasing icons, the length of the taskbar window decreases, and the height remains unchanged.

[0036] The fifth stage window is displayed (the fifth stage may correspond to the ninth moment, for example, the process of changing from taskbar window 603 to taskbar window 604); the fifth stage window is the window that follows the fourth stage window; the length of the fifth stage window is greater than the length of the fourth stage window, and the height of the fifth stage window is greater than the height of the fourth stage window. During this process, the taskbar window may display a zoom-in animation, and both the length and height of the taskbar window will increase.

[0037] Display a dock (e.g., dock 605), and the dock is displayed sequentially from the fifth stage window; the length of the dock is less than or equal to the length of the fifth stage window, and the height of the dock is less than or equal to the height of the fifth stage window.

[0038] In this way, the dock bar is not displayed on electronic devices in the fourth and fifth stages; the dock bar is only displayed when the length and height of the taskbar window are greater than or equal to the length and height of the dock bar; thus ensuring that the taskbar window does not fail to cover the dock bar during the switch from multi-tasking mode back to normal mode, improving the smoothness of the switching process.

[0039] Optionally, the number of icons in the fourth-stage window (e.g., 8 icons in taskbar window 603) is less than the number of icons in the third-stage window (e.g., 10 icons in taskbar window 601), and the icon size in the fourth-stage window is equal to the icon size in the third-stage window (no scaling occurs, icon size remains unchanged); the number of icons in the fifth-stage window (e.g., 8 icons in taskbar window 604) is equal to the number of icons in the fourth-stage window, and the icon size in the fifth-stage window is greater than the icon size in the fourth-stage window (scaling occurs, icon size is enlarged); the number of icons in the dock (e.g., 8 icons in dock 605) is equal to the number of icons in the fifth-stage window, and the icon size in the dock is equal to the icon size in the fifth-stage window (no scaling occurs, icon size remains unchanged).

[0040] In this way, when switching back to normal mode, electronic devices can display reduced icon animations and enlargement animations in the taskbar window, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0041] Optionally, displaying a fourth-stage window includes: displaying a third animation (e.g., an animation of reducing icons) in the fourth-stage window, the third animation indicating the deletion of the first and second icons in the fourth-stage window; the dock bar view remains invisible, and the fourth-stage window remains visible.

[0042] See Figure 11 During step S1101, the view of the dock and the state of the taskbar window are not switched.

[0043] This way, the dock bar won't be displayed if the height of the unenlarged taskbar window cannot cover it, thus reducing the problem of the taskbar window and dock bar overlapping.

[0044] Optionally, the third animation effect is displayed in the fourth stage window, including: obtaining the fifth position (startX2) and the sixth position (endX2) of the first control; the fifth position is the position of the first control in the fourth stage window before the third animation effect is displayed, and the sixth position is the position of the first control in the fourth stage window after the third animation effect is displayed; the fifth position is the same as the fourth position; with Figure 6 Taking the multitasking scheduling icon 103 as an example, the multitasking scheduling icon 103 in the taskbar window 601 is located in the fifth position; the multitasking scheduling icon 103 in the taskbar window 603 is located in the sixth position; then, the first control is moved from the fifth position to the sixth position; during the movement of the first control, the first icon is still fixedly displayed in the sixth position, and the transparency of the first icon gradually increases (for example, from opaque to transparent, the transparency value gradually decreases, from 1 to 0), and the first icon is located below the first control.

[0045] This displays the effect of deleting icons in the taskbar window, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0046] Optionally, displaying a third animation effect in the fourth stage window also includes: controlling the fourth stage window to shrink from the boundary of the first direction to the second direction, and gradually hiding the second icon as the fourth stage window shrinks; the first direction includes the left or right, and the second direction is opposite to the first direction.

[0047] Taking the application list icon 107 as an example, the second icon is close to the right edge of the taskbar window 503. When the animation of deleting the icon is displayed, the right edge of the taskbar window 602 shrinks to the left to reduce the length of the window. At the same time, the content of the second icon corresponding to the reduced area in the window is hidden.

[0048] This displays the effect of deleting icons in the taskbar window, improving the smoothness and aesthetics of the switching process and enhancing the user experience.

[0049] Optionally, displaying the fifth stage window includes: displaying a fourth animation (e.g., a zoom-in animation) in the fifth stage window, the fourth animation indicating zooming in on the fifth stage window; wherein the view of the dock remains invisible, and the view of the fifth stage window is visible.

[0050] This way, the dock bar is not displayed during animation, thus reducing the problem of the taskbar window and dock bar overlapping.

[0051] Optionally, a fourth animation effect is displayed in the fifth-stage window, including: for any icon in the fifth-stage window, obtaining the seventh position of the icon (e.g., start X). j), the eighth position (e.g., end X) j ), third icon size (e.g., start value2), and fourth icon size (end value2); Figure 6 Taking the multitasking icon 103 as an example, in taskbar window 603, the multitasking icon 103 is located in the seventh position; in taskbar window 604, the multitasking icon 103 is located in the eighth position; the icon size of the multitasking icon 103 in taskbar window 603 is the third icon size, and the icon size of the multitasking icon 103 in taskbar window 604 is the fourth icon size. Then, the icon is moved from the seventh position to the eighth position, and simultaneously enlarged from the third icon size to the fourth icon size.

[0052] It is understood that in this embodiment, the device switches to multi-task scheduling mode by first displaying an icon enlargement animation followed by a shrinking animation; then it switches back to normal mode by first displaying an icon decrease animation followed by a zoom-in animation. These two processes are not inverse processes, so when switching back to normal mode, the parameters for the icon decrease and zoom-in animations are different from those for the icon increase and shrinking animations. If, when switching back to normal mode, the electronic device displays the zoom-in animation followed by the icon decrease animation, then the electronic device can use end X1 as start X2, and start X1 as end X2; end X i As start X j , start X i As end X j And use the end value1 as the start value2, thus reducing memory operations.

[0053] This allows for a synchronized zoom-in animation between the taskbar window and the icons within it, enhancing aesthetics.

[0054] Secondly, embodiments of this application provide an electronic device, which may also be referred to as a terminal device, terminal, user equipment (UE), mobile station (MS), mobile terminal (MT), etc. Terminal devices can be mobile phones, smart TVs, wearable devices, tablets, computers with wireless transceiver capabilities, virtual reality (VR) terminal devices, augmented reality (AR) terminal devices, wireless terminals in industrial control, wireless terminals in self-driving, wireless terminals in remote medical surgery, wireless terminals in smart grids, wireless terminals in transportation safety, wireless terminals in smart cities, wireless terminals in smart homes, and so on.

[0055] The electronic device includes: a processor and a memory; the memory stores computer-executable instructions; the processor executes the computer-executable instructions stored in the memory, causing the electronic device to perform the method as described in the first aspect.

[0056] Thirdly, embodiments of this application provide a computer-readable storage medium storing a computer program. When executed by a processor, the computer program implements the method as described in the first aspect.

[0057] Fourthly, embodiments of this application provide a computer program product, which includes a computer program that, when run, causes a computer to perform the method as described in the first aspect.

[0058] Fifthly, embodiments of this application provide a chip system including at least one processor and a communication interface, the communication interface and at least one processor being interconnected via a line, the at least one processor being used to run computer programs or instructions to perform the method as described in the first aspect.

[0059] It should be understood that the second to fifth aspects of this application correspond to the technical solutions of the first aspect of this application, and the beneficial effects achieved by each aspect and the corresponding feasible implementation are similar, and will not be repeated here. Attached Figure Description

[0060] Figure 1A schematic diagram of an interface for entering a multi-task scheduling mode provided in an embodiment of this application;

[0061] Figure 2 A schematic diagram of an interface for launching multiple application windows in a multi-task scheduling mode, provided as an embodiment of this application;

[0062] Figure 3 This is a schematic diagram illustrating the interface that simultaneously displays the dock and taskbar windows during a possible switching process in a given implementation.

[0063] Figure 4 This is a schematic diagram of the interface for entering multi-task scheduling mode in a possible implementation.

[0064] Figure 5 A schematic diagram of an interface for entering a multi-task scheduling mode provided in an embodiment of this application;

[0065] Figure 6 A schematic diagram of an interface for exiting a multi-task scheduling mode provided in an embodiment of this application;

[0066] Figure 7 This is a schematic diagram of the structure of the electronic device 100 provided in the embodiments of this application;

[0067] Figure 8 A software structure block diagram of the electronic device 100 provided in the embodiments of this application;

[0068] Figure 9 A schematic diagram illustrating a process for entering a multi-task scheduling mode, provided as an embodiment of this application;

[0069] Figure 10 A schematic diagram of the taskbar window layout provided for an embodiment of this application;

[0070] Figure 11 A schematic diagram illustrating a process for exiting a multi-task scheduling mode, provided as an embodiment of this application;

[0071] Figure 12 This is a schematic diagram of the structure of an interface display device provided in an embodiment of this application. Detailed Implementation

[0072] To facilitate a clear description of the technical solutions in the embodiments of this application, some terms and technologies involved in the embodiments of this application will be briefly introduced below:

[0073] 1. Electronic equipment

[0074] The electronic devices in this application embodiment may include handheld devices with image processing functions, vehicle-mounted devices, etc. For example, some electronic devices include: mobile phones, tablets, PDAs, laptops, mobile internet devices (MIDs), wearable devices, virtual reality (VR) devices, augmented reality (AR) devices, wireless terminals in industrial control, wireless terminals in self-driving, wireless terminals in remote medical surgery, wireless terminals in smart grids, wireless terminals in transportation safety, wireless terminals in smart cities, wireless terminals in smart homes, cellular phones, cordless phones, session initiation protocol (SIP) phones, wireless local loop (WLL) stations, personal digital assistants (PDAs), handheld devices with wireless communication capabilities, computing devices or other processing devices connected to a wireless modem, in-vehicle devices (such as vehicle infotainment systems), wearable devices, electronic devices in 5G, or future evolutions of public land mobile communications. The embodiments of this application do not limit the scope of electronic devices in a network (PLMN).

[0075] By way of example and not limitation, in this embodiment, the electronic device can also be a wearable device. Wearable devices, also known as wearable smart devices, are a general term for devices that utilize wearable technology to intelligently design and develop everyday wearables, such as hearing aids, glasses, gloves, watches, clothing, and shoes. Wearable devices are portable devices that are worn directly on the body or integrated into the user's clothing or accessories. Wearable devices are not merely hardware devices, but also achieve powerful functions through software support, data interaction, and cloud interaction. Broadly speaking, wearable smart devices include those that are feature-rich, large in size, and can achieve complete or partial functions without relying on a smartphone, such as smartwatches or smart glasses, as well as those that focus on a specific type of application function and require the use of other devices such as smartphones, such as various smart bracelets and smart jewelry for vital sign monitoring.

[0076] Furthermore, in this application embodiment, the electronic device can also be an electronic device in the Internet of Things (IoT) system. IoT is an important part of the future development of information technology. Its main technical feature is to connect objects through communication technology, thereby realizing the intelligent interconnection of humans and machines and the interconnection of things.

[0077] The electronic devices in the embodiments of this application may also be referred to as: terminal equipment, user equipment (UE), mobile station (MS), mobile terminal (MT), access terminal, user unit, user station, mobile station, mobile station, remote station, remote terminal, mobile device, user terminal, terminal, wireless communication equipment, user agent, or user device, etc.

[0078] 2. Other terms

[0079] In this application, the terms "exemplary" or "for example" are used to indicate that something is an example, illustration, or description. Any embodiment or design described as "exemplary" or "for example" in this application should not be construed as being more preferred or advantageous than other embodiments or designs. Specifically, the use of terms such as "exemplary" or "for example" is intended to present the relevant concepts in a specific manner.

[0080] In this application embodiment, "at least one" refers to one or more, and "more than one" refers to two or more. "And / or" describes the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A alone, A and B simultaneously, or B alone, where A and B can be singular or plural. The character " / " generally indicates that the preceding and following related objects are in an "or" relationship. "At least one of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one of a, b, or c can represent: a, b, c, ab, ac, bc, or abc, where a, b, and c can be single or multiple.

[0081] It should be noted that the phrase "at...time" in the embodiments of this application can refer to the instant at which a certain situation occurs, or to a period of time after the occurrence of a certain situation; the embodiments of this application do not specifically limit this. Furthermore, the display interface provided in the embodiments of this application is merely an example, and the display interface may include more or less content.

[0082] Electronic devices can support multitasking mode, which allows users to perform multiple tasks simultaneously.

[0083] The following example uses a tablet as an example of an electronic device, combined with... Figure 1 and Figure 2 The use cases for the multi-task scheduling mode are explained.

[0084] For the process of an electronic device entering multi-task scheduling mode, please refer to [link / reference]. Figure 1 :

[0085] Electronic devices can display a desktop, such as Figure 1 The interface shown in Figure 'a'. Figure 1 The interface shown in 'a' may include the main interface, the dock 101 (e.g., the area shown in the dashed box), and the page indicator 102.

[0086] The main interface may display one or more application icons and / or service cards; for example, the main interface may include social application icons, email application icons, computer application icons, navigation application icons, settings application icons, game application icons, clock application icons, calendar application icons, gallery application icons, and memo application icons; or, for example, the main interface may include time cards and note cards.

[0087] Page indicator 102 is used to indicate the location of the current main interface across multiple desktops. For example, Figure 1 If the main interface shown in 'a' is the first desktop, then the indicator in page indicator 102 used to indicate the first desktop will be highlighted.

[0088] It is understandable that the main interface corresponds to the page indicator 102, and the electronic device can switch the main interface based on left and right swipe operations, and the page indicator 102 changes accordingly.

[0089] The dock 101 can be located at the bottom of the desktop and is used to permanently display application icons. For example, the dock may include a multitasking icon 103, video application icons, music application icons, e-book application icons, folder icons, browser application icons, camera application icons, and note-taking application icons. The multitasking icon 103 can be understood as the aforementioned first control. When the user swipes left or right on the desktop, the icons in the dock 101 will not change with the main interface.

[0090] exist Figure 1 In the interface shown in Figure a, when a trigger operation is received for the multi-task scheduling icon 103, the electronic device can enter... Figure 1 The interface shown in b is shown in the image. Figure 1 In the interface shown in b, the electronic device may include a main interface, a taskbar window 104 (e.g., the area shown in the dashed box), and a prompt pop-up window 105.

[0091] in, Figure 1 The main interface shown in b can be referenced. Figure 1 The description of the main interface shown in 'a' is omitted here.

[0092] The taskbar window 104 can display multiple application icons. The taskbar window 104 may include icons for all applications shown in the dock; for example, it may include a multitasking icon 103, video application icons, music application icons, e-book application icons, folder icons, browser application icons, camera application icons, and note-taking application icons. Furthermore, the taskbar window 104 may also include icons specific to multitasking mode, such as a multi-window template icon 106 and an application list icon 107. The multi-window template icon 106 can be used to set the position and size of multiple application windows according to a preset template; the application list icon 107 can be used to display desktop application icons in a window.

[0093] The pop-up notification 105 can be used to inform the user that they have entered multitasking mode. After a period of time, the electronic device can stop displaying the pop-up notification 105.

[0094] At this point, the electronic device can enter multi-task scheduling mode, allowing users to handle tasks from multiple application windows simultaneously. See below. Figure 2 :

[0095] After entering multi-task scheduling mode, the electronic device can display as follows: Figure 2 The interface shown in Figure 'a'. Figure 2 The taskbar window in the interface shown in Figure a may include: multi-window template icon 106, application list icon 107, note application icon 201, and e-book application icon 202, etc.

[0096] During the use of multi-task scheduling mode, the electronic device can format multiple application windows. For example, upon receiving a trigger operation for the multi-window template icon 106, the electronic device can display a template pop-up window, which can display multiple preset templates. After receiving a selection operation for any preset template, the electronic device can subsequently arrange multiple application windows according to that preset template when launching application windows (this operation process is not shown in the diagram). For example, the preset template can be as follows: Figure 2 The layout and order of multiple application windows are shown in the interface shown in b.

[0097] Even without selecting a multi-window template, electronic devices can use the default preset template or a previously used preset template to layout subsequent application windows.

[0098] Taking the example of opening a note-taking app, an e-book app, and a social media app on an electronic device in sequence:

[0099] exist Figure 2In the interface shown in Figure a, when a trigger operation is received for the note-taking application icon 201, the electronic device can... Figure 2 The interface shown in Figure 'a' displays a floating window of the note-taking application on top (see reference). Figure 2 (Floating window 203 in the interface shown in b).

[0100] After the floating window 203 is raised, the electronic device can cancel the display of the desktop. For example, Figure 2 The interface shown in b no longer displays the main interface and the application icons in the main interface.

[0101] Subsequently, without closing the floating window 203, a trigger operation is received for the e-book application icon 202; in response to this trigger operation, the electronic device can bring up the floating window of the e-book application (see reference). Figure 2 (See floating window 204 in the interface shown in b). At this time, the electronic device can display both floating window 203 and floating window 204 simultaneously.

[0102] Without closing floating windows 203 and 204, a trigger operation is received targeting the social application icon; in response to this trigger operation, the electronic device can bring up the floating window of the social application (see reference). Figure 2 (See the floating window 205 in the interface shown in b). At this time, as... Figure 2 As shown in b, the electronic device can simultaneously display floating windows 203, 204, and 205, allowing users to handle note-taking, e-book, and social applications simultaneously using multiple application windows.

[0103] Understandably, if the taskbar window does not include the social application icon, and the electronic device already displays at least one floating window, causing the electronic device to no longer display the desktop, the electronic device can display more application icons based on the application list icon 107. For example, in response to a trigger operation on the application list icon 107, the electronic device can display an application list pop-up; the application list pop-up can include some or all of the application icons on the electronic device, and the user can find the social application icon in the application list pop-up (this scenario is not shown in the figure). When a trigger operation is received on the social application icon, the electronic device can cancel the display of the application list pop-up and display the at least one floating window and the floating window of the social application, such as... Figure 2 The interface shown in b is shown in the image.

[0104] Now, electronic devices can use multi-task scheduling mode to process the business of multiple application windows simultaneously.

[0105] Subsequently, the electronic device can exit the multi-task scheduling mode.

[0106] For example, after closing all application windows, the electronic device may display something like this: Figure 1The interface shown in b is in response to... Figure 1 In the interface shown in b, the trigger operation for the multi-task scheduling icon 103 causes the electronic device to return to... Figure 1 The interface shown in 'a'. Or, in Figure 2 As shown in the image (b), in response to a trigger action on the multitasking icon, the electronic device can also return to its previous state. Figure 1 The interface shown in Figure 'a'.

[0107] However, in possible implementations, in the case of... Figure 1 The interface shown in 'a' will switch to... Figure 1 During the process shown in b on the interface, the electronic device may encounter the following problem scenarios, such as Figure 3 As shown:

[0108] exist Figure 3 In the interface shown, the electronic device can simultaneously display the dock 101 and the taskbar window 301. The taskbar window 301 can be understood as the initial taskbar window, while the taskbar window 104 can be understood as the taskbar window that has entered multitasking mode. The taskbar window 301 is located above the dock 101. It can be seen that the taskbar window 301 partially covers the dock 101, but it does not completely cover it. This results in the user seeing the taskbar window 301 and the dock 101 overlapping during the transition from the dock 101 to the taskbar window 301, reducing the smoothness and continuity of the transition and thus affecting the user experience.

[0109] The following is combined Figure 4 This section explains the cause of the problem that occurs when switching between taskbar window 104 and dock 101, such as... Figure 4 As shown:

[0110] exist Figure 4 middle, Figure 4 Figure a in the diagram can correspond to Figure 1 The interface shown in Figure 'a'; Figure 4 The b-graph in the text can correspond to Figure 3 The interface shown; Figure 4 The c-graph in the text can correspond to Figure 1 The interface shown in b is shown in the image.

[0111] In normal mode, the electronic device can display Figure 4 Figure a shows the dock bar 101. The dock bar can be divided into two parts: multiple application icons in the left area (e.g., 7 icons in the left area) can be fixed application icons, and one or more application icons in the right area (e.g., 1 icon in the right area) can be intelligently recommended application icons, which can change according to the user's usage frequency and habits.

[0112] When a trigger operation is received in the dock 101 for the multitasking icon 103, the electronic device can bring up the taskbar window 301, which is located above the dock 101, such as... Figure 4 Figure b in the diagram.

[0113] It is understandable that the taskbar window 301 has the same layout as the dock 101; for example, the left area of ​​taskbar window 301 includes 7 icons, and the right area includes 1 icon; the specific icons are the same as... Figure 4 The icon of dock bar 101 in Figure a is the same. However, the length of taskbar window 301 is less than the length of dock bar 101, and the height of taskbar window 301 is less than the length of dock bar 101. That is, the initial taskbar window can be seen as a smaller version of dock bar in terms of visual effect (the visual effect is similar, but the taskbar window and dock bar are different in substance).

[0114] The electronic device initially displays a minimized taskbar window 301 because, after switching from dock 101 to taskbar window 104, to conform to user habits, the electronic device can display all icons from dock 101 in taskbar window 104, with the icons in the same order and number. However, for multitasking mode, the electronic device needs to display icons specific to this mode, such as the multi-window template icon 106 and the application list icon 107. In other words, the number of icons to be displayed in taskbar window 104 is greater than the number of icons in dock 101.

[0115] For the desktop of electronic devices, to improve cleanliness and aesthetics, multiple icons in the dock 101 can be evenly distributed horizontally at the bottom of the interface, with preset distances between the sides and the screen edges. When switching to the taskbar window 104, the preset distances on both sides are insufficient to accommodate adding two more icons; or, after adding two icons, the taskbar window 104 becomes too close to the screen edges, affecting aesthetics. Therefore, when adding icons is necessary, the taskbar window 104 can display more icons by reducing their size. Correspondingly, the icon size in the taskbar window 301 is smaller than the icon size in the dock 101, and the length and width of the taskbar window 301 are both smaller than the length and width of the dock 101.

[0116] Understandably, when entering multitasking mode, the electronic device can calculate the icon size based on the number of icons. For example, if taskbar window 104 contains 10 icons, the icon size in taskbar window 104 is smaller than the icon size in dock 101. The electronic device can use the icon size of taskbar window 104 to draw and render the icons in taskbar window 301, so initially taskbar window 301 is smaller than dock 101.

[0117] See also Figure 4 After entering multi-tasking mode, the taskbar window 301 gradually extends, and a multi-window template icon 106 and an application list icon 107 are added, thus creating the taskbar window 104, as shown below. Figure 4 As shown in Figure c.

[0118] Therefore, during the above switching process, the initial taskbar window 301 cannot completely cover the dock bar 101, resulting in the taskbar window 301 and the dock bar 101 overlapping, with the taskbar window 301 floating on top of the dock bar 101.

[0119] In view of this, this application provides an interface display method. After triggering the multi-task scheduling icon, the electronic device can first execute an animation of adding icons; then, after hiding the view of the dock, an animation of shrinking icons is displayed. Specifically, in the initial stage, the electronic device brings up the taskbar window, and the icon size in the taskbar window is the same as the icon size in the dock; subsequently, as icons are added, the number of icons in the taskbar window exceeds the number of icons in the dock, meaning that the taskbar window after adding icons can completely cover the dock; then, the view of the dock is hidden; at this time, the taskbar window is shrunk, and the height of the shrunk taskbar window may be smaller than the height of the dock, but the dock is invisible after being hidden. In this way, during the process of switching from the dock to the taskbar window, the taskbar window can completely cover the dock, thereby reducing the aforementioned problem of overlap between the taskbar window and the dock.

[0120] Let's combine the following... Figure 5 The application scenarios of the interface display method provided in the embodiments of this application will be described.

[0121] To facilitate the description of the changes in the dock and taskbar windows, Figure 5 Taking the bottom area of ​​an electronic device as an example, the scenario of entering the multi-task scheduling mode in this application embodiment will be described, for example:

[0122] In this embodiment, the process of switching from the dock to the taskbar window can be divided into five stages. For example, at the first moment, the electronic device displays the dock bar 501, such as... Figure 5 The interface shown in Figure 'a'. At the second moment, the electronic device displays taskbar window 502, as shown... Figure 5 The interface shown in b is as follows. At the third moment, the electronic device displays taskbar window 503, as shown... Figure 5 The interface shown in c is as follows. At the fourth moment, the electronic device displays taskbar window 504, as shown... Figure 5 The interface shown in d is as follows. At the fifth moment, the electronic device displays taskbar window 505, as shown... Figure 5 The interface shown in Figure 'e' is illustrated below. A detailed explanation is provided with reference to the accompanying diagram.

[0123] See Figure 5 In the interface shown as 'a', at the first moment, the electronic device displays the dock bar 501, which may include a multi-task scheduling icon 103. The dock bar 501 can be referenced... Figure 1 The description of dock bar 101 in the interface shown in 'a' will not be repeated here.

[0124] The electronic device receives a trigger operation for the multitasking scheduling icon 103; in response to the trigger operation, the electronic device enters the second moment.

[0125] See Figure 5 In the interface shown as b, at the second moment, in response to a trigger operation on the multitasking icon 103, the electronic device can display a taskbar window 502. The taskbar window 502 is located above the dock 101, and its size is the same as the dock 101; that is, the length and height of the taskbar window 502 are the same as the dock 101, allowing it to completely cover the dock 101. Furthermore, the icon types and number in the taskbar window 502 are the same as those in the dock 101. This design ensures that when the taskbar window 502 is invoked, the visual effect provided to the user is the same as that of the dock 101, guaranteeing a smooth switching process.

[0126] See also Figure 5 In the interface shown in Figure c, at the third moment, the electronic device displays an animation of adding icons to the taskbar window. For example, the electronic device displays taskbar window 503. Based on taskbar window 502, taskbar window 503 maintains the same height but increases in length.

[0127] As the length increases, the taskbar window 503 can gradually display the multi-window template icon 106 and application list icon 107 to be added. The electronic device can set different animation effects for the icons to be added.

[0128] In one possible implementation, when the icon to be added is located at the first or last icon position in the taskbar window, the positions of the existing icons and the icon to be added in the taskbar window are both fixed. Subsequently, the taskbar window begins to expand smoothly, and the growing area gradually displays the icon to be added.

[0129] For example, the icon to be added is application list icon 107, which is located at the last icon position in the taskbar window 503. The taskbar window 503 extends to the right; during the extension, the positions of icon 506 and application list icon 107 remain unchanged; as the right edge of the taskbar window 503 extends to the right, the icon content displayed by application list icon 107 in the taskbar window 503 gradually increases until application list icon 107 is fully displayed.

[0130] In another possible implementation, if the icon to be added is not located at the edge of the taskbar window, the positions of some icons in the taskbar window and the position of the icon to be added are both fixed. Then, the existing icons that overlap with the icon to be added are translated in the direction of the taskbar window extension, thereby gradually displaying the icon to be added. The existing icons are located on top of the icon to be added.

[0131] For example, the icon to be added is multi-window template icon 106, which is located in the second icon position in taskbar window 503. In taskbar window 502, the existing icon in the same position can be multi-task scheduling icon 103. That is to say, when taskbar window 502 does not display the animation of adding the icon, the position of multi-task scheduling icon 103 overlaps with the position of multi-window template icon 106, and multi-task scheduling icon 103 is on top of multi-window template icon 106.

[0132] It should be noted that the multi-task scheduling icon 103 and the multi-task scheduling icon 507 can be the same icon. Here, to easily distinguish between icons that are moving and icons that are in a fixed position, there are some differences in icon style. Therefore, multi-task scheduling icon 103 is used to define icons in a fixed position, and multi-task scheduling icon 507 is used to define icons that are moving.

[0133] When the taskbar window 503 displays the animation of adding an icon, the left edge of the taskbar window 503 gradually extends to the left, and the multitasking icon 507 moves to the left accordingly. The distance between the multitasking icon 507 and the left edge is fixed, and the position of the multi-window template icon 106 is also fixed. In this way, as the multitasking icon 507 moves to the left, the taskbar window 503 can gradually display the multi-window template icon 106 below the multitasking icon 507, until the multitasking icon 507 and the multi-window template icon 106 no longer overlap.

[0134] Alternatively, electronic devices may use other animations to achieve the purpose of adding icons to the taskbar window.

[0135] Optionally, during icon movement, the electronic device may not support quickly launching the corresponding application or application function based on the icon. For example, the multitasking scheduler icon 507 may be unavailable while moving to the left. The electronic device may highlight the multitasking scheduler icon 507, for example, by blurring it, adding a mask, displaying the default icon, or changing the icon color.

[0136] After the electronic device displays the above-mentioned animation of adding icons, the electronic device may display the taskbar window 504 after adding one or more icons.

[0137] See Figure 5 As shown in d, at the fourth moment, the electronic device can display taskbar window 504. The number of icons in taskbar window 504 is greater than the number of icons in taskbar window 502, and the size of the icons in taskbar window 504 is the same as the size of the icons in taskbar window 502. Newly added multi-window template icon 106 and application list icon 107 can be displayed in taskbar window 504.

[0138] It is understandable that during the second to fourth time points, the taskbar window is located above dock 101, and since the length and height of the taskbar window are both greater than the length and height of the dock, the taskbar window can cover dock 101 during this process.

[0139] Then, the electronic device can shrink the taskbar window to fit the screen length of the electronic device.

[0140] See Figure 5In the interface shown as 'e', ​​at the fifth moment, the electronic device can display taskbar window 505. The length of taskbar window 505 is less than the length of taskbar window 504; and the height of taskbar window 505 is less than the height of taskbar window 504. Furthermore, the icon sizes in taskbar window 505 are smaller than the icon sizes in taskbar window 504. For example, the taskbar window and its icon sizes are scaled down proportionally; the scaling ratio of taskbar window 505 to taskbar window 504, and the scaling ratio of icon sizes in taskbar window 505 to icon sizes in taskbar window 504 are the same.

[0141] Optionally, electronic devices may only reduce the length of the taskbar window, without affecting its height. For example, the length of taskbar window 505 may be less than the length of taskbar window 504, and the height of taskbar window 505 may be equal to the height of taskbar window 504.

[0142] Optionally, during the process of shrinking from taskbar window 504 to taskbar window 505, the electronic device can be set to shrink the taskbar window and icon size at a uniform speed; the electronic device can also be set to shrink the taskbar window and icon size at a non-uniform speed. This application embodiment does not impose any limitations on this.

[0143] Understandably, upon entering the fifth moment, the electronic device can display a shrinking animation for the taskbar window; however, the shrunk taskbar window may not completely cover the dock in height. Therefore, before displaying the shrinking animation for the taskbar window, the electronic device can set the dock's property to invisible. In other words, the electronic device can set the dock to invisible at any stage from the second to the fourth moment, and then maintain that invisible state. After the electronic device displays the shrinking animation, even if the height of the taskbar window 505 is less than the height of the dock, the dock is invisible, and the electronic device will not display the scenario where the taskbar window and dock partially overlap.

[0144] It should be noted that this application embodiment uses a landscape orientation of the electronic device as an example to illustrate the interface display method provided in this application embodiment. The electronic device can also be in portrait orientation, and the interface display method provided in this application embodiment is used in the same way. In addition, the boundary corresponding to the screen length mentioned in this application embodiment is parallel to the longer side of the taskbar window or dock; for example, if the electronic device is a tablet and the tablet is placed in landscape orientation, then the screen length is the length of the longer side of the screen boundary; when the tablet is placed in portrait orientation, the screen length is the length of the shorter side of the screen boundary. This application embodiment does not impose any limitations on this.

[0145] Now, electronic devices can switch from the dock to the taskbar window without the taskbar window failing to cover the dock during the switch. In addition, the smoothness and aesthetics of the switching process have been improved by adding icon animations and shrinking animations, thus enhancing the user experience.

[0146] The above describes the scenarios for entering multi-task scheduling mode. The following section will combine... Figure 6 The scenarios for exiting the multi-task scheduling mode in the embodiments of this application are described, such as... Figure 6 As shown:

[0147] In this embodiment, the process of switching from the taskbar window to the dock can also be divided into five stages. For example, at the sixth moment, the electronic device displays taskbar window 601, such as... Figure 6 The interface shown in Figure 'a'. At the seventh moment, the electronic device displays taskbar window 602, as shown... Figure 6 The interface shown in b is shown in the diagram. At the eighth moment, the electronic device displays taskbar window 603, as shown in the diagram. Figure 6 The interface shown in c is as follows. At the ninth moment, the electronic device displays taskbar window 604, as shown in... Figure 6 The interface shown in d is as follows. At the tenth moment, the electronic device displays taskbar window 605, as shown in... Figure 6 The interface shown in Figure 'e' is illustrated below. A detailed explanation is provided with reference to the accompanying diagram.

[0148] See Figure 6 In the interface shown as 'a', at the sixth moment, the electronic device can display a taskbar window 601. The taskbar window 601 may include multiple icons, including existing icons in the dock 101 and icons specific to the multitasking scheduling mode. The icon size in the taskbar window 601 is smaller than the icon size in the dock 101. The taskbar window 601 may include a multitasking scheduling icon 103. The taskbar window 601 is identical to the taskbar window 505, and will not be described again in this embodiment.

[0149] exist Figure 6 In the interface shown in Figure a, when a trigger operation is received for the multitasking scheduling icon 103, the electronic device can switch from the taskbar window to the dock.

[0150] See also Figure 6 In the interface shown in b, at the seventh moment, in response to the trigger operation on the multitasking scheduling icon 103, the electronic device can display a reduction icon animation in the taskbar window. For example, the electronic device displays taskbar window 602; based on taskbar window 601, the height of taskbar window 602 remains unchanged, but its length is reduced.

[0151] As the length decreases, the taskbar window 602 can gradually hide the icons to be reduced. These icons can be unique to multitasking modes, such as the multi-window template icon 106 and the application list icon 107. Electronic devices can be equipped with various animation effects for reducing icons.

[0152] In one possible implementation, if the unique icon is in the first or last icon position in the taskbar window, the positions of the existing icons and the unique icon in the taskbar window are fixed. Subsequently, the taskbar window begins to shrink smoothly, gradually hiding the unique icon by reducing the area.

[0153] For example, the unique icon is application list icon 107, which is located as the last icon in the taskbar window 602. The taskbar window 602 shrinks to the left; during this shrinking process, the positions of icon 606 and application list icon 107 remain unchanged; as the right edge of the taskbar window 602 shrinks to the left, the content displayed by application list icon 107 in the taskbar window 602 gradually decreases until application list icon 107 is completely hidden.

[0154] In another possible implementation, if the unique icon is not located at the edge of the taskbar window, the positions of some icons in the taskbar window and the unique icon are both fixed; then, the icons adjacent to the unique icon move in the contraction direction to hide the unique icon.

[0155] For example, the unique icon is the multi-window template icon 106, which is located in the second icon position in the taskbar window 602. When the left edge of the taskbar window shrinks to the right, the icons to the left of the multi-window template icon 106 (such as the multi-task scheduling icon 607) move to the right, and the multi-task scheduling icon 607 is located on top of the multi-window template icon 106.

[0156] When the taskbar window 602 displays the animation of decreasing icons, the left edge of the taskbar window 602 gradually shrinks to the right. The multitasking icon 607 moves accordingly to the right, with a fixed distance between the multitasking icon 607 and the left edge, and the position of the multi-window template icon 106 also fixed. Thus, as the multitasking icon 607 moves to the right, it can gradually cover the multi-window template icon 106 below it until the multitasking icon 607 and the multi-window template icon 106 completely overlap, and the multi-window template icon 106 is no longer displayed.

[0157] Alternatively, electronic devices may use other animations to reduce the number of icons in the taskbar window.

[0158] Optionally, during icon movement, the electronic device may not support quickly launching the corresponding application or application function based on the icon. For example, the multitasking scheduler icon 607 may be unavailable while it is moving to the right. The electronic device may highlight the multitasking scheduler icon 607, for example, by blurring it, adding a mask, displaying the default icon, or changing its color.

[0159] After the electronic device displays the above-mentioned animation of reducing icons, the electronic device can display taskbar window 603.

[0160] See Figure 6 In the interface shown in c, at the eighth moment, the electronic device can complete the animation of reducing icons and display taskbar window 603. The number of icons in taskbar window 603 is less than the number of icons in taskbar window 601, and the size of the icons in taskbar window 603 is the same as the size of the icons in taskbar window 601.

[0161] See also Figure 6 As shown in the interface d, at the ninth moment, the electronic device can display a magnification animation and show taskbar window 604. The length of taskbar window 604 is greater than the length of taskbar window 603; and the height of taskbar window 604 is greater than the height of taskbar window 603. Furthermore, the icon sizes in taskbar window 604 are larger than the icon sizes in taskbar window 603. For example, the taskbar window and its icon sizes are magnified proportionally; the magnification ratio of taskbar window 604 to taskbar window 603, and the magnification ratio of icon sizes in taskbar window 604 to icon sizes in taskbar window 603 are the same.

[0162] Optionally, electronic devices may only enlarge the length of the taskbar window, without adjusting the height. For example, the length of taskbar window 604 is greater than the length of taskbar window 603; and the height of taskbar window 604 is equal to the height of taskbar window 603.

[0163] See Figure 6 As shown in the interface 'e', ​​at the tenth moment, the electronic device can display dock bar 605.

[0164] Understandably, at the ninth moment, dock 605 is visible, and taskbar window 604 is also visible; however, taskbar window 604 is located above dock 605, and its size is the same as dock 605 (i.e., its length and height are the same). Taskbar window 604 completely covers dock 605, thus hiding dock 605. At the tenth moment, the electronic device can set the attribute of the upper-level taskbar window 604 to invisible, thus de-displaying taskbar window 604 and displaying the lower-level dock 101.

[0165] Now, electronic devices can switch from the taskbar window to the dock, and there will be no problem of the taskbar window not covering the dock during the switching process. In addition, the smoothness and aesthetics of the switching process are improved by reducing icon animations and enlargement animations, thus improving the user experience.

[0166] The above embodiment illustrates a method for exiting multi-task scheduling mode. During the switching process, the electronic device first executes a decrementing icon animation, followed by a zoom-in animation. It is understood that between the second and ninth time points, the electronic device can set the dock bar view to invisible. Therefore, when displaying the decrementing icon animation and the zoom-in animation, the electronic device will not display the dock bar view, thus avoiding the scenario where the taskbar window cannot cover the dock bar.

[0167] Therefore, when exiting multi-task scheduling mode, the electronic device can first execute the enlargement animation and then the reduction icon animation, without encountering the aforementioned problem scenario; this process can be, for example... Figure 5 The reverse display process of the interface will not be described again in this embodiment. This embodiment does not require the execution order of these two animation effects.

[0168] To better understand the embodiments of this application, the structure of the electronic device of this application is described below:

[0169] Figure 7A schematic diagram of the structure of electronic device 100 is shown. Electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, antenna 1, antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, a headphone jack 170D, a sensor module 180, buttons 190, a motor 191, an indicator 192, a camera 193, a display screen 194, a subscriber identification module (SIM) card interface 195, and an embedded secure element (eSE) chip 196, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, a barometric pressure sensor 180C, a magnetic sensor 180D, an accelerometer sensor 180E, a distance sensor 180F, a proximity sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, etc.

[0170] It is understood that the structures illustrated in the embodiments of this application do not constitute a specific limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may include more or fewer components than illustrated, or combine some components, or split some components, or have different component arrangements. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.

[0171] Processor 110 may include one or more processing units, such as application processors (APs), modem processors, graphics processing units (GPUs), image signal processors (ISPs), controllers, video codecs, digital signal processors (DSPs), baseband processors, and / or neural network processing units (NPUs). Different processing units may be independent devices or integrated into one or more processors. In this embodiment, processor 110 can be used to process processes related to interface display.

[0172] The electronic device 100 implements display functions through a GPU, a display screen 194, and an application processor. The display screen 194 is used to display images, videos, etc. In this embodiment, the display screen 194 can be used to display... Figure 5 The interface shown.

[0173] Internal memory 121 can be used to store computer executable program code, which includes instructions. Processor 110 executes applications and related data processing in the dock or taskbar window of electronic device 100 by running instructions stored in internal memory 121 and / or instructions stored in memory located in the processor.

[0174] Touch sensor 180K, also known as a "touch device," can be located on display screen 194. The touch sensor 180K and display screen 194 together form a touchscreen, also known as a "touchscreen." Touch sensor 180K detects touch operations applied to or near it. The touch sensor can transmit the detected touch operation to the application processor to determine the touch event type. Visual output related to the touch operation can be provided through display screen 194. In this embodiment, touch sensor 180K can sense user trigger operations on icons in the dock or taskbar window and display a normal mode interface or a multi-tasking mode interface through display screen 194.

[0175] The software system of electronic device 100 can adopt a layered architecture, event-driven architecture, microkernel architecture, microservice architecture, or cloud architecture, etc. This application embodiment uses the layered architecture Android system as an example to exemplify the software structure of electronic device 100.

[0176] Figure 8 This is a software structure block diagram of the electronic device 100 according to an embodiment of this application.

[0177] A layered architecture divides software into several layers, each with a clear role and function. Layers communicate with each other through software interfaces. In some embodiments, the Android system may include: an application layer, an application framework layer, a hardware abstraction layer (HAL), and a kernel layer, where the kernel layer may also be called the driver layer.

[0178] like Figure 8As shown, the application package can include desktop applications (launchers), video applications, note-taking applications, social applications, music applications, camera applications, and e-book applications. These application icons can be placed in the dock, main interface, taskbar window, and / or application list window. Users can launch the corresponding application or application function based on the application icon.

[0179] In this context, "launcher" refers to the desktop launcher of an electronic device. The desktop UI of an electronic device is collectively referred to as the launcher. The launcher can be used to display and manage other applications on the electronic device. For example, when an electronic device receives a trigger action on an application's icon on the desktop, the device can launch that application based on the launcher.

[0180] In this embodiment, the desktop application can be used to manage the dock and taskbar windows. Specifically, both the dock and taskbar windows can display multitasking icons, allowing the electronic device to enter or exit multitasking mode based on these icons. The taskbar window may also include multi-window template icons, enabling the electronic device to set the arrangement of multiple application windows in multitasking mode. The taskbar window may also include application list icons, allowing the electronic device to invoke an application list window to display more application icons supported by the device.

[0181] The application framework layer provides application programming interfaces (APIs) and a programming framework for applications in the application layer. The application framework layer includes some predefined functions.

[0182] like Figure 8 As shown, the application framework layer may include a window manager, content provider, notification manager, view system, resource manager, etc.

[0183] The window manager is used to manage windowed applications. It can retrieve screen size, determine the presence of a status bar, lock the screen, and capture screenshots, among other things.

[0184] Content providers store and retrieve data, making that data accessible to applications. This data can include videos, images, audio, phone calls made and received, browsing history and bookmarks, phone books, and more.

[0185] The notification manager allows applications to display notification information in the status bar. It can be used to convey informational messages and can disappear automatically after a short time without user interaction.

[0186] A view system includes visual controls, such as controls for displaying text and controls for displaying images. View systems can be used to build applications. A display interface can consist of one or more views. For example, a display interface including a text notification icon could include views for displaying text and views for displaying images.

[0187] The file explorer provides applications with various resources, such as localized strings, icons, images, layout files, video files, and more.

[0188] The Android Runtime consists of core libraries and a virtual machine. The Android runtime is responsible for the scheduling and management of the Android system.

[0189] The core library consists of two parts: one part is the functionalities that need to be called by the Java language, and the other part is the Android core library.

[0190] The application layer and application framework layer run in a virtual machine. The virtual machine executes the Java files of the application layer and application framework layer as binary files. The virtual machine is used to perform functions such as object lifecycle management, stack management, thread management, security and exception management, and garbage collection.

[0191] System libraries can include multiple functional modules. For example, a surface manager, media libraries, 3D graphics processing libraries (such as OpenGL ES), and 2D graphics engines (such as SGL).

[0192] The Surface Manager is used to manage the display subsystem and provides the blending of 2D and 3D layers for multiple applications.

[0193] The media library supports playback and recording of various common audio and video formats, as well as still image files. It supports multiple audio and video encoding formats, such as MPEG4, H.264, MP3, AAC, AMR, JPG, and PNG.

[0194] The 3D graphics processing library is used to implement 3D graphics drawing, image rendering, compositing, layer processing, etc.

[0195] A 2D graphics engine is a graphics engine for 2D drawing.

[0196] The kernel layer is the layer between hardware and software. The kernel layer contains at least the display driver, camera driver, audio driver, and sensor driver.

[0197] The following is combined Figure 9 The flow of the interface display method provided in the embodiments of this application will be described, such as... Figure 9 As shown:

[0198] S901, Electronic devices can be set to make the dock view visible and the taskbar window invisible.

[0199] After powering on, the electronic device can display, for example... Figure 1 The desktop shown in 'a' is an example. The desktop can include a dock view and a taskbar window; the dock is visible, but the taskbar window is not. See also... Figure 5 At the first moment, when the electronic device is in normal mode, the electronic device can display as follows: Figure 5 The interface shown in Figure 'a' includes a dock 501 and a taskbar window 502. Both are identical in size, with the taskbar window 502 positioned above the dock 501 and completely overlapping it. After setting the properties of the dock 501 and taskbar window 502, the electronic device can hide the upper taskbar window 502 and display the lower dock 501.

[0200] S902. Upon receiving a trigger operation for the multitasking scheduling icon 103, the electronic device can set the taskbar window to be visible.

[0201] This process can correspond to Figure 5 The second moment is shown. In response to a trigger operation on the multitasking scheduling icon 103, the electronic device can simultaneously display the dock bar 501 and the taskbar window 502. However, since the taskbar window 502 is located above the dock bar 501, therefore, as shown... Figure 5 As shown in interface b, the electronic device displays the upper taskbar window 502, while the lower dock bar 501 is obscured by the taskbar window 502 and cannot be displayed on the interface.

[0202] Setting the taskbar window to be visible on an electronic device can include: setting the taskbar view leash to be visible using a surface flinger. For example, the electronic device may acquire the rendering surface control of the taskbar view leash; create a transaction; and set the taskbar view leash's Surface Control to be shown via the transaction.

[0203] SurfaceControl is a class used to manage and control the surface of a window. An electronic device can return the surface control of the taskbar window by calling the getRenderSurfaceControl() function. A transaction can be an object used for batch processing of graphical surface operations. After creating a transaction, the electronic device can use the SurfaceUtil.show() function to add the display operation of the taskbar view leash's SurfaceControl to the transaction to display the SurfaceControl of the taskbar window. This allows the electronic device to set the taskbar window to be visible.

[0204] S903: Electronic devices display an animation of adding icons in the taskbar window.

[0205] This process can correspond to Figure 5 The third and fourth moments are shown. The electronic device can switch from taskbar window 502 to taskbar window 503, and then from taskbar window 503 to taskbar window 504.

[0206] The animation for adding icons includes adding a multi-window template icon 106 and an application list icon 107 to the taskbar window. As the electronic device displays the icon addition animation, the length of the taskbar window gradually increases while its height remains constant.

[0207] For example, taking the addition of animation effects to the icon 106 in the multi-window template as an example, electronic devices can control the movement of the icon by setting its translation attribute, so as to achieve the following: Figure 5 The effect shown in c is that the multitasking scheduling icon 507 is moved away from the top of the multi-window template icon 106 in the interface.

[0208] Specifically, the animation of adding an icon displayed on the taskbar window of the electronic device may include: obtaining the initial position (start X1) and the end position (end X1) of icon 1; setting the X1 value according to the playback progress of the adding icon animation, wherein the X1 value is positively correlated with the playback progress; and moving the position of icon 1 according to the X1 value.

[0209] Icon 1, for example, is a multitasking icon. The initial position of icon 1 can be the position of multitasking icon 103 in the taskbar window 502. The distance between the ending position of icon 1 and the initial position of icon 1 can be the icon size 1. Icon size 1 can be the icon size of a single icon in the dock 501. It should be understood that after icon 1 moves out of the position of one icon, it will not obscure the icons below it.

[0210] The playback progress can be the ratio of the current time of the animation to the completion time of the animation. The X1 value can be used to control the left and right movement of the icon; there is a mapping relationship between the X1 value and the playback progress of the animation. For example, if the icon size is 100 and the playback progress is 50%, the electronic device can obtain an X1 value of -50 according to the mapping relationship, where "50" is the movement distance and "-" is the direction; if the multitasking icon moves to the left, the X1 value will be negative.

[0211] After obtaining the X1 value, the electronic device can calculate the position of icon 1 based on start X1 and the X1 value, and draw icon 1 at that position to show the animation of icon 1 moving left and right until icon 1 moves to the end position of icon 1.

[0212] While controlling the movement of icon 1, the position of icon 2 (e.g., icon 106 in the multi-window template) remains unchanged. To enhance the aesthetics of the animation, the electronic device can set a fade-in animation for icon 2. For example, the electronic device can control the transparency of icon 2 by setting its transparency value using the alpha() function; the initial transparency value can be 0 to indicate that icon 2 is transparent; the final transparency value can be 1 to indicate that icon 2 is opaque.

[0213] The above embodiments illustrate the animation effects of the multi-task scheduling icon 507 and the multi-window template icon 106 in conjunction with icons 1 and 2. For the application list icon 107, the electronic device can be configured to gradually appear as the taskbar window expands to the right.

[0214] S904. The dock view of the electronic device is not visible.

[0215] It's understandable that when the taskbar window is shrunk so that its height is less than the dock's height, the taskbar window may not completely cover the dock, potentially causing partial overlap between the two. Therefore, before shrunk the taskbar window, the electronic device can be set to make the dock view invisible; this way, after the taskbar window is shrunk, the electronic device will not display the lower-level dock, thus avoiding the aforementioned problem.

[0216] Specifically, setting the dock view of an electronic device to be invisible can include setting the visibility property of the dock view (hot seatview) to the first property (invisible); the first property is used to indicate that the view is invisible and the layout controls of the view do not change.

[0217] A view's visibility properties can include a visible property and an invisible property. The visible property indicates that the electronic device should display the view; the invisible property indicates that the electronic device should hide the view. The invisible property can include a first property and a second property (gone); the second property indicates that the view is not visible and clears the view's layout controls.

[0218] In this embodiment, the dock area can be temporarily hidden while the electronic device is displaying the taskbar window. After switching back to normal mode, the electronic device still needs to display the dock, and the position of the dock on the screen, as well as the icon type and size, do not need to change. Therefore, the first attribute of the invisible property can be used to temporarily hide the dock view.

[0219] Optionally, in this application, the process of the interface display method is described by taking the sequential execution of steps S903 and S904 by an electronic device as an example. In practical applications, the electronic device can execute steps S903 and S904 after step S902; that is, step S904 can be executed before step S903 or simultaneously.

[0220] See Figure 5 In step S902, the electronic device can display a taskbar window 502 on top of the dock 501; the taskbar window 502 overlaps with the dock 501; therefore, after step S902, the electronic device can hide the dock without the user's awareness.

[0221] Furthermore, in this embodiment, step S904 is executed after step S902 because: if the dock bar view is set to be invisible first, and then the taskbar window is set to be visible, there may be a problem scenario where neither the dock bar nor the taskbar window is displayed in the interface, affecting the continuity of the switching process. Therefore, it is necessary to ensure that at least one of the taskbar window and the dock bar is displayed in the interface.

[0222] S905: Electronic devices display a shrinking animation in the taskbar window.

[0223] This process can correspond to Figure 5 The fifth moment is shown. After hiding the dock view, the electronic device can display taskbar window 505. The length and height of taskbar window 505 are both smaller than the length and height of taskbar window 504.

[0224] The following is combined Figure 10 This section explains the layout of the icons in the taskbar.

[0225] Specifically, the electronic device displays a shrinking animation in the taskbar window, including: for any icon in the taskbar window, calculating the shrunk icon size and position; shrinking the icon according to the shrunk icon size; and moving the icon according to the shrunk icon position.

[0226] The icon size shown in this application embodiment can be the size of the layout grid corresponding to the icon. See also Figure 10 , Figure 10 The view layouts of taskbar window 504 and taskbar window 505 are shown respectively. In the view layout of the taskbar window, multiple icons are arranged side by side in a grid with seamless borders, and the icons (such as dashed boxes) are displayed in the center of the grid.

[0227] The view layout parameters of the taskbar window 504 before shrinking can include values ​​of a, b, c, x, and n. The value of 'a' can be the screen length of the electronic device. The value of 'b' can be the distance between the left edge of the taskbar window 504 and the left edge of the electronic device's screen; it should be understood that, to improve the aesthetics of the interface, the taskbar window can be symmetrically set, and the distance between the right edge of the taskbar window 504 and the right edge of the electronic device's screen can also be the value of 'b'; the value of 'b' can be a preset value. The value of 'x' can be the size of the icon before shrinking, which is the same as the size of the icon in the dock. The value of 'd' is a preset value; it should be understood that, to facilitate the differentiation between persistent applications and intelligently recommended applications, the taskbar window can be divided into two areas for the two types of blank areas using the value of 'd'. The value of 'n' is the number of icons in the taskbar window 504, where n is a positive integer. For the i-th icon in the taskbar window 504 (i is a positive integer, and i is less than or equal to n), the electronic device can obtain the icon size and position of the i-th icon before shrinking based on the above parameters and the value of i.

[0228] The view layout parameters of the scaled-down taskbar window 505 may include values ​​for a, b', c', x', and n. The b' value can be the distance between the left edge of the taskbar window 505 and the left edge of the electronic device screen; it should be understood that the distance between the right edge of the taskbar window 505 and the right edge of the electronic device screen can also be a b' value; the b' value can be a preset value. The d' value is a preset value. The n value is the number of icons in the taskbar window 505, which is the same as the number of icons in the taskbar window 504. Based on the above parameters, the electronic device can obtain the scaled-down icon size and the scaled-down icon position. The x' value can be the scaled-down icon size, and the x' value satisfies the following formula:

[0229] x′=(a-2×b′-c′) / n′

[0230] The position of the shrunk icon can be, for example, the position (d) of the i-th icon at the left boundary, which can satisfy the following formula:

[0231] d = b′ + (i-1) × x′

[0232] The position of the scaled-down icon can be, for example, the position (d) of the i-th icon at the right boundary, which can satisfy the following formula:

[0233] d=b′+i×x′

[0234] Once the icon size and position before and after shrinking are obtained, electronic devices can display the shrinking animation by panning and scaling the icon.

[0235] For example, for the i-th icon, obtain the icon position before shrinking (start X). i ) and the position of the scaled-down icon (end X) i ); Set X according to the playback progress of the shrinking animation. i Value, X i The value is positively correlated with the playback progress; according to X i The value moves the position of the i-th icon until it reaches the position of the shrunk icon. It also obtains the icon size before shrinking (startvalue1) and the icon size after shrinking (endvalue1); and controls the i-th icon to shrink from its original size to its shrunk size based on the playback progress.

[0236] Where start value1 can be the actual size of the icon before shrinking, or the ratio of the shrinking icon, for example, a ratio of 1; end value1 can be the actual size of the icon after shrinking, or the ratio of the shrinking icon, for example, the ratio of x' to x. Wherein, start value1 is greater than end value1.

[0237] Specifically, the panning operation can be found in the description of icon panning in step S903, which will not be repeated here. When performing a zoom-out operation, the electronic device can call the scale() function to zoom out the icons, thereby achieving an animation effect of multiple icons zooming out and the window zooming out.

[0238] After the zoom-out animation is complete, the electronic device can display the taskbar window 505. At this point, the electronic device switches from normal mode to multitasking mode, and the switching process avoids the issue of the dock and taskbar window appearing simultaneously on the screen, improving the smoothness of the transition and enhancing the user experience.

[0239] The above embodiments illustrate the process of entering the multi-task scheduling mode. The following describes the process in conjunction with... Figure 11 The process of exiting the multi-task scheduling mode in the interface display method provided in the embodiments of this application will be described, such as... Figure 11 As shown:

[0240] Before an electronic device exits multitasking mode, the dock icon can be invisible, while the taskbar window can be visible. This process can correspond to... Figure 6 At the sixth moment shown, the electronic device displays as follows Figure 6 When the user uses the interface shown in Figure 'a', the user should adopt the following... Figure 2 The illustrated operation flow manipulates the electronic device to display multiple application windows in a multi-tasking scheduling mode. Subsequently, the electronic device can execute steps S1101-S1104:

[0241] S1101. Upon receiving another trigger operation for the multitasking scheduling icon 103, the electronic device displays a motion effect that reduces the size of the icon in the taskbar window.

[0242] This process can correspond to Figure 6 The seventh and eighth moments are shown. In response to another trigger operation on the multitasking scheduling icon 103, the electronic device can display a reduction icon animation. For example, in Figure 6 As shown in the interface 'a', a trigger operation is received for the multi-task scheduling icon 103. The electronic device's display changes from taskbar window 601 to taskbar window 602, and then from taskbar window 602 to taskbar window 603. The number of icons in taskbar window 603 is less than the number of icons in taskbar window 601, and the size of the icons in taskbar window 603 is equal to the size of the icons in taskbar window 601.

[0243] The icon reduction animation includes clearing the multi-window template icon 106 and the application list icon 107 from the taskbar window. During the icon reduction animation on the electronic device, the length of the taskbar window gradually decreases while its height remains constant.

[0244] For example, taking reducing icon animations as an example, specifically reducing the animations of icon 106 in a multi-window template, electronic devices can control icon movement by setting the icon's translation attribute to achieve, as shown in the example... Figure 6 The effect shown in b is that the multi-task scheduling icon 607 gradually covers the multi-window template icon 106 in the interface.

[0245] Specifically, the animation of decreasing icons displayed on the taskbar window by the electronic device may include: obtaining the initial position (start X2) and the end position (end X2) of icon 3; setting the X2 value according to the playback progress of the decreasing icon animation, wherein the X2 value is positively correlated with the playback progress; and moving the position of icon 3 according to the X2 value.

[0246] Icon 3, for example, is a multitasking icon. The initial position of icon 3 can be the position of multitasking icon 103 in taskbar window 601. The distance between the ending position of icon 3 and its initial position can be the icon size 2, which can be the size of a single icon in taskbar window 505, for example, x'. It should be understood that once icon 3 moves into the position of an icon, it will obscure the icon below it.

[0247] The X2 value can be used to control the left and right movement of the icon; the direction indicated by X2 is opposite to the direction indicated by X1; there is a mapping relationship between the X2 value and the playback progress of the animation. For example, if the icon size is 100 and the playback progress is 50%, the electronic device can obtain an X2 value of +50 according to the mapping relationship, where "50" is the movement distance and "+" is the direction; if the multitasking icon moves to the right, the X2 value is positive. It should be noted that, for ease of explanation, the "+" is marked when introducing X2 here, but in actual applications, X2 may not include the "+".

[0248] After obtaining the X2 value, the electronic device can calculate the position of icon 3 based on start X2 and the X2 value, and draw icon 3 at that position to show the animation of icon 3 moving left and right until icon 3 moves to the end position of icon 3.

[0249] While controlling the movement of icon 3, the position of icon 4 (e.g., icon 106 in the multi-window template) remains unchanged. To enhance the aesthetics of the animation, electronic devices can set a fade-out effect for icon 4. For example, electronic devices can control the transparency of icon 4 by setting its transparency value using the alpha() function; the initial transparency value can be 1 to indicate that icon 4 is opaque; the final transparency value can be 0 to indicate that icon 4 is transparent.

[0250] The above embodiments illustrate the animation effects of the multi-task scheduling icon 607 and the multi-window template icon 106 in conjunction with icons 3 and 4. For the application list icon 107, the electronic device can be configured to gradually hide as the taskbar window shrinks to the left.

[0251] S1102. Electronic devices display a magnified animation effect in the taskbar.

[0252] This process can correspond to Figure 6 The ninth moment is shown. After the zoom-in animation, the electronic device can switch from taskbar window 603 to taskbar window 604.

[0253] Specifically, the electronic device displays a magnified animation in the taskbar window, including: for any icon in the taskbar window, calculating the magnified icon size and position; magnifying the icon according to the magnified icon size; and moving the icon according to the magnified icon position.

[0254] After obtaining the icon size and position before and after magnification, the electronic device can display a magnified animation effect by performing panning and magnification operations on the icon. The calculation process for the icon size and position before magnification can be referenced to the icon size and position before and after shrinking shown in step S905, and will not be described in detail in this embodiment.

[0255] For example, for the j-th icon, we obtain the icon's position before zooming in (start X). j ) and the position of the enlarged icon (end X) j ); Set X according to the playback progress of the magnification animation. j Value, X j The value is positively correlated with the playback progress; according to X j The value is moved to the position of the j-th icon until it reaches the position of the enlarged icon. Also, the size of the icon before enlargement (startvalue2) and the size of the icon after enlargement (endvalue2) are obtained; the size of the j-th icon is controlled to increase from the size before enlargement to the size after enlargement based on the playback progress.

[0256] Where start value2 can be the actual size of the icon before enlargement, or it can be a ratio of the icon before enlargement, for example, a ratio of 1; end value2 can be the actual size of the icon after enlargement, or it can be a ratio of the icon after enlargement, for example, the ratio of x to x'. Where start value2 is less than end value2.

[0257] Specifically, the translation operation can be found in the description of icon translation in step S903, which will not be repeated here. When performing the zoom-in operation, the electronic device can call the scale() function to zoom in on the icons, thereby achieving the animation effect of zooming in on multiple icons and the window.

[0258] After the enlargement animation is completed, the electronic device may display taskbar window 604.

[0259] Optionally, in this embodiment, the enlargement animation can be displayed first, followed by the reduction animation; that is, step S1102 can be executed first, followed by step S1101. This embodiment does not limit this.

[0260] S1103, The dock view of the electronic device is now visible.

[0261] In step S1102, the taskbar window 604 is visible, while the dock view is not visible; the size of the taskbar window 604 is the same as the size of the dock.

[0262] In step S1103, the electronic device can set the dock view to be visible, and the taskbar window 604 remains visible. Since the taskbar window 604 is located above the dock and both are the same size, after setting the dock view to be visible, the taskbar 604 can cover the dock area, and the electronic device will still not display the dock. For example, the electronic device continues to display... Figure 6 The interface shown in d is shown in the image.

[0263] Specifically, setting the dock view to be visible on an electronic device can include setting the visibility property of the dock view (hot seat view) to the visible property.

[0264] S1104. The taskbar window for electronic device settings is not visible.

[0265] This process can correspond to Figure 6 The tenth moment is shown. The electronic device hides the upper taskbar window 604 and displays the lower dock.

[0266] Setting the taskbar window to be invisible on an electronic device can include: setting the display state of the taskbar view leash to invisible via a surface flinger. For example, the electronic device acquires the SurfaceControl of the taskbar view leash; and sets the SurfaceControl of the taskbar view leash to be hidden.

[0267] Electronic devices can return the surface control of the taskbar window by calling the `getRenderSurfaceControl()` function. Electronic devices can use the `SurfaceUtil.show()` function to add a hide operation to the taskbar view leash's SurfaceControl, thereby hiding the taskbar window's SurfaceControl. This allows electronic devices to make the taskbar window invisible.

[0268] It is understood that in this embodiment of the application, the electronic device may execute step S1103 first and then step S1104 because: if the taskbar window is set to be invisible first and then the dock bar is set to be visible, there may be a problem scenario where neither the dock bar nor the taskbar window is displayed in the interface, which will affect the continuity of the switching process. Therefore, it is necessary to ensure that at least one of the taskbar window and the dock bar is displayed in the interface.

[0269] At this point, the electronic device switches back from multitasking mode to normal mode without the issue of the dock and taskbar windows appearing on the screen simultaneously, improving the smoothness of the switching process and enhancing the user experience.

[0270] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, data stored, data displayed, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties. Furthermore, the collection, use and processing of the relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions, and corresponding operation portals are provided for users to choose to authorize or refuse.

[0271] The interface display method of the present application embodiments has been described above. The apparatus for performing the above interface display method provided in the present application embodiments will now be described. Those skilled in the art will understand that the methods and apparatus can be combined with and referenced by each other, and the related apparatus provided in the present application embodiments can perform the steps in the above interface display method.

[0272] like Figure 12 As shown, the interface display device 1200 can be used in communication equipment, circuits, hardware components, or chips. The interface display device includes a display unit 1201 and a processing unit 1202. The display unit 1201 supports the display steps performed by the interface display device 1200; the processing unit 1202 supports the information processing steps performed by the interface display device 1200.

[0273] In a possible implementation, the interface display device 1200 may also include a communication unit 1203. Specifically, the communication unit is used to support the interface display device 1200 in performing data transmission and data reception steps. The communication unit 1203 may be an input or output interface, pins, or circuits, etc.

[0274] In a possible embodiment, the interface display device may further include a storage unit 1204. The processing unit 1202 and the storage unit 1204 are connected via a line. The storage unit 1204 may include one or more memories, which may be devices in one or more devices or circuits used for storing programs or data. The storage unit 1204 may exist independently and be connected to the processing unit 1202 of the interface display device via a communication line. Alternatively, the storage unit 1204 may be integrated with the processing unit 1202.

[0275] Storage unit 1204 may store computer-executable instructions for the methods in the terminal device, so that processing unit 1202 executes the methods in the above embodiments. Storage unit 1204 may be a register, cache, or RAM, etc., and storage unit 1204 may be integrated with processing unit 1202. Storage unit 1204 may be a read-only memory (ROM) or other types of static storage devices capable of storing static information and instructions, and storage unit 1204 may be independent of processing unit 1202.

[0276] The interface display method provided in this application can be applied to electronic devices with communication functions. Electronic devices include electronic devices in general; the specific device form of an electronic device can be referred to the above-described related information, and will not be repeated here.

[0277] This application provides an electronic device, which includes a processor and a memory; the memory stores computer-executable instructions; the processor executes the computer-executable instructions stored in the memory, causing the electronic device to perform the above-described method.

[0278] This application provides a chip system including at least one processor and a communication interface. The communication interface and the at least one processor are interconnected via a circuit. The at least one processor is used to run computer programs or instructions to execute the above-described method. Its implementation principle and technical effects are similar to the related embodiments described above, and will not be repeated here.

[0279] This application also provides a computer-readable storage medium. The computer-readable storage medium stores a computer program. When the computer program is executed by a processor, it implements the methods described above. The methods described in the above embodiments can be implemented wholly or partially by software, hardware, firmware, or any combination thereof. If implemented in software, the functionality can be stored as one or more instructions or code on or transmitted over the computer-readable medium. The computer-readable medium can include computer storage media and communication media, and can also include any medium that can transfer a computer program from one place to another. The storage medium can be any target medium accessible by a computer.

[0280] In one possible implementation, a computer-readable medium may include RAM, ROM, compact disc read-only memory (CD-ROM) or other optical disc storage, disk storage or other magnetic storage devices, or any other medium targeted to carry or to store the required program code in the form of instructions or data structures, and accessible by a computer. Furthermore, any connection is appropriately referred to as a computer-readable medium. For example, if software is transmitted from a website, server, or other remote source using coaxial cable, fiber optic cable, twisted pair, DSL, or wireless technologies such as infrared, radio, and microwave, then coaxial cable, fiber optic cable, twisted pair, DSL, or wireless technologies such as infrared, radio, and microwave are included in the definition of medium. As used herein, disks and optical discs include optical discs, laser discs, optical discs, Digital Versatile Discs (DVDs), floppy disks, and Blu-ray discs, where disks typically reproduce data magnetically, while optical discs optically reproduce data using lasers. Combinations of the above should also be included within the scope of computer-readable media.

[0281] This application provides a computer program product, which includes a computer program that, when run, causes a computer to perform the above-described method.

[0282] This application describes embodiments of methods, apparatus (systems), and computer program products according to embodiments of this application with reference to flowchart illustrations and / or block diagrams. It should be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processing unit of a general-purpose computer, special-purpose computer, embedded processor, or other programmable device to produce a machine, such that the instructions, which execute via the processing unit of the computer or other programmable data processing device, generate instructions for implementing the flowchart illustrations. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0283] The above specific embodiments further illustrate the purpose, technical solution, and beneficial effects of the present invention. It should be understood that the above are merely specific embodiments of the present invention and are not intended to limit the scope of protection of the present invention. Any modifications, equivalent substitutions, improvements, etc., made on the basis of the technical solution of the present invention should be included within the scope of protection of the present invention.

Claims

1. An interface display method characterized by, The application is applied to an electronic device, comprising: displaying a dock bar in a desktop of the electronic device, the dock bar comprising a first control and a plurality of icons; in response to a triggering operation on the first control, displaying a first-stage window; the first-stage window is located above the dock bar, and the first-stage window covers the dock bar; the first-stage window comprises the first control and the plurality of icons of the dock bar, the length of the first-stage window is greater than or equal to the length of the dock bar, and the height of the first-stage window is greater than or equal to the height of the dock bar; displaying a second-stage window; the second-stage window is displayed after the first-stage window; the length of the second-stage window is greater than the length of the first-stage window, the height of the second-stage window is equal to the height of the first-stage window, and the number of icons in the second-stage window is greater than the number of icons in the first-stage window; displaying a third-stage window; the third-stage window is displayed after the second-stage window; the length of the third-stage window is less than the length of the second-stage window, the height of the third-stage window is less than the height of the second-stage window, and the number of icons in the third-stage window is equal to the number of icons in the second-stage window; wherein, during the display of the third-stage window, the electronic device hides the dock bar.

2. The method of claim 1, wherein, the number of icons in the first-stage window is equal to the number of icons in the dock bar, the icon size in the first-stage window is equal to the icon size in the dock bar, the icon size in the second-stage window is equal to the icon size in the first-stage window, and the icon size in the third-stage window is less than the icon size in the third-stage window.

3. The method of claim 1, wherein, the display of the third-stage window comprises: displaying a first animation in the third-stage window, the first animation being used to indicate the reduction of the third-stage window; wherein, the view of the dock bar is in an invisible state, and the view of the third-stage window is in a visible state.

4. The method of claim 3, wherein, the display of the first animation in the third-stage window comprises: for any icon in the third-stage window, obtaining a first position, a second position, a first icon size and a second icon size of the icon; the first position is the position of the icon in the third-stage window before the display of the first animation, the second position is the position of the icon in the third-stage window after the completion of the display of the first animation, the first icon size is the size of the icon before the display of the first animation, and the second icon size is the size of the icon after the completion of the display of the first animation; translating the icon from the first position to the second position while reducing the icon from the first icon size to the second icon size.

5. The method of claim 1, wherein, In the process of displaying the dock bar, the view of the dock bar is in a visible state, and the view of the first-stage window is in an invisible state; The first-stage window is displayed, including: The view of the first-stage window is set to a visible state, and the view of the dock bar remains in the visible state.

6. The method of claim 1, wherein, The second-stage window is displayed, including: The second-stage window displays a second dynamic effect, which is used to indicate that a first icon and a second icon are added in the second-stage window, and the first icon and the second icon are both associated with the function of the first control.

7. The method of claim 6, wherein, The second-stage window displays a second dynamic effect, including: The third position and the fourth position of the first control are obtained; the third position is the position of the first control in the second-stage window before the second dynamic effect is displayed, and the fourth position is the position of the first control in the second-stage window after the second dynamic effect is displayed; The first control is translated from the third position to the fourth position; during the translation of the first control, the third position also fixedly displays the first icon, the transparency of the first icon gradually decreases, and the first icon is located below the first control.

8. The method of claim 6, wherein, The second-stage window displays a second dynamic effect, and further includes: The second-stage window is controlled to expand in a first direction, and the second icon is gradually displayed with the expansion of the second-stage window; the first direction includes the left side or the right side.

9. The method of claim 1, wherein, The dock bar includes an icon of a first application, and after the dock bar is displayed on the desktop of the electronic device, the method further includes: In response to a triggering operation on the icon of the first application, the electronic device displays page content of the first application in full screen; The third-stage window includes the icon of the first application, and after the third-stage window is displayed, the method further includes: In response to a triggering operation on the icon of the first application, the electronic device displays page content of the first application in the form of a floating window.

10. The method of claim 1, wherein, After the third-stage window is displayed, the method further includes: In response to a triggering operation on the first control, a fourth-stage window is displayed; the fourth-stage window is a window displayed after the third-stage window; the length of the fourth-stage window is less than the length of the third-stage window, and the height of the fourth-stage window is equal to the height of the third-stage window; A fifth-stage window is displayed; the fifth-stage window is a window displayed after the fourth-stage window; the length of the fifth-stage window is greater than the length of the fourth-stage window, and the height of the fifth-stage window is greater than the height of the fourth-stage window; The dock bar is displayed, which is displayed in sequence with the fifth-stage window; the length of the dock bar is less than or equal to the length of the fifth-stage window, and the height of the dock bar is less than or equal to the height of the fifth-stage window.

11. The method of claim 10, wherein, The number of icons in the fourth stage window is less than the number of icons in the third stage window, and the size of the icons in the fourth stage window is equal to the size of the icons in the third stage window; the number of icons in the fifth stage window is equal to the number of icons in the fourth stage window, and the size of the icons in the fifth stage window is greater than the size of the icons in the fourth stage window; the number of icons in the dock bar is equal to the number of icons in the fifth stage window, and the size of the icons in the dock bar is equal to the size of the icons in the fifth stage window.

12. The method of claim 10, wherein, The fourth stage window is displayed, including: A third dynamic effect is displayed in the fourth stage window, and the third dynamic effect is used to indicate that the first icon and the second icon are deleted in the fourth stage window; the view of the dock bar remains in an invisible state, and the fourth stage window remains in a visible state.

13. The method of claim 12, wherein, The third dynamic effect is displayed in the fourth stage window, including: A fifth position and a sixth position of a first control are obtained; the fifth position is a position of the first control in the fourth stage window before the third dynamic effect is displayed, and the sixth position is a position of the first control in the fourth stage window after the third dynamic effect is displayed; the fifth position is the same as a fourth position; The first control is translated from the fifth position to the sixth position; during the translation of the first control, the sixth position also fixedly displays the first icon, the transparency of the first icon gradually increases, and the first icon is located below the first control.

14. The method of claim 12, wherein, The third dynamic effect is displayed in the fourth stage window, and the third dynamic effect is displayed in the fourth stage window, further including: The fourth stage window is controlled to shrink from a first direction boundary to a second direction, and the second icon is gradually hidden with the shrinking of the fourth stage window; the first direction includes left or right, and the second direction is opposite to the first direction.

15. The method of claim 10, wherein, The fifth stage window is displayed, including: A fourth dynamic effect is displayed in the fifth stage window, and the fourth dynamic effect is used to indicate that the fifth stage window is enlarged; wherein the view of the dock bar remains in an invisible state, and the view of the fifth stage window is in a visible state.

16. The method of claim 15, wherein, The fourth dynamic effect is displayed in the fifth stage window, including: For any icon in the fifth stage window, a seventh position, an eighth position, a third icon size and a fourth icon size of the icon are obtained; The icon is translated from the seventh position to the eighth position, and the icon is enlarged from the third icon size to the fourth icon size.

17. An electronic device, comprising: including: a processor and a memory; the memory stores computer execution instructions; the processor executes the computer execution instructions stored in the memory, so that the electronic device executes the method in any one of claims 1-16.

18. A computer-readable storage medium, the computer-readable storage medium storing a computer program, characterized in that, The computer program is executed by the processor to implement the method in any one of claims 1-16. The computer program is executed by the processor to implement the method in any one of claims 1-16.

19. A chip system, characterized by A computer program product comprising at least one processor and a communication interface, said communication interface and said at least one processor being interconnected by a line, said at least one processor being adapted to run computer programs or instructions to perform the method according to any one of claims 1 to 16.

20. A computer program product, characterised in that, A computer program, which when run causes a computer to perform the method according to any one of claims 1 to 16.

Citation Information

Patent Citations

  • Display method of dockbar in desktop and electronic equipment

    CN115729405A

  • Folding screen display method and electronic equipment

    CN117931332A