Display method and related equipment

Abstract

The embodiment of the invention provides a display method and related equipment. The method comprises the following steps: displaying a first interface, wherein the first interface comprises one or more elements; in response to a dragging operation of dragging a first element in the one or more elements, controlling the first element to move along a track of the dragging operation, and displaying a first window; under the condition that the first element moves to a first area of the electronic equipment, displaying an identifier of the first element in a first window; in response to the first operation, displaying a second window in the first interface; the second window comprises one or more elements added in the first window; in response to a second operation for the first element in the second window, displaying a second interface; the second interface comprises a display interface corresponding to the started first element. Therefore, the scene of starting the application program or service is enriched, the target application and / or the target service can be quickly started by using the panel, and the operation of searching the target application and the target card in a plurality of desktops by a user is simplified.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of terminals, and in particular to a display method and related device. BACKGROUND

[0002] Various services can be provided in an electronic device, for example, the electronic device can set multiple application programs, and based on the application programs, services such as communication, socializing, photographing, and payment can be provided for a user.

[0003] In a possible implementation, the number of application programs installed in the electronic device is large, and can occupy multiple desktops. In a case where the user wants to use a target application program, the user can have to flip through multiple desktops to find the target application program from among the multiple application programs. The user operation is cumbersome, and the user experience is affected. SUMMARY

[0004] Embodiments of the present application provide a display method and related device, which are applied to the technical field of terminals, and provide a method for quickly starting an application program or service, enrich the way of starting an application program or service, and improve the user experience.

[0005] In a first aspect, an embodiment of the present application provides a display method. The method comprises: displaying a first interface, the first interface comprising one or more elements; the elements comprising icons of application programs and / or cards of the application programs; in response to a drag operation of dragging a first element in the one or more elements, controlling the first element to move along a track of the drag operation, and displaying a first window; in a case where the first element moves to a first region of the electronic device, displaying an identifier of the first element in the first window; in response to a first operation, displaying a second window in the first interface; the second window comprising one or more elements added in the first window; in response to a second operation on a first element in the second window, displaying a second interface; the second interface comprising a display interface started by the first element.

[0006] Specifically, the first interface can be an interface capable of displaying icons of application programs or cards of application programs, for example, the first interface can correspond to a desktop as shown in a of FIG. 1A or a desktop as shown in a of FIG. 1B, and the first interface can also be a minus one screen, and the present application does not limit this. Figure 3 The icons of the application programs can be, for example, the icons in the regions 201 and 202 in the interface as shown in a of FIG. 1A; and the cards of the application programs can be, for example, the cards in the region 203 in the interface as shown in a of FIG. 1B. Figure 5 Figure 2 The first element can correspond to, for example, the icon in the region 201 in the interface as shown in a of FIG. 1A or the card in the region 203 in the interface as shown in a of FIG. 1B. Figure 2

[0007] The first element can correspond to, for example, the icon in the region 201 in the interface as shown in a of FIG. 1A or the card in the region 203 in the interface as shown in a of FIG. 1B. Figure 3 ​​the social application icon 301 in the interface shown in a of FIG. 6A; the first element moves along the trace of the drag operation, and reference can be made to the movement of the social application icon 301 in the interface shown in b of FIG. 6A. Figure 3 Figure 3 Figure 5 the contact card 501 in the interface shown in a of FIG. 6A; the first element moves along the trace of the drag operation, and reference can be made to the movement of the contact card 501 in the interface shown in b of FIG. 6A. Figure 5 Figure 5

[0008] It can be understood that when the touch object continuously acts on the social application icon 301 and the social application icon 301 moves, the electronic device can call out the flash capsule 302; the form of the first window can be, for example, the flash capsule 302. Alternatively, when the touch object continuously acts on the contact card 501 and the contact card 501 moves, the electronic device can call out the flash capsule 504; the form of the first window can be, for example, the flash capsule 504.

[0009] The first region can be, for example, the target region 303 in the interface shown in c of FIG. 6A; when the social application icon 301 enters the target region 303, the form of the first window can be changed from the flash capsule 302 to the flash capsule 304; after the touch object leaves the touch screen, the form of the first window can be changed from the flash capsule 304 to the flash capsule 305. The identification of the first element can include the identification in the flash capsule 304 and / or the identification in the flash capsule 305. Figure 3 Alternatively, the first region can be, for example, the target region 303 in the interface shown in c of FIG. 6A; when the contact card 501 enters the target region 303, the form of the first window can be changed from the flash capsule 504 to the flash capsule 505; after the touch object leaves the touch screen, the form of the first window can be changed from the flash capsule 505 to the flash capsule 506. The identification of the first element can include the identification in the flash capsule 505 and / or the identification in the flash capsule 506.

[0010] Figure 5 It can be understood that in actual applications, after the first element moves to the target region 303 and is released, the electronic device can display the flash capsule 304; the flash capsule 305 can also be displayed; reference can be made to the interface shown in c of FIG. 6A-Reference

[0011] Figure 3 Figure 3 The specific implementation of the identification in the first window is not limited by the embodiments of the present application.

[0012] So far, the electronic device can refer to Figure 3 or Figure 5 ​​​​​​​In the related scenario in the illustrated embodiment, after adding the icon and / or the card of the application to the panel, the icon and / or the card are added to the panel for subsequent use.

[0013] The first operation may, for example, be a downward sliding operation on the preset area 205; the second window may, for example, be the panel 206 in the interface shown in b of FIG. 12. Figure 2 In the interface shown in b of FIG. 12, after the social application icon is added to the flash capsule 305, the social application icon can be included in the panel 206.

[0014] The second operation may, for example, be a clicking operation. After the social application icon is clicked in the panel 206, the electronic device can display the display interface of the social application. The process can refer to the process of opening the calendar application or the weather card based on the panel 206 in the process shown in FIG. 13. Figure 2 The process can refer to the process of opening the calendar application or the weather card based on the panel 206 in the process shown in FIG. 13.

[0015] In this way, the scenario of starting an application or a service is enriched, and the user can quickly start a target application and / or a target service by using the panel 206, the operation of the user in searching for a target application and a target card in multiple desktops is simplified, and the use experience of the user is improved.

[0016] Optionally, after the second interface is displayed, the method further includes: in response to the first operation, displaying a second window in the second interface; the second window further includes a second element, the second element being different from the first element; in response to a second operation on the second element in the second window, displaying a third interface; the third interface includes a display interface corresponding to the second element.

[0017] The process can correspond to the scenario shown in FIG. 12. Figure 12 The second interface may, for example, be the interface shown in a of FIG. 12. Figure 12 The first operation may, for example, be a downward sliding operation on the preset area 205, and the second window may, for example, be the panel 206 in the interface shown in b of FIG. 12. Figure 12 The second element may, for example, be the e-book application icon 1201, and the third interface may, for example, be the interface shown in c of FIG. 12.

[0018] In this way, the electronic device can quickly enter other interfaces through the panel without exiting the display interface corresponding to the first element, so that quick switching between two application interfaces or service interfaces is realized, the operation of the user is simplified, and the use experience of the user is improved.

[0019] Optionally, after the second window is displayed in the second interface, the method further includes: in response to a third operation in the second window, displaying a third element in the second window without displaying the first element and the second element; the first element is different from the third element, and the second element is different from the third element.

[0020] The process can correspond to the scenario shown in FIG. 12. Figure 7 The third operation may, for example, be a sliding operation.Figure 7 The embodiments shown show a left-right sliding implementation of panel flipping; in addition, the electronic device can also implement panel flipping or scrolling display through up-down sliding. The embodiments of the present application do not limit this. For example, before flipping, the first element and the second element are displayed in the panel 206; after flipping, the third element is displayed in the panel 206, and the first element and the second element are not displayed.

[0021] In this way, the electronic device can add icons or cards of multiple application programs in the panel in the form of flipping, which can increase the use frequency of the panel 206, facilitate the user to quickly start the application program or service, and improve the user experience.

[0022] Optionally, after displaying the second window in the first interface, the method further includes: in response to a dragging operation of dragging the first element in the second window, controlling the first element to move along a track of the dragging operation; and in a case where the first element moves out of the second window, canceling display of the first element in the second window.

[0023] The process can correspond to Figure 9 or Figure 10 the scenario shown.

[0024] For example, the first interface can be, for example, the interface shown as a in Figure 9 ; the process of dragging the first element can be, for example, the movement process of the social application icon 703 in the interface shown as b in Figure 9 ; the first element moving out of the second window can be, for example, moving the social application icon 703 to the desktop; at this time, Figure 9 the social application icon 703 is no longer displayed in the panel 206 in the interface shown as d in Figure 9 .

[0025] For example, the first interface can be, for example, the interface shown as a in Figure 10 ; the process of dragging the first element can be, for example, the movement process of the social application icon 703 in the interface shown as b in Figure 10 ; the first element moving out of the second window can be, for example, moving the social application icon 703 to the desktop; at this time, Figure 10 the social application icon 703 is no longer displayed in the panel 206 in the interface shown as d in Figure 10 .

[0026] In this way, the electronic device can move the element in the panel 206 out of the panel 206, thereby deleting the element in the panel 206, which has the effect of tidying the panel 206; in addition, regularly updating the element in the panel 206 can increase the use probability of the panel 206 and improve the use effect of the user.

[0027] Optionally, when the first element is displayed in the second window, the first element is located in the first position of the second window, and the first element is also displayed in the second position of the first interface; the first position is different from the second position; when the first element is not displayed in the second window, the first element is displayed in the second position of the first interface; or, when the first element is not displayed in the second window, the first element is displayed in the third position of the first interface, and the first element is not displayed in the second position of the first interface; the third position is different from the second position.

[0028] This process can correspond to Figure 9 or Figure 10 The scene shown.

[0029] by Figure 9 For example, the second window displays the first element, which corresponds to... Figure 9 In the interface shown in 'a', the first position can be the location of social application icon 703, and the second position can be the location of social application icon 301. The second window can hide the first element accordingly. Figure 9 In the interface shown by d, the third position can be the location of the touched object when the drag operation ends, such as the location of the social application icon 903.

[0030] by Figure 10 For example, the second window displays the first element, which corresponds to... Figure 10 In the interface shown in 'a', the first position can be the location of social application icon 703, and the second position can be the location of social application icon 301. The second window can hide the first element accordingly. Figure 10 In the interface shown by d, after the drag-and-drop operation ends, the social application icons are released back to their original positions on the desktop, for example... Figure 10 The interface shown in 'a' is the same as... Figure 10 The position of the social application icon 301 in the interface shown by d is the same.

[0031] In this way, the electronic device can remove elements from panel 206, thereby deleting elements from panel 206 and tidying up panel 206; in addition, regularly updating the elements in panel 206 can increase the probability of using panel 206 and improve the user experience.

[0032] Optionally, after the second window is displayed in the first interface, the method further includes: displaying a delete control on top of the first element in response to a fourth operation on the first element in the second window; and de-displaying the first element in the second window in response to a trigger operation on the delete control.

[0033] This process can correspond to Figure 11 The scenario shown. The fourth operation can be a long press operation, and deleting the control can correspond to deleting control 1101.

[0034] In this way, the electronic device can delete the element in the panel 206, thereby tidying the panel 206; in addition, the electronic device can update the element in the panel 206 periodically, thereby improving the use probability of the panel 206 and improving the use effect of the user.

[0035] Optionally, the first element is located at the first position of the second window, and after the second window is displayed in the first interface, the method further includes: in response to a drag operation of dragging the first element in the second window, controlling the first element to move along a track of the drag operation; in a case where the first element moves to a fourth position in the second window, displaying the first element at the fourth position of the second window, and not displaying the first element at the first position of the second window.

[0036] The process can correspond to Figure 8 The first position can correspond to a position of the calendar application icon 208 in the interface shown in a of Figure 8 The fourth position can correspond to a position of the calendar application icon 208 in the interface shown in b of Figure 8

[0037] In this way, the electronic device can display the icon and / or card of the application program preferred by the user in front of other icons and / or cards according to the user operation, or display the icon and / or card of the application program preferred by the user at a position preferred by the user, so as to facilitate the user to quickly find and start the target application or the target service.

[0038] Optionally, the method further includes: displaying a fourth interface, the fourth interface including the second window; in a case where a trigger operation is received for the second region, canceling display of the second window in the fourth interface; the second region does not include a region where the second window is located; or in a case where a display time length of the second window is greater than or equal to a first preset time length and the electronic device does not receive the trigger operation, canceling display of the second window in the fourth interface.

[0039] The process can correspond to Figure 14 The fourth interface can be an interface in which icons and / or cards of application programs are displayed, such as a desktop, a negative one screen, and the like, or the fourth interface can be an interface of an application program and / or a service. For example, the fourth interface corresponds to the interface shown in a of Figure 14 For example, the second window can be the panel 206, and the second region can be a blank region in the interface shown in a of Figure 14

[0040] In this way, the electronic device can retract the panel when the user does not need to use the panel, thereby improving the simplicity of the interface.

[0041] ​​Optionally, in the case that the first element moves to the first area of the electronic device, displaying the identifier of the first element in the first window comprises: in the case that the first element moves to the first area of the electronic device, displaying a first identifier of the first element in the first window; the first identifier is used to indicate that the first element can be added to the first window; in the case that the time length of ending the dragging operation is less than or equal to the second preset time length, displaying a second identifier of the first element in the first window; the second identifier is used to indicate that the first element has been added to the first window; in the case that the time length of ending the dragging operation is greater than the second preset time length, canceling displaying the first window in the first interface; wherein the specification of the first window in which the identifier of the first element is not displayed is less than or equal to the specification of the first window in which the first identifier is displayed; the specification of the first window in which the first identifier is displayed is less than or equal to the specification of the first window in which the second identifier is displayed.

[0042] The process can correspond to Figures 3-6 the scenario shown in FIG. 1. Specifically, taking Figure 3 as an example, the first identifier of the first element can correspond to Figure 3 the add identifier 3041 and the add application identifier 3042 in the flash capsule 304 in the interface shown in c in FIG. 3; and the second identifier of the first element can correspond to Figure 3 the icon 3051 of the application and the added identifier 3052 in the flash capsule 305 in the interface shown in d in FIG. 3. Taking Figure 5 as an example, the first identifier of the first element can correspond to Figure 5 the add identifier 5051 and the add service identifier 5052 in the flash capsule 505 in the interface shown in c in FIG. 5; and the second identifier of the first element can correspond to Figure 5 the added card identifier 5061 and the added identifier 5062 in the flash capsule 305 in the interface shown in d in FIG. 5.

[0043] In this way, in the process of adding an application or a service to the panel, the user can intuitively know whether the icon or the card is dragged to the target area and whether it is successfully added.

[0044] Optionally, after displaying the second interface, the method further comprises: in response to the first operation, displaying a second window in the second interface; the second window further comprises a second element; in response to a second operation on the second element in the second window, displaying a third window and a fourth window; the third window displays part or all of the content in the second interface, and the fourth window displays part or all of the content in a display interface corresponding to the second element; wherein the third window and the fourth window are split-screen windows; or the third window is a full-screen window, and the fourth window is a floating window, the fourth window is located above the third window, and the specification of the fourth window is less than or equal to the specification of the third window.

[0045] The process can correspond toFigure 13 The scenario is shown. The first operation is, for example... Figure 13 The second operation is, for example, the swipe-down operation in the preset area 205 of the interface shown in Figure a; Figure 13 The operation of clicking the e-book application icon 1201 in the interface shown in b; the third window can be, for example... Figure 13 In the interface shown in c, the social application's split-screen window 1301, the fourth window can be, for example... Figure 13 The split-screen window 1302 of the e-book application in the interface shown in c is an example. Alternatively, a third window could be, for example... Figure 13 The fourth window, for example, is the full-screen window 1303 of the social application in the interface shown by d. Figure 13 The floating window 1304 of the e-book application in the interface shown in c.

[0046] In this way, electronic devices can use panel 206 to display multiple applications simultaneously in the form of floating windows and full-screen windows, reducing the switching process between application interfaces, simplifying user operation, and improving the user experience.

[0047] Optionally, during the dragging and moving of the first element, the first element is not displayed at the second position on the first screen. For example, in Figure 3 The interface shown in b and Figure 3 In the interface shown in 'c', the social application icon 301 is in a moving state, and it is temporarily not displayed in the position of the first icon in the second row on the desktop. Alternatively, for example, in... Figure 5 The interface shown in b and Figure 5 In the interface shown in c, contact card 501 is in a moved state, and it is not currently displayed in the position of the first card in the first row on the desktop. Alternatively, in... Figure 9 The interface shown in b and Figure 9 In the interface shown in c, the social application icon 703 is in a moving state, and the social application icon 301 is not temporarily displayed at the position of the dotted box 902 on the desktop. Alternatively, in... Figure 10 The interface shown in b and Figure 10 In the interface shown in c, the social application icon 703 is in a moving state, and the social application icon 301 is not currently displayed at the location of the dotted box 1002 on the desktop. Other icons will not be listed individually.

[0048] This reduces the repetitive appearance of application icons on the desktop; at the same time, it reduces the scenario where application icons jump from one position to another when the user releases their finger, making the process of adjusting the position of application icons smoother.

[0049] Optionally, it also includes: displaying a fifth interface, the fifth interface including a fifth window, the fifth window displaying information of a preset application or preset service; wherein the information of the preset application or preset service includes at least one of the following: information of a call application, information of an alarm clock application, information of a recording application, information of a music application, information of a ride-hailing application, information of a trip service, information of a courier service and / or information of a food delivery service; and in response to a first operation on the fifth window, displaying a second window in the fifth interface.

[0050] This process can correspond to Figure 15 The scenario shown. The fifth interface can be, for example... Figure 15 The interface shown in Figure 'a'; the fifth window can be, for example... Figure 15 Event capsule 105 in the interface shown in Figure 'a'; information on preset applications or preset services can be found in [reference]. Figure 1 The information corresponding to the specific events shown is not listed here in detail. The first operation may correspond to the swipe-down operation in event capsule 105; the second window may be, for example... Figure 15 Panel 206 in the interface shown in b.

[0051] In this way, electronic devices can expand their panels based on event capsules, allowing users to quickly access the target application or service within the panel.

[0052] Optionally, after displaying the fifth interface, the method further includes: canceling the display of the fifth window in the fifth interface in response to a fifth operation on the fifth window; and re-displaying the fifth window in the fifth interface when a wrist-raising motion is detected by the user holding the electronic device.

[0053] This process can correspond to Figure 16 and Figure 17 In the scenario shown, the fifth operation could be, for example, in... Figure 16 The right swipe operation for event capsule 105 in the interface shown in Figure 'a'. A wrist-raising action can be, for example... Figure 17 The scene shown in Figure a - Figure 17 The actions shown in the scene depicted in Figure c.

[0054] In this way, electronic devices can wake up the event capsule by raising their wrist, simplifying the manual swipe-to-wake operation and improving the user experience.

[0055] Optionally, after displaying the fifth interface, the method further includes: canceling the display of the fifth window in the fifth interface in response to a fifth operation on the fifth window; and re-displaying the fifth window in the fifth interface if it is detected that the duration of the user's gaze at the third area is greater than or equal to a third preset duration.

[0056] This process can correspond to Figure 16 and Figure 18 In the scenario shown, the fifth operation could be, for example, in...Figure 16 a in FIG. 6b; the third region can be, for example, the preset region 205; the action of the user gazing at the third region can refer to the action shown in FIG. 6b. Figure 18

[0057] In this way, the electronic device can wake up the event capsule by gazing, simplify the operation of the user manually sliding to wake up, and improve the user's use experience.

[0058] Optionally, the third region displays a third identifier during the process in which the user gazes at the third region, and the third identifier changes as the length of time that the user gazes at the third region increases.

[0059] The third identifier can be an identifier for displaying the gazing time, and the third identifier can be, for example Figure 18 the motion effect 1801 in the interface shown in FIG. 6d; the motion effect 1801 can be a capsule-shaped progress bar. Alternatively, the third identifier can be, for example, a word prompt for a countdown; or the third identifier can be, for example, a progress bar in other forms. The embodiments of the present application do not make any limitation in this regard.

[0060] In this way, the user can know the current gazing progress in real time through the motion effect 1801.

[0061] Optionally, the third region includes a camera. The camera can be a front camera, and the electronic device can detect the length of time that the user gazes at the third region through the camera.

[0062] Optionally, the first operation includes a downward sliding operation on the third region; the second operation includes a click operation; the third operation includes a sliding operation; the fourth operation includes a long-press operation; and the fifth operation includes a sliding operation. It should be noted that the above operations can be a possible implementation manner for responding to the corresponding function, and in actual application, the above multiple operations can all be other triggering manners, and the embodiments of the present application do not make any limitation in this regard.

[0063] ​In a second aspect, an embodiment of the present application provides an electronic device, which can also be referred to as a terminal device, a terminal, a user equipment (UE), a mobile station (MS), a mobile terminal (MT), etc. The terminal device can be a mobile phone, a smart television, a wearable device, a tablet computer (Pad), a computer with wireless transceiver function, a virtual reality (VR) terminal device, an augmented reality (AR) terminal device, a wireless terminal in industrial control, a wireless terminal in self-driving, a wireless terminal in remote medical surgery, a wireless terminal in smart grid, a wireless terminal in transportation safety, a wireless terminal in smart city, a wireless terminal in smart home, etc.

[0064] The electronic device includes: a processor and a memory; the memory stores computer-executed instructions; and the processor executes the computer-executed instructions stored in the memory, so that the electronic device performs the method of the first aspect.

[0065] In a third aspect, an embodiment of the present application provides a computer-readable storage medium, which stores a computer program. The computer program is executed by a processor to implement the method of the first aspect.

[0066] In a fourth aspect, an embodiment of the present application provides a computer program product, which includes a computer program. When the computer program is executed, the computer program causes a computer to perform the method of the first aspect.

[0067] In a fifth aspect, an embodiment of the present application provides a chip system, which includes at least one processor and a communication interface. The communication interface and the at least one processor are interconnected by a line. The at least one processor is configured to execute a computer program or instructions to perform the method of the first aspect.

[0068] It should be understood that the second aspect to the fifth aspect of the present application correspond to the technical solution of the first aspect of the present application, and the beneficial effects achieved by each aspect and the corresponding feasible implementation manners are similar, which will not be repeated. BRIEF DESCRIPTION OF DRAWINGS

[0069] Figure 1 Interface diagram of event capsule in possible implementation

[0070] Figure 2 An interface schematic diagram for starting an application using a panel according to an embodiment of the present application;

[0071] Figure 3 An interface schematic diagram for adding an icon of an application in a panel according to an embodiment of the present application;

[0072] Figure 4 A schematic diagram of a flash-cut capsule in different forms according to an embodiment of the present application;

[0073] Figure 5 An interface schematic diagram for adding a card of an application in a panel according to an embodiment of the present application;

[0074] Figure 6 A schematic diagram of a flash-cut capsule in different forms according to another embodiment of the present application;

[0075] Figure 7 A schematic diagram of arrangement of icons and / or cards in a panel according to an embodiment of the present application;

[0076] Figure 8 An interface schematic diagram for adjusting a position of an element in a panel according to an embodiment of the present application;

[0077] Figure 9 An interface schematic diagram for deleting an element in a panel according to an embodiment of the present application;

[0078] Figure 10 An interface schematic diagram for deleting an element in a panel according to another embodiment of the present application;

[0079] Figure 11 An interface schematic diagram for deleting an element in a panel according to another embodiment of the present application;

[0080] Figure 12 A schematic diagram for switching an application interface based on a panel according to an embodiment of the present application;

[0081] Figure 13 A schematic diagram for displaying an application interface based on a panel according to an embodiment of the present application;

[0082] Figure 14 An interface schematic diagram for folding a panel according to an embodiment of the present application;

[0083] Figure 15 An interface schematic diagram for unfolding a panel based on an event capsule according to an embodiment of the present application;

[0084] Figure 16An interface schematic diagram of a manual hiding and outgoing event capsule provided for an embodiment of the present application;

[0085] Figure 17 An interface schematic diagram of a wrist lifting wake-up event capsule provided for an embodiment of the present application;

[0086] Figure 18 An interface schematic diagram of a gaze wake-up event capsule provided for an embodiment of the present application;

[0087] Figure 19 A structural schematic diagram of an electronic device 100 provided for an embodiment of the present application;

[0088] Figure 20 A structural schematic diagram of a display device provided for an embodiment of the present application. DETAILED DESCRIPTION

[0089] In order to facilitate the clear description of the technical solutions of the embodiments of the present application, the following briefly introduces some terms and technologies involved in the embodiments of the present application:

[0090] 1. Electronic device

[0091] The electronic device of the embodiments of the present application can include a handheld device with image processing function, a vehicle-mounted device, etc. For example, some electronic devices are: a mobile phone, a tablet computer, a palm computer, a notebook computer, a mobile internet device (MID), a wearable device, a virtual reality (VR) device, an augmented reality (AR) device, a wireless terminal in industrial control, a wireless terminal in self driving, a wireless terminal in remote medical surgery, a wireless terminal in smart grid, a wireless terminal in transportation safety, a wireless terminal in smart city, a wireless terminal in smart home, a cellular phone, a cordless phone, a session initiation protocol (SIP) phone, a wireless local loop (WLL) station, a personal digital assistant (PDA), a handheld device with wireless communication function, a computing device or other processing device connected to a wireless modem, a vehicle-mounted device (such as a car machine), a wearable device, an electronic device in 5G, or an electronic device in a future evolved public land mobile network (PLMN), etc. The embodiments of the present application are not limited thereto.

[0092] By way of example and not limitation, in the embodiments of the present application, the electronic device can also be a wearable device. The wearable device can also be referred to as a wearable smart device, which is a general term for devices that are designed and developed by applying wearable technology to daily wear, such as hearing aids, glasses, gloves, watches, clothing, and shoes. The wearable device is a portable device that is directly worn on the body or integrated into the user's clothes or accessories. The wearable device is not only a hardware device, but also a device that realizes powerful functions through software support and data interaction and cloud interaction. The general wearable smart device includes a device with full function and large size, which can realize complete or partial functions without relying on a smart phone, such as a smart watch or smart glasses, and a device that focuses on a certain application function and needs to cooperate with other devices such as a smart phone, such as various smart wristbands and smart jewelry for monitoring vital signs.

[0093] In addition, in the embodiments of the present application, the electronic device can also be an electronic device in an Internet of Things (IoT) system, which is an important part of future information technology development, and its main technical feature is to connect things through communication technology, so as to realize the interconnection of man-machine and the interconnection of things.

[0094] The electronic device in the embodiments of the present application can also be referred to as a terminal device, user equipment (UE), a mobile station (MS), a mobile terminal (MT), an access terminal, a subscriber unit, a subscriber station, a mobile station, a mobile terminal, a remote station, a remote terminal, a mobile device, a user terminal, a terminal, a wireless communication device, a user agent, or a user equipment, etc.

[0095] 2, event capsule

[0096] In the case of receiving a specific event, the electronic device can display the relevant information of the specific event in the form of an event capsule; the display position of the event capsule can be located in the punch area of the front camera. The specific event can include a call event, an alarm event, a recording event, a media event, a printing event, a timer event, a car-hailing event, a flight event, a high-speed rail event, a game event, a delivery event, a subway event, a movie event, and a take-out event, etc.

[0097] Taking the car-hailing event as an example, the use process of the event capsule will be described below in combination with Figure 1 . As shown in Figure 1 , the electronic device can display a car-hailing application interface as shown in a of

[0098] After the user uses the car-hailing application to book a vehicle, the electronic device can display the car-hailing application interface as shown in a of Figure 1 . The interface can include a route map from the starting position to the ending position and a car-hailing window 101; the car-hailing window 101 includes a plurality of types of car-hailing services, an estimated price, a selection box, and a call confirmation control; the car-hailing services are, for example, carpooling, express car, taxi, and private car, etc. After receiving a selection operation on the selection box 102 for the taxi, the electronic device can display the selected selection box. In the case of receiving a triggering operation on the call confirmation control 103, the electronic device can pop up a single-order pop-up window 104 on the car-hailing application interface to indicate that the vehicle for picking up is being searched. In some scenarios, the electronic device can run the car-hailing application in the background, for example, in the interface as shown in a of Figure 1 , when receiving an upslide operation from the bottom of the screen, the electronic device can exit the car-hailing application interface and display the desktop, as shown in the interface as shown in b of Figure 1 . After receiving the vehicle information for picking up, the electronic device can display the vehicle information in the form of an event capsule. For example, Figure 1The interface shown in Figure b displays an event capsule 105, which includes a ride-hailing app icon and name 1051, a front-facing camera cutout area 1052, and vehicle information 1053. The vehicle information 1053 may include, for example, the vehicle's license plate number. In this way, the electronic device can display the ride-hailing progress in real time through the event capsule, reducing the likelihood of users missing ride-hailing information; it also reduces the need for users to switch between ride-hailing app interfaces.

[0099] Similarly, event capsules can also be applied to other specific events mentioned above. For example, after receiving a call event, the event capsule can display the call app icon and call duration; after receiving an alarm event, the event capsule can display the alarm app icon and alarm time; after receiving a recording event, the event capsule can display the recording app icon and recording duration; after receiving a media event, the event capsule can display the music app icon and playback indicator, and so on. These will not be listed in detail here.

[0100] Furthermore, the event capsule 105 can be switched to card mode to further display relevant information about a specific event. For example, in Figure 1 In the interface shown in b, when a trigger operation (such as a click operation) is received for the event capsule 105, the electronic device can display as shown in the image. Figure 1 The interface shown in c is shown in the image. Figure 1 In the interface shown as c, the electronic device displays card 106, which includes vehicle information, vehicle arrival time information, vehicle appearance information, and a driver contact control. Users can use card 106 to check the current ride-hailing progress; users can also click the driver contact control to speak with the driver.

[0101] Furthermore, electronic devices can access corresponding applications via cards. For example, in... Figure 1 In the interface shown in Figure c, when a trigger operation is received for card 106 (not in the area where the driver contact control is located), the electronic device can display as follows: Figure 1 The interface shown in d is shown in the image. Figure 1 The interface shown as d in the figure can be the interface of a ride-hailing application. This interface includes more comprehensive ride-hailing information, such as vehicle information, vehicle arrival time and distance information, a driver contact control, driver information, and the real-time location of the vehicle on the map.

[0102] 3. Other terms

[0103] 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.

[0104] In the embodiments of this application, "at least one" means one or more, and "multiple" means two or more. The "and / or" describes the association relationship of the associated objects, which means that there can be three relationships, for example, A and / or B, which can represent the following three cases: A exists alone, A and B exist together, and B exists alone, where A and B can be singular or plural. The character " / " generally represents an "or" relationship between the front and rear associated objects. "At least one of the following" or similar expressions means any combination of these items, including single item or any combination of multiple items. For example, at least one of a, b, or c can represent a, b, c, a-b, a-c, b-c, or a-b-c, where a, b, and c can be single or multiple.

[0105] It should be noted that "at the time" in the embodiments of this application can be at the moment when a certain condition occurs, or within a certain period of time after the occurrence of a certain condition, which is not limited in the embodiments of this application. In addition, the display interface provided by the embodiments of this application is only an example, and the display interface can also include more or less content.

[0106] In a possible implementation, the scenario in which the electronic device starts an application program is relatively single. For example, the user needs to find a target application in the desktop, and the electronic device starts the target application in response to the triggering operation of the user on the icon of the target application. In the case where the number of application programs is large, the user needs to search for the target application in multiple desktops, and the user operation is complex, thereby affecting the user experience.

[0107] Therefore, the embodiments of this application provide a display method, which can call out a panel on the desktop or other interface through a triggering operation. The panel can include application programs and / or cards added by the user, and the electronic device can start the target application in response to the operation of the user clicking the target application in the panel. The number of application programs and / or cards in the panel can be less than the number of application programs and / or cards in the desktop. Specifically, the notch area (also referred to as the area where the front camera is located) at the top of the electronic device can be provided with a capsule-shaped control (hereinafter referred to as a capsule), which can be expanded into a panel. The panel can include icons of multiple application programs and cards. In this way, the application programs added by the user can be displayed in a centralized manner, so that the user can quickly find the target application, and the user operation is simplified.

[0108] For ease of understanding, before the display method provided by the embodiments of this application is described in detail, the application scenario involved in the embodiments of this application is introduced by taking a mobile phone as an example.

[0109] First, the display method provided by the embodiments of this application is described in combination with the following Figure 2The scenario of starting an application using a panel provided in the embodiments of the present application is described as follows. Figure 2

[0110] The electronic device can display a desktop in the screen-on state. The desktop can be, for example, the interface shown in a of Figure 2 Figure 2 The interface shown in a of FIG. 2A can display one or more application icons, one or more cards, a page indicator, and / or a top status bar. The application icons can be, for example, the calculator application icon, the gallery application icon, the music application icon, the mail application icon, the game application icon, and the e-book application icon in region 201. The application icons can also be, for example, the message application icon, the browser application icon, the call application icon, and the camera application icon in region 202. The cards can be, for example, the weather service card and the sports service card in region 203.

[0111] It can be understood that an application can include multiple services. In the embodiments of the present application, the services mentioned can be: adding a service in an application to the desktop or the panel in the form of a shortcut card; after clicking the card, the electronic device can directly jump to the interface corresponding to the service without displaying the initial interface of the application.

[0112] The page indicator 204 can be used to indicate the positional relationship of the currently displayed desktop with other desktops. For example, the desktop shown in a of FIG. 2A is the fourth desktop among multiple desktops of the electronic device. It can be understood that in the case of switching the page indicator 204, the application icons in region 201 and the cards in region 203 change accordingly with the switching of the page indicator 204; while the application icons in region 202 below the page indicator 204 can remain displayed when the page is switched. Figure 2

[0113] The top status bar can include time information, network information, and power information, etc. In addition, the area where the top status bar is located also includes a preset area 205. The preset area 205 can include a notch area of a front-facing camera (see the oblique line-filled circular area in the interface shown in a of FIG. 2A) and an area around the front-facing camera (see the rounded rectangular area around the periphery of the oblique line-filled circular area). The number of front-facing cameras can be one or more. For example, taking the number of front-facing cameras as 2 as an example, the preset area 205 can include two oblique line-filled circular areas. Figure 2 In the interface shown in a of FIG. 2A, the electronic device receives a downward swipe operation on the preset area 205. In response to the operation, the electronic device can enter the interface shown in b of FIG. 2A.

[0114] Figure 2 In the interface shown in b of FIG. 2A, the electronic device receives a downward swipe operation on the preset area 205. In response to the operation, the electronic device can enter the interface shown in c of FIG. 2A. Figure 2 In the interface shown in c of FIG. 2A, the electronic device receives a downward swipe operation on the preset area 205. In response to the operation, the electronic device can enter the interface shown in d of FIG. 2A.​​​​

[0115] exist Figure 2 In the interface shown in b, the electronic device can... Figure 2 The upper display panel 206 of the interface shown in Figure 'a' includes icons for multiple applications, multiple cards, and / or page indicators 207. Application icons may be, for example, a calendar application icon 208; cards may be, for example, a weather service card 209. Page indicators 207 can be used to indicate the positional relationship between the currently displayed panel and other panels. For example, panel 206 may be the first of multiple panels on an electronic device, and different panels may display icons and / or cards for different applications.

[0116] In one possible implementation, the electronic device can launch an application based on panel 206. Specifically, in Figure 2 In the interface shown in b, when the electronic device receives a trigger operation on the calendar application icon 208, in response to the operation, the electronic device can launch the calendar application and display as shown in the image. Figure 2 The interface shown in 'c' is an example. The triggering action can be a click action. Figure 2 The interface shown as 'c' is the calendar application interface. This allows users to quickly open the target application using panel 206, simplifying the process of finding the target application across multiple desktops and improving the user experience.

[0117] In another possible implementation, the electronic device can initiate the service based on panel 206. Specifically, in Figure 3 In the interface shown in b, when the electronic device receives a trigger operation for the weather service card 209, in response to the operation, the electronic device can activate the weather service and display as shown in the image. Figure 3 The interface shown in d is shown in the image. Figure 3 The interface shown as 'd' is the weather service interface. This allows users to quickly access the target service using panel 206, simplifying the process of searching for the target card across multiple desktops and improving the user experience.

[0118] It is understandable that panel 206 can be interpreted as a collection of user-defined applications and services; the number of applications in a multi-page panel is less than the number of applications in a multi-page desktop, and the number of cards in a multi-page panel is less than the number of cards in a multi-page desktop; therefore, panel 206 can be used to quickly find target applications and / or target services.

[0119] Optionally, for ease of user operation, in this embodiment, the range of the hot zone that triggers the operation to call up the panel can be slightly larger than or equal to the range of the preset area 205. However, the range of this hot zone is smaller than the range where the status bar is located; for example, the hot zone is located in the center of the status bar. This is because, in a possible implementation, when a swipe-down operation is received from the top of the screen, the electronic device can display a control center interface and / or a notification message interface. For example, when a swipe-down operation is received in the status bar on the left side of the preset area 205, the electronic device can display a notification message interface; when a swipe-down operation is received in the status bar on the right side of the preset area 205, the electronic device can display a control center interface. To reduce the impact on the display of the control center interface and / or the notification message interface, this embodiment can set the hot zone to be slightly larger than or equal to the range of the preset area 205.

[0120] The above embodiments illustrate the process of quickly launching a target application and / or target service via a panel. The following, in conjunction with... Figure 3 This application describes one method of adding application icons to the panel, such as... Figure 3 As shown:

[0121] Electronic devices display a desktop, which can be, for example... Figure 4 The interface shown in Figure 'a'. Figure 4 The interface shown in Figure 'a' can display a preset area 205 and a social application icon 301. When a touch object receives a long press operation on the social application icon 301, the social application icon 301 switches to an operable state, and the touch object can control the movement of the social application icon 301; the touch object can include the user's finger or a stylus.

[0122] For example, while the touch object is continuously interacting with the social application icon 301 (the touch object clicks the social application icon 301, and the touch object does not leave the touch screen), the electronic device can display an effect where the social application icon 301 moves with the touch object, such as... Figure 4 The interface shown in b is shown in the image. Furthermore, while the touch object continues to act on the social application icon 301, the electronic device can also display a flash capsule 302; the flash capsule 302 can be used to indicate that the application icon is currently in a moving state; the size of the flash capsule 302 is larger than the size of the preset area 205.

[0123] The specifications for the flash-cutting capsule 302 and the preset area 205 can be found in [reference needed]. Figure 4 .

[0124] The preset area 205 is a rounded rectangle, and the radius of the rounded corner is half of the height of the preset area 205, for example, the height of the preset area 205 is b1; and the radius of the rounded corner is b1 / 2. The length of the preset area 205 is a1; a1 is greater than b1. The preset area 205 can have a capsule shape. The preset area 205 can display a front camera, for example, Figure 4 In FIG. a in FIG. 2, the preset area 205 includes two front cameras (see the diagonal line filled circular area in the figure), and the two front cameras can be displayed side by side and centered in the preset area 205. Figure 3 In FIG. b in FIG. 2, the preset area 205 includes one front camera, and the front camera can be displayed centered in the preset area 205. The number of front cameras is not limited in the embodiments of the present application.

[0125] The flash-cut capsule 302 is a rounded rectangle, and the radius of the rounded corner is half of the height of the flash-cut capsule 302, for example, the height of the flash-cut capsule 302 is b2; and the radius of the rounded corner is b2 / 2. The length of the flash-cut capsule 302 is a2; a2 is greater than b2. The flash-cut capsule 302 can have a capsule shape. The size of the flash-cut capsule 302 is greater than the size of the preset area 205; specifically, a2 is greater than a1; and b2 is greater than b1. In addition, the front camera can be displayed centered, for example, Figure 3 In FIG. a in FIG. 3, two front cameras in the flash-cut capsule 302 are displayed centered. Figure 4 In FIG. b in FIG. 3, one front camera in the flash-cut capsule 302 is displayed centered. The number of cutout holes of the front camera in the flash-cut capsule 302 is the same as the number of cutout holes of the front camera in the preset area 205.

[0126] In the embodiments of the present application, in the case where the electronic device identifies the long press operation, the electronic device can switch the preset area 205 to the flash-cut capsule 302; because the size of the preset area 205 is smaller than the size of the flash-cut capsule 302, in this process, the electronic device can display a rounded rectangle enlarged at the top, and the position of the cutout hole of the front camera does not change. In some embodiments, the electronic device can set the length of the rounded rectangle to a2 and the height of the rounded rectangle to b2 when detecting the long press operation, so as to achieve the effect of highlighting and enlarging the display of the flash-cut capsule 302. In other embodiments, in order to improve the continuity and aesthetics of the interface during the switching process, the length of the rounded rectangle can gradually increase from a1 to a2, and the height of the rounded rectangle can gradually increase from b1 to b2 during the switching process from the preset area 205 to the flash-cut capsule 302. The switching process is not limited in the embodiments of the present application.

[0127] Continuing to refer to Figure 4In the interface shown in b, the touch object can be dragged and moved along with the social application icon 301. As the social application icon 301 moves along with the touch object, it can enter the target area 303. In response to dragging the social application icon 301 to the target area 303, the electronic device displays a flash capsule 304, as shown in the image. Figure 3 As shown in the c interface.

[0128] The flash-cut capsule 304 can be used to indicate that the application's icon is currently located in the target area. Specifically, the flash-cut capsule 304 can be found in [reference needed]. Figure 3 Figure a in the middle, or Figure 3 As shown in Figure b, the Flash Capsule 304 may include an add icon 3041, a front-facing camera, and an add application icon 3042. The add icon 3041 can be used to prompt the user about the display position of the application icon after it has been added to the panel; the add icon 3041 may be, for example, a "+". The add application icon 3042 can be used to prompt the user that the current operation can add an application to the Flash Capsule 304. The add icon 3041 may be located to the left of the front-facing camera, and the add application icon 3042 may be located to the right of the front-facing camera; alternatively, the add icon 3041 may be located to the right of the front-facing camera, and the add application icon 3042 may be located to the left of the front-facing camera (this scenario is not shown in the figure).

[0129] The flash-cutting capsule 304 is a rounded rectangle with a corner radius equal to half its height. For example, if the height of the flash-cutting capsule 304 is b3, the corner radius is b3 / 2. The length of the flash-cutting capsule 304 is a3, where a3 is greater than b3. Furthermore, the dimensions of the flash-cutting capsule 304 can be larger than those of the flash-cutting capsule 302; for example, a3 is greater than a2, and b3 is greater than or equal to b2.

[0130] It should be noted that the target area 303 can be understood as the hot zone range that supports adding applications to the panel. Understandably, in a possible implementation, the touch object can adjust the position of the application icon on the desktop through drag-and-drop operations. To reduce the impact of adding applications to the panel on this scenario, this embodiment can align the range of the target area 303 with the range of the status bar; that is, the range of the target area 303 can be slightly larger than or equal to the range of the status bar. In this embodiment, when the application icon touches the lower boundary of the target area 303, or when the area of ​​the icon entering the target area 303 exceeds a first proportional threshold, the electronic device can switch the flash-switching capsule 302 to the flash-switching capsule 304. This embodiment does not impose any limitations on this.

[0131] See also Figure 4 In the interface shown in c, when the social application icon 301 enters the target area 303, the touch object performs a lift-up operation (the touch object leaves the touchscreen). In response to this operation, the electronic device can display as shown in c.Figure 4 The interface shown in d is shown in the image.

[0132] exist Figure 2 In the interface shown in d, the electronic device can display the flash-cut capsule 305, which can be used to prompt the user that the application has been added to the panel.

[0133] Specifically, for flash-cutting capsule 305, please refer to [link / reference needed]. Figure 3 Figure a in the middle, or Figure 3 As shown in Figure b, the Flash Capsule 305 may include an application icon 3051, a front-facing camera, and an added identifier 3052. The application icon 3051 can be used to indicate to the user that the current operation has added the application to the panel; the added identifier 3052 can be used to indicate to the user that the application icon has been added to the panel. The application icon 3051 may be located to the left of the front-facing camera, and the added identifier 3052 may be located to the right of the front-facing camera; alternatively, the application icon 3051 may be located to the right of the front-facing camera, and the added identifier 3052 may be located to the left of the front-facing camera (this scenario is not shown in the figure).

[0134] The flash-cutting capsule 305 is a rounded rectangle with a corner radius equal to half its height. For example, if the height of the flash-cutting capsule 305 is b4, the corner radius is b4 / 2. The length of the flash-cutting capsule 305 is a4, where a4 is greater than b4. Furthermore, the dimensions of the flash-cutting capsule 305 can be larger than those of the flash-cutting capsule 302; for example, a4 is greater than a2, and b4 is greater than or equal to b2. The dimensions of the flash-cutting capsule 305 can be greater than or equal to those of the flash-cutting capsule 304.

[0135] At this point, the electronic device adds the application icon to the panel through user drag-and-drop operations. The electronic device can use... Figure 3 The method in the illustrated embodiment starts the newly added application. This application will not elaborate further on this method.

[0136] Understandably, while the touch object continues to interact with the application's icon, the icon may not be displayed in its original location. For example, in... Figure 3 In the interface shown in Figure 'a', the social application icon 301 is located in the position of the first icon in the second row; Figure 3 The interface shown in b and Figure 3 In the interface shown as c, the social application icon 301 displays an animation that follows the touched object, and no icon is displayed in the position of the first icon in the second row. Figure 3 In the interface shown by d, the social application icon 301 is located in the position of the first icon in the second row. In this embodiment of the application, after the electronic device adds the icon of an application from the desktop to the panel, the icon of the application from the desktop does not disappear.

[0137] It should be noted that, in possible implementations, electronic devices often have a punch-hole area at the top to facilitate the placement of the front-facing camera; this punch-hole area can respond to the user's swipe-down operation to display a control center interface and / or a notification message interface. In this embodiment, the electronic device can display the panel 206 based on a swipe-down operation in the preset area 205; when the preset area 205 does not receive a trigger operation, the top area of ​​the electronic device does not display the flash-cut capsule or panel. The specifications of the preset area 205 in this embodiment are the same as or similar to the specifications of the punch-hole area in possible implementations, and will be referred to here as... Figure 5 The capsule-shaped area in the interface shown in Figure 'a' is defined as the preset area 205. And... Figure 5 The interface shown in b - Figure 5 In the interface shown by d, the capsule-shaped controls are larger than the preset area 205. For easy distinction, they are sequentially defined as flash-cut capsule 302, flash-cut capsule 304, and flash-cut capsule 305. However, in actual scenarios, the preset area 205 can also be referred to as a capsule based on its shape, and this embodiment does not impose such a limitation.

[0138] It should be noted that, in the embodiments of this application, flash-cut capsules 302, 304, and 305 can be different forms of the same capsule-shaped window; for example, flash-cut capsule 302 enlarges to display the style of flash-cut capsule 304; flash-cut capsule 304 further enlarges to display the style of flash-cut capsule 305. Alternatively, flash-cut capsules 302, 304, and 305 can be different capsules; for example, as the touch object drags the application icon or card, the electronic device switches from flash-cut capsule 302 to flash-cut capsule 304, and then from flash-cut capsule 304 to flash-cut capsule 305. The embodiments of this application do not limit the specific implementation of the flash-cut capsule change process.

[0139] It should be noted that the display duration of the flash-switching capsule 305 can be a second preset duration. After the second preset duration is exceeded, the electronic device can switch from the flash-switching capsule 305 to the preset area 205.

[0140] Electronic devices can add application icons or cards to the panel. The following section combines... Figure 5 This application describes one method of adding cards to a panel in its embodiments, such as... Figure 5 As shown:

[0141] Electronic devices display a desktop, which can be, for example... Figure 6 The interface shown in Figure 'a'. Figure 6 The interface shown in Figure 'a' can display a preset area 205 and one or more cards. These cards may include, for example, a contact card 501, a weather service card 502, and a note service card 503.

[0142] When the touch object receives the long press operation on the contact card 501, the contact card 501 switches to the operable state, and the touch object can control the contact card 501 to move.

[0143] For example, during the process in which the touch object continuously acts on the contact card 501 (the touch object long presses the contact card 501, and the touch object does not leave the touch screen), the electronic device can display an effect in which the contact card 501 moves following the touch object, as shown in the interface of FIG. b. Figure 4 In addition, during the process in which the touch object continuously acts on the contact card 501, the electronic device can also display the flash switching capsule 504; the flash switching capsule 504 can be used to indicate that the card is currently in a moving state. The size of the flash switching capsule 504 is greater than the size of the preset area 205; the size of the flash switching capsule 504 can be the same as or different from the size of the flash switching capsule 302, and the embodiments of the present application do not limit this.

[0144] The size of the flash switching capsule 504 can be referred to in Figure 5 The flash switching capsule 504 is a rounded rectangle, and the radius of the rounded corner is half of the height of the flash switching capsule 504, for example, the height of the flash switching capsule 504 is d2; the radius of the rounded corner is d2 / 2. The length of the flash switching capsule 504 is c2; c2 is greater than d2. The size of the flash switching capsule 504 is greater than the size of the preset area 205; specifically, c2 is greater than a1; d2 is greater than b1. In addition, the front camera can be displayed in the center, for example, in FIG. a of Figure 5 , two front cameras in the flash switching capsule 504 are displayed in the center. Figure 6 In FIG. b of , one front camera in the flash switching capsule 504 is displayed in the center. The number of front camera cutouts in the flash switching capsule 504 is the same as the number of front camera cutouts in the preset area 205.

[0145] In the embodiments of the present application, when the electronic device identifies the long press operation, the electronic device can switch the preset area 205 to the flash switching capsule 504; because the size of the preset area 205 is smaller than the size of the flash switching capsule 504, during this process, the electronic device can display the effect of a rounded rectangle enlarged display on the top, and the position of the front camera cutout does not change. In some embodiments, when the long press operation is detected, the electronic device can set the length of the rounded rectangle to c2; and set the height of the rounded rectangle to d2; to achieve the effect of highlighting and enlarging the display of the flash switching capsule 504. In other embodiments, to improve the continuity and aesthetics of the interface during the switching process, during the process in which the preset area 205 is switched to the flash switching capsule 504, the length of the rounded rectangle can gradually increase from a1 to c2, and the height of the rounded rectangle can gradually increase from b1 to d2. The embodiments of the present application do not limit the switching process.

[0146] Continuing to refer to the interface shown in FIG. 6B, the contact card 501 can be dragged by the touch object to move. During the movement of the contact card 501, the contact card 501 can enter the target area 303. In response to the operation of dragging the contact card 501 to the target area 303, the electronic device displays the flash capsule 505, as shown in the interface of FIG. 6C. Figure 6 Figure 5

[0147] The flash capsule 505 can be used to indicate that the card is currently located in the target area. Specifically, the flash capsule 505 can refer to the a figure of FIG. 6D, or the b figure of FIG. 6E. The flash capsule 505 can include an add icon 5051, a front camera, and an add service icon 5052. The add icon 5051 can be used to prompt the user that the display position of the card after the card is added to the panel; the add icon 5051 can be, for example, “+”. The add service icon 5052 can be used to prompt the user that the current operation can add a service card to the flash capsule 505. The add icon 5051 can be located on the left side of the front camera, and the add service icon 5052 can be located on the right side of the front camera; or the add icon 5051 can be located on the right side of the front camera, and the add service icon 5052 can be located on the left side of the front camera (not shown in the figure). Figure 5 Figure 5 The flash capsule 505 is a rounded rectangle, and the radius of the rounded corner is half of the height of the flash capsule 505. For example, the height of the flash capsule 505 is d3, and the radius of the rounded corner is d3 / 2. The length of the flash capsule 505 is c3, and c3 is greater than d3. In addition, the size of the flash capsule 505 can be greater than the size of the flash capsule 504; for example, c3 is greater than c2, and d3 is greater than or equal to d2. The size of the flash capsule 505 can be the same as or different from the size of the flash capsule 302, and the embodiments of the present application do not limit this.

[0148] Continuing to refer to the interface shown in FIG. 6C, when the contact card 501 enters the target area 303, the touch object performs a lifting operation (the touch object leaves the touch screen), and in response to the operation, the electronic device can display the interface shown in FIG. 6D.

[0149] Continuing to refer to the interface shown in FIG. 6C, when the contact card 501 enters the target area 303, the touch object performs a lifting operation (the touch object leaves the touch screen), and in response to the operation, the electronic device can display the interface shown in FIG. 6D. Figure 6 Figure 6 In the interface shown in FIG. 6D, the electronic device can display the flash capsule 506, which can be used to prompt the user that the card has been added to the panel.

[0150] Specifically, the flash capsule 506 can refer to the a figure of FIG. 6F, or the b figure of FIG. 6G. Figure 2

[0151] Figure 7 Figure 7 ​​​​​​​As shown in FIG. 6B, the flash capsule 506 can include an added card identifier 5061, a front camera, and an added identifier 5062. The added card identifier 5061 can be used to prompt the user that the card is currently being operated to be added to the panel. The added identifier 5062 can be used to prompt the user that the card has been added to the panel. The added card identifier 5061 can be located on the left side of the front camera, and the added identifier 5062 can be located on the right side of the front camera; or the added card identifier 5061 can be located on the right side of the front camera, and the added identifier 5062 can be located on the left side of the front camera (not shown in the figure).

[0152] It should be noted that, since the size of the service card is larger than the size of the application icon, and the icons of the service card are more abundant; and the range of the added card identifier 5061 is small, and the card can not be completely displayed, in order to improve the aesthetics and maintain the consistency with the flash capsule 305, a specific pattern such as “√” can be displayed on the added card identifier 5061, so that the user can determine that the object currently being added to the panel is a card according to the specific pattern, so as to be distinguished from the application icon 3051 of the flash capsule 305.

[0153] The flash capsule 506 is a rounded rectangle, and the radius of the rounded corner is half of the height of the flash capsule 506, for example, the height of the flash capsule 506 is d4, and the radius of the rounded corner is d4 / 2. The length of the flash capsule 506 is c4, and c4 is greater than d4. In addition, the size of the flash capsule 506 can be greater than the size of the flash capsule 504; for example, c4 is greater than c2, and d4 is greater than or equal to d2. The size of the flash capsule 506 can be greater than or equal to the size of the flash capsule 505.

[0154] So far, the electronic device adds the card to the panel through the user's drag operation. The electronic device can adopt the following embodiments to display the card in the panel. Figure 7 The method of the embodiment shown in FIG. 6B starts the newly added card. The embodiment of the present application will not be repeated here.

[0155] In the embodiment of the present application, the panel 206 can include multiple pages, and each page includes one or more application icons and / or cards. When the panel 206 is called based on the downward sliding operation, the current page displayed by the panel 206 can be the first page in the multiple pages, or the page displayed when the panel 206 is last closed; the embodiment of the present application does not limit this.

[0156] The following will be described in combination with Figure 7 The electronic device displays the first page in the panel 206 after calling the panel 206, and the layout mode of the application icons and the cards between different pages will be described; as shown in FIG. 6C. Figure 7

[0157] ​After receiving the downward sliding operation for the preset area 205, the electronic device can call out the panel 206 in the current interface. As shown in interface a of FIG. 2B, the current interface can be a desktop, which can include calculator application icon, gallery application icon, music application icon, mailbox application icon, game application icon, and e-book application icon, etc. The panel 206 can be displayed on the desktop, and the panel 206 can include icons of multiple applications and a page indicator 207, which can indicate that the first page of the panel 206 is currently displayed. Figure 7 The current interface can be a desktop, which can include calculator application icon, gallery application icon, music application icon, mailbox application icon, game application icon, and e-book application icon, etc. The panel 206 can be displayed on the desktop, and the panel 206 can include icons of multiple applications and a page indicator 207, which can indicate that the first page of the panel 206 is currently displayed.

[0158] In some embodiments, to improve the aesthetics of the panel 206 and facilitate centralized management of frequently used applications of the user, the size of the panel 206 can be set to be smaller than that of the desktop; and the panel 206 can have an upper limit of the number of icons and cards of applications in each page, and when the number of icons and cards of applications exceeds the upper limit, the electronic device can add a page to the panel 206.

[0159] For example, the number of icons of applications that can be contained in each page can be 16, and the icons of multiple applications can be arranged in the form of 4×4. For example, as shown in interface a of FIG. 2B, the panel 206 can display 16 icons of applications. Figure 7

[0160] The electronic device can control the page turning of the panel based on left and right sliding. For example, as shown in interface a of FIG. 2B, when receiving a left sliding operation for the panel 206, the electronic device can switch the page of the panel 206 to the next page in response to the left sliding operation, and the interface after the switching is shown in interface b of FIG. 2B. Figure 5 Figure 7 In interface b of FIG. 2B, the panel 206 can include icons and cards of multiple applications, and a page indicator 207, which can indicate that the second page of the panel 206 is currently displayed. It should be understood that in actual applications, the size of the icon of the application can be smaller than that of the card, for example, the size of the icon of the application can be 1×1, and the size of the card can be 1×2 (for example, the contact card 501 shown in interface a of FIG. 2B), 2×2 (for example, the card 701 shown in interface b of FIG. 2B), and 4×4 (for example, the note service card 503 shown in interface a of FIG. 2B), etc. The electronic device can arrange the cards according to the size of the cards, and the size of the panel 206 also changes accordingly.

[0161] For example, as shown in interface a of FIG. 2B, when receiving a right sliding operation for the panel 206, the electronic device can switch the page of the panel 206 to the previous page in response to the right sliding operation, and the interface after the switching is shown in interface b of FIG. 2B. Figure 5 Figure 7 Figure 7 Figure 7

[0162] For example, as shown in interface a of FIG. 2B, when receiving a right sliding operation for the panel 206, the electronic device can switch the page of the panel 206 to the previous page in response to the right sliding operation, and the interface after the switching is shown in interface b of FIG. 2B. Figure 7 ​​​​​​In the interface shown in b of FIG. 6A, the panel 206 can display 8 icons of application programs and 2 cards, and the elements occupy a size of 4×4. Figure 7 The size of the panel 206 in the interface shown in b of FIG. 6A is the same as Figure 7 The size of the panel 206 in the interface shown in a of FIG. 6A is the same as

[0163] For example, after the page of the panel 206 in the interface shown in b of FIG. 6A is turned, the electronic device can display the interface shown in Figure 7 of FIG. 6B. Figure 7 of FIG. 6B. Figure 7 The panel 206 in the interface shown in c of FIG. 6B can display a third page, which includes one card (card 702) occupying a size of 4×4. Figure 7 The size of the panel 206 in the interface shown in c of FIG. 6B is smaller than Figure 7 The size of the panel 206 in the interface shown in a of FIG. 6A is the same as

[0164] For example, after the page of the panel 206 in the interface shown in c of FIG. 6B is turned, the electronic device can display the interface shown in Figure 7 of FIG. 6C. Figure 7 of FIG. 6C. Figure 7 The panel 206 in the interface shown in d of FIG. 6C can display a fourth page, which is the last page of the panel 206, and the fourth page includes an icon (for example, the social application icon 703) of the newly added application program and / or a card (for example, the contact card 704) newly added. The fourth page can include 5 icons of application programs and 1 card, and the size of the fourth page is 3×4. Figure 7 The size of the panel 206 in the interface shown in d of FIG. 6C is smaller than Figure 8 The size of the panel 206 in the interface shown in a of FIG. 6A is the same as

[0165] It can be understood that, in the embodiment shown in Figure 8 the interface shown in a of FIG. 6A- Figure 8 the interface shown in d of FIG. 6C Figure 8 In the interface shown in d of FIG. 6C, the electronic device can switch the icons of application programs and the cards displayed in the panel 206 based on the left and right sliding operations, but the icons of application programs in the desktop do not change.

[0166] It should be noted that the above embodiments use specific numbers of application programs and cards to illustrate the layout of elements in the panel of the embodiments of the present application, but these numbers do not limit the embodiments of the present application; the panel of the embodiments of the present application can also be designed with a size, and the embodiments of the present application do not require this.

[0167] In the embodiments of the present application, the electronic device can adjust the positions of the icons of the applications in the panel. The following describes the embodiments of the present application with reference to the accompanying drawings. Figure 8 The scenario is described as shown in Figures 9-11 .

[0168] After receiving the downward sliding operation on the preset area 205, the electronic device can display the interface shown as a in Figure 9 . Figure 9 The interface shown as a in may include the panel 206. The panel 206 includes the calendar application icon 208. When receiving the long-press operation on the calendar application icon 208, the calendar application icon 208 switches to the operable state, and the touch object can control the calendar application icon 208 to move.

[0169] Figure 9 During the process that the touch object continuously acts on the calendar application icon 208, the position of the calendar application icon 208 follows the touch object to move. For example, the touch object drags the calendar application icon 208 to the position shown as b in , and leaves the touch screen. At this time, the electronic device can display the calendar application icon 208 at the position where the touch object is released, and does not display the calendar application icon 208 at the original position.

[0170] In this way, the electronic device can display the icons and / or cards of the applications and services preferred by the user in front of other icons and / or cards, or display the icons and / or cards of the applications and services preferred by the user at the positions preferred by the user, so as to facilitate the user to quickly find and start the target application or the target service.

[0171] Figure 9 To improve the use rate of the applications and services in the panel 206 and further simplify the operation of the user to find the applications and services, in the embodiments of the present application, the electronic device can delete the applications and services not frequently used by the user in the panel based on the user operation. The following describes three ways to delete the elements in the panel.

[0172] The first possible implementation manner can be as shown in Figure 9 .

[0173] After receiving the downward sliding operation on the preset area 205, the electronic device can display the interface shown as a in Figure 9 . The interface can display the desktop and the panel 206. The desktop includes a plurality of icons of applications, for example, the social application icon 301. The panel 206 includes a plurality of icons of applications, for example, the social application icon 703. It can be understood that the social application icon 301 and the social application icon 703 are both shortcut icons for starting the social application, which are distinguished only according to the display positions.

[0174] In the process that the touch object continuously acts on the social application icon 301, the position of the social application icon 301 follows the touch object to move. For example, the touch object drags the social application icon 301 to the position shown as b in Figure 10 .When the long-press operation on the social application icon 703 is received, the social application icon 703 switches to the operable state. When the touch object continuously acts on the social application icon 703 and a displacement is generated, the electronic device can display, as shown in interface b in FIG. 7B, the social application icon 703 following the touch object. Figure 10

[0175] In the interface b in FIG. 7B, the social application icon 703 follows the touch object, and the original position of the social application icon 703 (the position of the dashed box 901) does not display the icon of the application. In addition, in the desktop, the original position of the social application icon 301 (the position of the dashed box 902) also does not display the icon of the application. Figure 10

[0176] As the touch object continuously acts on the social application icon 703, the social application icon 703 follows the touch object and moves to the position shown in interface c in FIG. 7C. During the movement of the social application icon 703, the positions of the dashed box 901 and the dashed box 902 do not display the social application icon. Figure 10

[0177] When the touch object drags the social application icon 703 to the desktop and leaves the touch screen, the electronic device can display the social application icon at the position where the touch object leaves, and the social application icon is not displayed in the panel 206, for example, the social application icon 903 is displayed in the desktop, and the social application icon 301 is no longer displayed at the position shown by the dashed box 901.

[0178] It can be understood that, during the process that the touch object drags the social application icon 703 and the touch object does not leave the touch screen, the positions of the dashed box 901 and the dashed box 902 do not display the social application icon. In this way, the repeated display of the application icon in the desktop can be reduced, and the scenario that the icon of the application jumps when the hand is released can be reduced, so that the process of adjusting the position of the icon of the application is more smooth.

[0179] It should be noted that the social application icon 903, the social application icon 301, and the social application icon 703 are shortcut icons of the same application at different positions, which are defined as three icons herein for the convenience of distinguishing, and the embodiments of the present application do not limit this.

[0180] So far, the electronic device can move the icon of the application in the panel 206 to the desktop and adjust the position of the icon of the application in the desktop through the dragging operation of the user, and delete the icon of the application in the panel 206, thereby achieving the effect of arranging the panel 206.

[0181] The second possible implementation manner can be as shown in FIG. 7D. Figure 10

[0182] ​​​​After receiving the downward sliding operation on the preset area 205, the electronic device can display the interface as shown in a of FIG. 10B. The interface can display the desktop and the panel 206; the desktop includes icons of a plurality of application programs, for example, the social application icon 301; and the panel 206 includes icons of a plurality of application programs, for example, the social application icon 703. Figure 10

[0183] In the interface as shown in a of FIG. 10B, when a long-press operation is received on the social application icon 703, the social application icon 703 switches to an operable state. When the touch object continuously acts on the social application icon 703 and generates displacement, the electronic device can display the interface as shown in b of FIG. 10B. Figure 10 Figure 10

[0184] In the interface as shown in b of FIG. 10B, the social application icon 703 moves with the touch object, and the original position of the social application icon 703 (the position of the dashed box 1001) does not display an icon of an application program; in addition, in the desktop, the original position of the social application icon 301 (the position of the dashed box 1002) also does not display an icon of an application program. Figure 10

[0185] As the touch object continuously acts on the social application icon 703, the social application icon 703 moves out of the area where the panel 206 is located, as shown in the interface as shown in c of FIG. 10B. During the movement of the social application icon 703, the positions of the dashed box 1001 and the dashed box 1002 do not display the social application icon. Figure 11

[0186] It can be understood that the social application icon 703 moving out of the area where the panel 206 is located can mean that the social application icon 703 does not overlap with the panel 206, or that the social application icon 703 partially overlaps with the panel 206, and the proportion of the overlapping part to the area of the social application icon 703 is greater than a second proportion threshold. The embodiments of the present application do not limit this.

[0187] When the touch object moves the social application icon 703 out of the panel 206 and away from the touch screen, the electronic device can display the social application icon at the original position (for example, the position of the dashed box 1002) in the desktop, and not display the social application icon in the panel 206. For example, in the interface as shown in d of FIG. 10B, the electronic device displays the social application icon 301; in addition, in the interface as shown in d of FIG. 10B, the position of the social application icon 301 is the same as the position of the social application icon 301 in the interface as shown in a of FIG. 10B. Figure 11 Figure 11 Figure 11

[0188] ​​​​​​​​It can be understood that during the process that the touch object drags the social application icon 703 and the touch object does not leave the touch screen, the social application icon is not displayed at the positions of the dashed box 1001 and the dashed box 1002. In this way, the repeated display of the application icon in the desktop can be reduced.

[0189] So far, the electronic device can remove the icon of the application in the panel 206 by the user's dragging operation, thereby deleting the icon of the application in the panel 206, and playing the effect of tidying the panel 206.

[0190] The third possible implementation manner can be as shown in Figure 11

[0191] After receiving the downward sliding operation on the preset area 205, the electronic device can display an interface as shown in a of Figure 11 The interface can display the desktop and the panel 206; the desktop includes the social application icon 301; and the panel 206 includes the social application icon 703.

[0192] In the interface as shown in a of Figure 11 When receiving a long-press operation on the social application icon 703 in the interface as shown in a of Figure 11 The electronic device enters the interface as shown in b of Figure 11 In the interface as shown in b of

[0193] Optionally, when the desktop and the panel display the icon of the same application, and the icon of the application in the panel is in the deletable state, the electronic device can not display the icon of the application in the desktop, for example, the social application icon 301 is not displayed at the dashed box 1102 in the interface as shown in b of Figures 8-11 Alternatively, when the desktop and the panel display the icon of the same application, and the icon of the application in the panel is in the deletable state, the electronic device can maintain the display of the icon of the application in the desktop (not shown in the figure). The embodiments of the present application do not limit this.

[0194] In the interface as shown in b of Figures 8-11 When receiving a trigger operation on the delete control 1101 in the interface as shown in b of Figures 9-11 The electronic device can delete the social application icon in the panel 206 and display the interface as shown in c of Figure 12 For example, in the panel 206 in the interface as shown in c of

[0195] ​At this point, the electronic device can delete the icon of the application in the panel 206 through a user operation, thereby playing a role of tidying up the panel 206.

[0196] It can be understood that, Figure 13 The movement and deletion of the element in the panel are described by taking the operation on the icon of the application in the panel as an example. The movement and deletion of the card in the panel can refer to the scenario shown in Figure 12 The embodiments of the present application do not repeat the description here.

[0197] It should be noted that, in order to facilitate the understanding of the technical solutions of the embodiments of the present application, Figure 12 The current desktop and the current panel 206 displayed by the electronic device display the icon of the same application. In actual application, the electronic device may not display the icon of the application in the current desktop or the current interface may not display the icon and the card of the application when deleting the icon of the application in the panel 206. The embodiments of the present application do not limit this scenario.

[0198] The above embodiments describe the process of adding, moving and deleting the icon and / or card of the application in the panel in detail. The following describes two display modes of the application interface in combination with Figure 12 and Figure 12 respectively.

[0199] Figure 12 shows a process of quickly switching from one application interface to another application interface based on the panel, as shown in Figure 12

[0200] The electronic device can display the interface shown as a in Figure 12 when the social application is opened. The interface can display the contact name, contact information and preset area 205, etc. When a downward sliding operation on the preset area 205 is received, the electronic device can enter the interface shown as b in Figure 13 In the interface shown as b in Figure 13 , the electronic device can display the panel 206 on the upper layer of the social application interface. The panel 206 can include the icon 1201 of the e-book application.

[0201] When a trigger operation on the icon 1201 of the e-book application is received, the electronic device can start the e-book application and display the interface shown as c in Figure 13 . Figure 13 The interface shown as c in may be an e-book application interface, which can display e-book information.

[0202] It can be understood that in the process, the electronic device can quickly open the e-book application interface through the panel without exiting the social application interface, so as to realize quick switching between the two application interfaces, simplify user operation, and improve user experience.

[0203] Figure 13 A process of starting two applications based on a panel is shown, as Figure 13 shown:

[0204] After the electronic device opens the social application, an interface as shown in a of Figure 13 may be displayed. The interface can display a contact name, contact information, and a preset area 205, etc. When a downward sliding operation on the preset area 205 is received, the electronic device can enter an interface as shown in b of Figure 13 . In the interface as shown in b of Figure 13 , the electronic device can display a panel 206 on the upper layer of the social application interface. The panel 206 can include an e-book application icon 1201.

[0205] When a trigger operation on the e-book application icon 1201 is received, the electronic device can display a window of the e-book application in split-screen mode, as shown in an interface as shown in c of Figure 13 . Figure 13 The interface as shown in c of Figure 13 may include two windows, a split-screen window 1301 of the social application and a split-screen window 1302 of the e-book application; the split-screen window 1301 of the social application can include a contact name and contact information, etc.; the split-screen window 1302 of the e-book application can include e-book information. The split-screen window 1301 of the social application and the split-screen window 1302 of the e-book application do not overlap.

[0206] It can be understood that in the process, the electronic device can use the panel 206 to simultaneously display multiple applications in split-screen mode, reduce the switching process between application interfaces, simplify user operation, and improve user experience.

[0207] In addition to the split-screen mode, the electronic device can also display windows of multiple applications in the form of a floating window. For example, continuing to refer to Figure 13 :

[0208] After the electronic device opens the social application, an interface as shown in a of Figure 14 may be displayed. The interface can display a contact name, contact information, and a preset area 205, etc. When a downward sliding operation on the preset area 205 is received, the electronic device can enter an interface as shown in b of Figure 14 . In the interface as shown in b of Figure 14 , the electronic device can display a panel 206 on the upper layer of the social application interface. The panel 206 can include an e-book application icon 1201.

[0209] When receiving the trigger operation for the electronic book application icon 1201, the electronic device can display a window of the electronic book application in a floating manner, as shown in the interface d of FIG. 12B. Figure 14 The interface d of FIG. 12B can include two windows, a full-screen window 1303 of the social application and a floating window 1304 of the electronic book application; the full-screen window 1303 of the social application can include a contact name and contact information, etc.; the floating window 1304 of the electronic book application can include electronic book information. The floating window 1304 of the electronic book application is located on the upper layer of the full-screen window 1303 of the social application. Figure 2

[0210] It can be understood that in this process, the electronic device can use the panel 206 to simultaneously display multiple application programs in a floating window and full-screen window manner, reduce the switching process between application program interfaces, simplify user operations, and improve the user's use experience.

[0211] The following describes the scenario of folding the panel, as shown in FIG. 13A. Figure 2 Figure 15

[0212] In a possible implementation, in a case where the electronic device receives a trigger operation for the blank area, the electronic device can cancel displaying the panel. Specifically, the electronic device can display the panel 206, as shown in the interface a of FIG. 14A. When receiving a trigger operation of the touch object in the blank area, the electronic device folds the panel, and displays an interface b as shown in FIG. 14B. The blank area can be understood as an area in which no application program icon or card is displayed in a non-overlapping area of the desktop and the panel 206. The trigger operation can be a click operation or a sliding operation. In this way, when the user does not need to use the panel, the panel can be actively folded through the trigger operation. Figure 15 Figure 15 In another possible implementation, the electronic device does not receive a trigger operation within a first preset time length, and the electronic device can cancel displaying the panel. It can be understood that after the electronic device displays the panel 206, if the user does not perform an operation on the touch screen within a period of time, the electronic device can automatically fold the panel. In this way, when the user does not need to use the panel, the panel can be automatically folded through the preset time.

[0213] In yet another possible implementation, in a case where the panel receives a trigger operation for an application program icon or card, the electronic device can cancel displaying the panel and start the corresponding application program and card service. Specifically, the interface b shown in FIG. 14B can be referred to.

[0214] In yet another possible implementation, in a case where the panel receives a trigger operation for an application program icon or card, the electronic device can cancel displaying the panel and start the corresponding application program and card service. Specifically, the interface b shown in FIG. 14B can be referred to. Figure 15 Figure 2 ​​​​​As shown in c, when the electronic device displays panel 206 and receives a trigger operation on the calendar application icon 208 in panel 206, the electronic device can retract panel 206 and display the calendar application interface.

[0215] In another possible implementation, upon receiving a trigger action on an application icon or card on the desktop, the electronic device can cancel the display panel. Alternatively, upon receiving a trigger action on an application icon or card on the desktop, the electronic device can cancel the display panel and launch the corresponding application and card service. Understandably, when the electronic device displays a panel, and the user clicks on the desktop where an application icon is present, in some embodiments, the electronic device may prioritize canceling the display panel without launching the application. In other embodiments, the electronic device may simultaneously respond to canceling the display panel and launching the application. This application does not limit this approach.

[0216] In this embodiment, the electronic device can display an event capsule in the cutout area after receiving a specific event; the electronic device can switch the event capsule to the panel through a trigger operation, thereby activating the panel. This process can be as follows: Figure 2 As shown:

[0217] After receiving a ride request, the electronic device can display something like this. Figure 2 The interface shown in Figure 'a' includes an event capsule 105. For example, the event capsule 105 can be an event capsule for a ride-hailing application, which contains relevant information about the ride-hailing application.

[0218] Upon receiving a swipe operation at event capsule 105, the electronic device can open the panel and enter. Figure 2 The interface shown in b is shown in the image. Figure 15 In the interface shown in b, panel 206 is displayed; panel 206 includes application icons and cards, such as calendar application icon 208, and cards such as weather service card 209.

[0219] Subsequently, the electronic device can quickly launch the corresponding application based on the operation of the icons or cards on panel 206; this process can be referred to Figure 15 The interface shown in b - Figure 15 The interface shown in c, or Figure 2 The interface shown in b - Figure 14 The interface shown in d is described in the present application embodiment; this will not be repeated here.

[0220] In some embodiments, the electronic device can switch back to the event capsule from the panel when the user does not need to use it. For example, after the electronic device opens panel 206, it displays... Figure 16The interface shown in b is as follows. When a trigger operation is received for a touch object in a blank area, the electronic device retracts the panel and displays as shown in Figure b. Figure 16 The interface shown in Figure c. The electronic device is in... Figure 16 Event capsule 105 continues to be displayed in the interface shown in c.

[0221] It should be noted that the electronic device needs to receive specific events during the process of switching from the event capsule to the panel and vice versa. If the electronic device does not receive a specific event, it may perform actions such as... Figure 16 The process of opening panel 206 shown, and performing, for example Figure 16 The process of closing panel 206 is shown, during which event capsule 105 is not displayed.

[0222] In this embodiment, the electronic device can hide and activate the event capsule. In one possible implementation, the electronic device can hide and activate the event capsule by swiping left or right. For example, as shown... Figure 16 As shown:

[0223] After receiving a ride request, the electronic device can display something like this. Figure 17 The interface shown in Figure 'a' displays an event capsule 105. When a rightward swipe trigger is received in the left area of ​​the status bar, the electronic device can hide the event capsule 105. For example, the electronic device displays as shown... Figure 17 The interface shown in b has a preset area 205 and does not display event capsule 105.

[0224] exist Figure 17 In the interface shown in b, when a left-swipe trigger is received in the right area of ​​the status bar, the electronic device can bring up an event capsule, displaying as shown below. Figure 17 The interface shown in c is shown in the image. Figure 17 In the interface shown in c, the electronic device continues to display event capsule 105.

[0225] Now, electronic devices can hide the event capsule by swiping right, or bring it up by swiping left.

[0226] In another possible implementation, after the electronic device hides the event capsule, it can also wake up the event capsule when it detects activities such as raising the wrist or looking.

[0227] In some embodiments, the electronic device can wake up the event capsule by raising its wrist, such as Figure 17 As shown. For example, the user refers to... Figure 17 The scene shown in Figure a is a handheld electronic device, which is currently in a hidden event capsule state. The electronic device can display, as shown in Figure a. Figure 17The interface shown in Figure b displays a preset area 205, but does not show the event capsule. When the user performs a wrist-raising operation, the electronic device can activate the event capsule. The wrist-raising operation can be, for example, performed by... Figure 17 The scene shown in Figure a transforms to Figure 18 The scenario shown in Figure c illustrates an action where, as the user adjusts their posture, the tilt angle of the electronic device changes, allowing the device to detect the user's wrist movement. When the user performs actions such as... Figure 18 After the action shown in Figure c, the electronic device can be... Figure 18 Switching to the interface shown in b Figure 18 The interface shown in d is... Figure 18 The interface shown in d includes event capsule 105. At this point, the electronic device wakes up the event capsule based on a wrist-raise operation.

[0228] In other embodiments, the electronic device can wake up the event capsule via gaze actions, such as... Figure 18 As shown. For example, after an electronic device hides the event capsule, the electronic device can display something like this. Figures 2-15 The interface shown in Figure 'a' displays a preset area 205. After the electronic device detects that the user is gazing at the preset area 205 for more than a third preset duration, the electronic device can wake up the event capsule 105, and the electronic device will then... Figures 16-18 Switch to the interface shown in middle a Figures 2-18 The interface shown in c is an example. The user's operation while focusing on the preset area 205 can be, for example... Figure 19 The scenario is shown in Figure b. At this point, the electronic device wakes up the event capsule based on gaze-based actions.

[0229] In this embodiment, the electronic device can display motion effects showing the gaze progress after receiving a gaze operation. For example, during the period when the user gazes at a preset area 205, the electronic device can display, as shown below. Figures 1-18 The interface shown in d is an example. This interface can display animation 1801, the color of which can differ from the color of the preset area 205 to highlight the user's gaze action currently detected by the electronic device. Animation 1801 can be a line surrounding the preset area 205, the length of which is related to the gaze duration; the longer the gaze duration, the longer the line, and the closer animation 1801 becomes to a closed capsule-shaped rounded rectangle. When the gaze duration reaches a third preset duration, the lines connect end to end, forming a complete capsule-shaped rounded rectangle. In this way, the user can understand the current gaze progress through animation 1801.

[0230] Optionally, embodiments of this application may also use other methods to indicate the gaze progress, such as displaying a progress bar or countdown text information. Embodiments of this application do not limit the specific implementation of the prompt information used to indicate that the user is gazing at the wake-up panel.

[0231] It should be noted that in the embodiments of the present application, the electronic device can realize the functions of the embodiments shown in the drawings alone Figure 20 The electronic device can also realize the functions of the embodiments shown in the drawings alone Figure one Or, the electronic device can realize the functions of the embodiments shown in the drawings simultaneously. The embodiments of the present application do not limit this. Figure one

[0232] 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 for analysis, stored data, displayed data, etc.) involved in the present application are all information and data authorized by the user or authorized by all parties, and the collection, use and processing of related data need to comply with relevant laws, regulations and standards of relevant countries and regions, and provide corresponding operation portal for user to choose authorization or refusal.

[0233] In order to better understand the embodiments of the present application, the structure of the terminal device of the embodiments of the present application is introduced as follows:

[0234] ​ The structure schematic diagram of the terminal device 100 is shown. The terminal device 100 can include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (universal serial bus, USB) interface 130, a charge management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a loudspeaker 170A, a receiver 170B, a microphone 170C, a earphone interface 170D, a sensor module 180, a key 190, a motor 191, an indicator 192, a camera 193, a display screen 194, a subscriber identification module (subscriber identification module, SIM) card interface 195 and an embedded secure element (embedded secure element, eSE) 196, etc. The sensor module 180 can include a pressure sensor 180A, a gyroscope sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity light 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.

[0235] ​It can be understood that the structure shown in the embodiments of the present application does not constitute a specific limitation on the terminal device 100. In other embodiments of the present application, the terminal device 100 can include more or fewer components than shown, or combine certain components, or split certain components, or different component arrangements. The components shown can be implemented in hardware, software, or a combination of software and hardware.

[0236] The processor 110 can include one or more processing units, for example: the processor 110 can include an application processor (AP), a modem processor, a graphics processing unit (GPU), an image signal processor (ISP), a controller, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural-network processing unit (NPU), etc. Among them, different processing units can be independent devices, or can be integrated in one or more processors.

[0237] The terminal device 100 implements the display function through the GPU, the display screen 194, and the application processor, etc. The display screen 194 is used to display images, videos, etc. In the embodiments of the present application, the display screen 194 can be used to display the interface in the scenario shown. ​

[0238] The terminal device 100 can implement the shooting function through the ISP, the camera 193, the video codec, the GPU, the display screen 194, and the application processor, etc.

[0239] The camera 193 is used to capture still images or videos. In the embodiments of the present application, the electronic device 100 can use the camera to detect the gaze action.

[0240] ​Internal memory 121 can be used to store executable program code, including instructions. Internal memory 121 may include a program storage area and a data storage area. The program storage area may store the operating system, at least one application program required for a function (such as sound playback, image playback, etc.), etc. The data storage area may store data created during the use of the terminal device 100 (such as audio data, phonebook, etc.). Furthermore, internal memory 121 may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, universal flash storage (UFS), etc. Processor 110 executes various functional applications and data processing of the terminal device 100 by running instructions stored in internal memory 121 and / or instructions stored in memory located within the processor.

[0241] The gyroscope sensor 180B can be used to determine the motion attitude of the terminal device 100. In some embodiments, the gyroscope sensor 180B can determine the angular velocity of the terminal device 100 around three axes (i.e., the x, y, and z axes). The gyroscope sensor 180B can be used for image stabilization. For example, when the shutter is pressed, the gyroscope sensor 180B detects the angle of the terminal device 100's shake, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to counteract the shake of the terminal device 100 through reverse movement, thus achieving image stabilization. The gyroscope sensor 180B can also be used in navigation and motion-sensing game scenarios.

[0242] The 180E accelerometer sensor can detect the magnitude of acceleration of the terminal device 100 in various directions (typically three axes). When the terminal device 100 is stationary, it can detect the magnitude and direction of gravity. It can also be used to identify the attitude of the terminal device and applied to applications such as screen orientation switching and pedometers.

[0243] The display method of the present application embodiments has been described above. The apparatus for performing the above display method provided in the present application embodiments is described below. 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 display method.

[0244] like ​ As shown, the display device 2000 can be used in communication equipment, circuits, hardware components, or chips. The display device includes a display unit 2001 and a processing unit 2002. The display unit 2001 supports the display steps performed by the display device 2000; the processing unit 2002 supports the information processing steps performed by the display device 2000.

[0245] In a possible implementation, the display device 2000 can also include a communication unit 2003. Specifically, the communication unit is configured to support the display device 2000 to perform the steps of transmitting data and receiving data. The communication unit 2003 can be an input or output interface, a pin, or a circuit, etc.

[0246] In a possible implementation, the display device can further include a storage unit 2004. The processing unit 2002 and the storage unit 2004 are connected through a line. The storage unit 2004 can include one or more memories, and the memory can be a device for storing programs or data in one or more devices or circuits. The storage unit 2004 can exist independently and be connected to the processing unit 2002 of the display device through a communication line. The storage unit 2004 can also be integrated with the processing unit 2002.

[0247] The storage unit 2004 can store computer execution instructions of the method in the terminal device, so that the processing unit 2002 executes the method in the above embodiments. The storage unit 2004 can be a register, a cache, or a RAM, and the storage unit 2004 can be integrated with the processing unit 2002. The storage unit 2004 can be a read-only memory (ROM) or other types of static storage devices that can store static information and instructions, and the storage unit 2004 can be independent of the processing unit 2002.

[0248] The display method provided by the embodiments of the present application can be applied to an electronic device with a communication function. The electronic device includes an electronic device, and the specific device form of the electronic device can refer to the related description above, which will not be repeated here.

[0249] The embodiments of the present application provide an electronic device, which includes: a processor and a memory; the memory stores computer execution instructions; and the processor executes the computer execution instructions stored in the memory, so that the electronic device executes the above method.

[0250] The embodiments of the present application provide a chip system, which includes at least one processor and a communication interface. The communication interface and the at least one processor are connected through a line. The at least one processor is configured to run a computer program or instructions to execute the above method. The implementation principle and technical effects are similar to those of the above related embodiments, which will not be repeated here.

[0251] The embodiment of the present application further provides a computer readable storage medium. The computer readable storage medium stores a computer program. The computer program is executed by a processor to implement the method described above. The method described in the above embodiment can be implemented by software, hardware, firmware or any combination thereof, in whole or in part. If implemented in software, the functions can be stored in or transmitted as one or more instructions or code on a computer-readable medium. The computer-readable medium can include a computer storage medium and a communication medium, and can further include any medium that can carry the computer program from one place to another. The storage medium can be any target medium that can be accessed by a computer.

[0252] In a possible implementation, the computer readable medium can include RAM, ROM, compact disc read-only memory (CD-ROM) or other optical disk storage, magnetic disk storage or other magnetic storage devices, or any other medium that is targeted to carry desired program codes in the form of instructions or data structures and can be accessed by a computer. Moreover, 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 a coaxial cable, fiber optic cable, twisted pair, digital subscriber line (DSL) or wireless technology (such as infrared, radio and microwave), the coaxial cable, fiber optic cable, twisted pair, DSL or wireless technology (such as infrared, radio and microwave) is included in the definition of the medium. As used herein, a disk and a disc include compact discs, laser discs, optical discs, digital versatile discs (DVDs), floppy disks and Blu-ray discs, wherein a disk usually reproduces data magnetically, while a disc reproduces data optically with a laser. Combinations of the above should also be included in the scope of the computer readable medium.

[0253] The embodiment of the present application provides a computer program product, which includes a computer program. When the computer program is executed, the computer program causes the computer to execute the method described above.

[0254] The embodiments of the present application are described with reference to flowcharts and / or block diagrams according to the methods, devices (systems) and computer program products of the embodiments of the present application. It should be understood that each flow and / or block in the flowcharts and / or block diagrams, and the combination of the flows and / or blocks in the flowcharts and / or block diagrams can be implemented by computer program instructions. These computer program instructions can be provided to a general purpose computer, a special purpose computer, an embedded processor or other programmable data processing apparatus to produce a machine, so that the instructions executed by the computer or other programmable data processing apparatus produce a device that implements the functions described in the flowcharts and / or block diagrams. ​apparatuses that perform the function specified by a block or blocks. ​

[0255] The above detailed description has shown, described and pointed out the manner in which the present application can be performed. It is understood that various omissions and substitutions for the specific embodiments described can be made without departing from the spirit of the application, and that the scope of the application is not to be limited by the specific embodiments for which it has been described.​

Claims

1. A display method, characterized in that, Applied to electronic devices, the method includes: Display a first interface, which includes one or more elements; the elements include the application's icon and / or the application's card; In response to a drag operation of dragging a first element among the one or more elements, control the first element to move along the trajectory of the drag operation, and display a first window; When the first element moves to a first area of ​​the electronic device, an identifier of the first element is displayed in the first window; in response to the first operation, a second window is displayed in the first interface; the second window includes one or more elements added to the first window; In response to a second operation on the first element in the second window, a second interface is displayed; the second interface includes launching the display interface corresponding to the first element.

2. The method according to claim 1, characterized in that, Following the display of the second interface, the following is also included: In response to the first operation, the second window is displayed in the second interface; the second window also includes a second element, which is different from the first element; In response to the second operation on the second element in the second window, a third interface is displayed; the third interface includes the display interface corresponding to the second element.

3. The method according to claim 2, characterized in that, After the second window is displayed in the second interface, the following is also included: In response to a third operation in the second window, a third element is displayed in the second window, while the first element and the second element are not displayed; the first element is different from the third element, and the second element is different from the third element.

4. The method according to any one of claims 1-3, characterized in that, After displaying the second window in the first interface, the following is also included: In response to the drag operation of the first element in the second window, control the first element to move along the trajectory of the drag operation; If the first element is moved out of the second window, the first element is de-displayed in the second window.

5. The method according to claim 4, characterized in that, When the first element is displayed in the second window, the first element is located at a first position in the second window, and the first element is also displayed at a second position in the first interface; the first position is different from the second position. When the first element is not displayed in the second window, the first element is displayed at the second position of the first interface; Alternatively, when the first element is not displayed in the second window, the first element is displayed in the third position of the first interface, and the first element is not displayed in the second position of the first interface; the third position is different from the second position.

6. The method according to any one of claims 1-5, characterized in that, After displaying the second window in the first interface, the following is also included: In response to a fourth operation on the first element in the second window, a delete control is displayed above the first element; In response to a triggered operation on the delete control, the first element is de-displayed in the second window.

7. The method according to any one of claims 1-6, characterized in that, The first element is located at a first position in the second window. After the second window is displayed in the first interface, the following is also included: In response to the drag operation of the first element in the second window, control the first element to move along the trajectory of the drag operation; If the first element moves to the fourth position in the second window, the first element is displayed at the fourth position in the second window, and the first element is not displayed at the first position in the second window.

8. The method according to any one of claims 1-7, characterized in that, Also includes; A fourth interface is displayed, which includes the second window; Upon receiving a trigger operation targeting the second region, the second window is de-displayed in the fourth interface; the second region does not include the area where the second window is located. Alternatively, if the display duration of the second window is greater than or equal to the first preset duration and the electronic device does not receive a trigger operation, the second window may be canceled from display on the fourth interface.

9. The method according to any one of claims 1-8, characterized in that, When the first element moves to a first area of ​​the electronic device, displaying an identifier of the first element in the first window includes: When the first element is moved to a first area of ​​the electronic device, a first identifier of the first element is displayed in the first window; the first identifier is used to indicate that the first element can be added to the first window. If the duration of the drag-and-drop operation is less than or equal to a second preset duration, a second identifier of the first element is displayed in the first window; the second identifier indicates that the first element has been added to the first window. If the duration of the drag operation exceeds the second preset duration, the first window will be removed from the first interface. Wherein, the size of the first window that does not display the identifier of the first element is less than or equal to the size of the first window that displays the first identifier; the size of the first window that displays the first identifier is less than or equal to the size of the first window that displays the second identifier.

10. The method according to any one of claims 1-9, characterized in that, Following the display of the second interface, the following is also included: In response to the first operation, the second window is displayed in the second interface; the second window also includes a second element; In response to the second operation on the second element in the second window, a third window and a fourth window are displayed; the third window displays part or all of the content in the second interface, and the fourth window displays part or all of the content in the display interface corresponding to the second element; Wherein, both the third window and the fourth window are split-screen windows; or, the third window is a full-screen window and the fourth window is a floating window, the fourth window is located above the third window, and the size of the fourth window is smaller than or equal to the size of the third window.

11. The method according to any one of claims 1-10, characterized in that, During the process of dragging and moving the first element, the first element is not displayed at the second position of the first interface.

12. The method according to any one of claims 1-11, characterized in that, Also includes: The fifth interface is displayed, which includes a fifth window. The fifth window displays information about preset applications or preset services. The information about preset applications or preset services includes at least one of the following: information about call applications, alarm clock applications, recording applications, music applications, ride-hailing applications, trip services, express delivery services, and / or food delivery services. In response to the first operation on the fifth window, the second window is displayed in the fifth interface.

13. The method according to claim 12, characterized in that, Following the display of the fifth interface, the following is also included: In response to a fifth operation on the fifth window, the fifth window is de-displayed in the fifth interface; If the system detects that the user is holding the electronic device and making a wrist-raising motion, the fifth window will be displayed again on the fifth interface.

14. The method according to claim 12, characterized in that, Following the display of the fifth interface, the following is also included: In response to a fifth operation on the fifth window, the fifth window is de-displayed in the fifth interface; If the duration of the user's gaze at the third region is greater than or equal to the third preset duration, the fifth window is displayed again on the fifth interface.

15. The method according to claim 14, characterized in that, During the time the user gazes at the third region, the third region displays a third identifier, which changes as the duration of the user's gaze at the third region increases.

16. The method according to claim 14 or 15, characterized in that, The third area includes a camera.

17. The method according to any one of claims 1-16, characterized in that, The first operation includes a swipe down in the third area; the second operation includes a tap; the third operation includes a swipe; the fourth operation includes a long press; and the fifth operation includes a swipe.

18. An electronic device, characterized in that, include: Processor and memory; The memory stores computer-executed instructions; The processor executes computer execution instructions stored in the memory, causing the electronic device to perform the method as described in any one of claims 1-17.

19. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by a processor, it implements the method as described in any one of claims 1-17.

20. A chip system, characterized in that, It includes at least one processor and a communication interface, the communication interface and the at least one processor being interconnected via a line, the at least one processor being configured to run a computer program or instructions to perform the method as described in any one of claims 1-17.

21. A computer program product, characterized in that, Includes a computer program that, when run, causes a computer to perform the method as described in any one of claims 1-17.

Images