WO2021159922A1 - 卡片显示方法、电子设备及计算机可读存储介质 - Google Patents

卡片显示方法、电子设备及计算机可读存储介质 Download PDF

Info

Publication number
WO2021159922A1
WO2021159922A1 PCT/CN2021/072592 CN2021072592W WO2021159922A1 WO 2021159922 A1 WO2021159922 A1 WO 2021159922A1 CN 2021072592 W CN2021072592 W CN 2021072592W WO 2021159922 A1 WO2021159922 A1 WO 2021159922A1
Authority
WO
WIPO (PCT)
Prior art keywords
card
icon
application
area
current screen
Prior art date
Application number
PCT/CN2021/072592
Other languages
English (en)
French (fr)
Inventor
徐杰
王守诚
Original Assignee
荣耀终端有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 荣耀终端有限公司 filed Critical 荣耀终端有限公司
Priority to JP2022546526A priority Critical patent/JP2023513063A/ja
Priority to AU2021220808A priority patent/AU2021220808B2/en
Priority to EP21754479.0A priority patent/EP4068065A4/en
Priority to CN202180002184.3A priority patent/CN113508360B/zh
Priority to US17/793,480 priority patent/US20230077467A1/en
Priority to KR1020227024343A priority patent/KR20220110314A/ko
Priority to CN202210389179.9A priority patent/CN114911380B/zh
Publication of WO2021159922A1 publication Critical patent/WO2021159922A1/zh
Priority to AU2024200478A priority patent/AU2024200478A1/en

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04817Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance using icons
    • GPHYSICS
    • G02OPTICS
    • G02FOPTICAL DEVICES OR ARRANGEMENTS FOR THE CONTROL OF LIGHT BY MODIFICATION OF THE OPTICAL PROPERTIES OF THE MEDIA OF THE ELEMENTS INVOLVED THEREIN; NON-LINEAR OPTICS; FREQUENCY-CHANGING OF LIGHT; OPTICAL LOGIC ELEMENTS; OPTICAL ANALOGUE/DIGITAL CONVERTERS
    • G02F1/00Devices or arrangements for the control of the intensity, colour, phase, polarisation or direction of light arriving from an independent light source, e.g. switching, gating or modulating; Non-linear optics
    • G02F1/01Devices or arrangements for the control of the intensity, colour, phase, polarisation or direction of light arriving from an independent light source, e.g. switching, gating or modulating; Non-linear optics for the control of the intensity, phase, polarisation or colour 
    • G02F1/13Devices or arrangements for the control of the intensity, colour, phase, polarisation or direction of light arriving from an independent light source, e.g. switching, gating or modulating; Non-linear optics for the control of the intensity, phase, polarisation or colour  based on liquid crystals, e.g. single liquid crystal display cells
    • G02F1/133Constructional arrangements; Operation of liquid crystal cells; Circuit arrangements
    • G02F1/1333Constructional arrangements; Manufacturing methods
    • G02F1/13338Input devices, e.g. touch panels
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0482Interaction with lists of selectable items, e.g. menus
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0483Interaction with page-structured environments, e.g. book metaphor
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04883Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures for inputting data by handwriting, e.g. gesture or text
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04886Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures by partitioning the display area of the touch-screen or the surface of the digitising tablet into independently controllable areas, e.g. virtual keyboards or menus
    • HELECTRICITY
    • H10SEMICONDUCTOR DEVICES; ELECTRIC SOLID-STATE DEVICES NOT OTHERWISE PROVIDED FOR
    • H10KORGANIC ELECTRIC SOLID-STATE DEVICES
    • H10K59/00Integrated devices, or assemblies of multiple devices, comprising at least one organic light-emitting element covered by group H10K50/00
    • H10K59/40OLEDs integrated with touch screens

Definitions

  • This application relates to the field of information display, and in particular to card display methods, electronic equipment and computer-readable storage media.
  • Cards can enable users to view related information intuitively and conveniently on electronic devices or run specific functions under a certain application, and are widely used.
  • the existing card display position is fixed and not flexible enough; the display and switching operations of the card are cumbersome and the management cost is high; the card occupies the icon, affects the desktop layout, or obscures the icon, which causes inconvenience to the operation of the application corresponding to other icons.
  • this application proposes a card display method, an electronic device, and a computer-readable storage medium; this allows users to simply operate on the current screen of the desktop (home screen). It realizes card display, switching and control of other applications, flexible card location, low management cost, convenient operation, and improved user experience.
  • an electronic device includes: a display screen; one or more processors; a memory; and one or more computer programs, wherein the one or more computer programs are stored on the memory, and when the computer program is When executed by or multiple processors, the electronic device is caused to perform the following steps: display the current screen of the desktop, the current screen displays several icons; and the first user input to a first icon among the several icons is detected In response to the first user input, the current screen displays a first card, the first card does not occupy the current screen; the first icon is a first folder icon, the first folder The icon includes at least a first application icon, and the first application icon corresponds to a first application; or, the first icon is a first application icon, and the first application icon corresponds to a first application; the first card includes at least : The first card content, the first card content includes part of the content contained in the M-th layer interface after the first application is opened, and M is a positive integer greater than or equal to 1; N controls, among the N
  • the application corresponds to the corresponding icon on the desktop before the first card is displayed.
  • N is a positive integer greater than or equal to 1; the first card is different from the first card.
  • All and any part of the M-th layer interface after an application is opened.
  • the fact that the first card is different from all and any part of the M-th layer interface after the first application is opened means that the first card is different from all of the M-th layer interface after the first application is opened. It is different from any part of the M-th layer interface after the first application is opened. In this way, the first card can be displayed on the current screen through the user's input to the first icon, and the current screen does not need to be switched to other screens, the cost of card management is low, and the location of the displayed card is more flexible.
  • the scope of the content of the first card is limited; the content of the first card can only display the key information, and then the key information can be obtained intuitively and quickly.
  • the user since the first card is displayed on the current screen of the desktop and does not occupy the current screen, the user can still intuitively obtain the information displayed in the area other than the first card on the current screen, and directly perform operations on the current screen. For example, touch the icon displayed in the area other than the first card on the current screen to open the corresponding application, and slide the background displayed in the area other than the first card on the current screen of the desktop to switch to other screens.
  • the user can also directly open the corresponding application through each of the N controls on the first card.
  • the user can intuitively obtain the content of the first card, can directly open the application corresponding to one of the N controls, and can directly operate the current screen, taking into account the user’s convenience to the three parties. It has a balance in the convenience of the three parties.
  • the first card will always be displayed on the current screen. In this way, when the user has been using the first card content in the near future, after the first card is displayed on the current screen, the user does not need to perform the first user input, and directly uses the first card content on the current screen.
  • the technical features included in the technical solution are closely related to each other to form an inseparable whole. It is precisely because of such a whole that the technical solution produces the above-mentioned beneficial technical effects.
  • the solutions corresponding to the following embodiments are all the same, and will not be repeated one by one.
  • the area of the first card on the current screen is the first area; before the first card is displayed, the N icons are located The first area; or, the N icons are located in an area other than the first area on the current screen; or, the N icons are located on a screen other than the current screen on the desktop; or, the Any part of the N icons is located in any of the above three areas.
  • the N icons corresponding to the N controls on the first card can be located in the first area, in an area other than the first area on the current screen, or in the current screen on the desktop. External screen; thus, the application corresponding to any icon displayed on the desktop can be opened on the first card, which is more convenient for users.
  • the first user input is input through a one-step operation; the first card content occupies the largest area on the first card; the first card The area of the content of a card is greater than or equal to the area of the first icon; the area of the first card on the current screen is the first area; the current screen also displays a background; before the first card is displayed,
  • the N controls correspond to N icons, the N icons are displayed on the first area, and the first area includes only the first part of the background, the first icon, and the N icons, The number of icons included in the first area is equal to N plus 1.
  • the above-mentioned card can be displayed only by performing one operation on the current screen, which greatly reduces the cost of card management steps, which is conducive to user operations and enhances user experience; the content of the first card is displayed more prominently, which is convenient for users Obtain the content of the first card intuitively and quickly; it is further clarified that the display position of the first card on the current screen is before the first card is displayed, including the first icon, the N icons and the second part of the background The position on the current screen; thus, it is more convenient for the user to obtain the positional relationship between the first card, the first icon, and the N icons.
  • M is a positive integer greater than or equal to 2.
  • the interface below the second layer, the third layer, etc. after the first application is opened can be directly displayed on the card, which reduces the number of operation steps and is convenient for the user.
  • the payment code interface of Alipay is the second layer interface of Alipay, which is directly displayed through user input.
  • Other deeper interfaces below level 2 can also be directly displayed through user input.
  • the electronic device further performs the following steps: detecting a second user input to one of the N controls; responding to the second User input, display the S-th layer interface after the application corresponding to one of the N controls is opened; S is a positive integer greater than or equal to 1; a return operation is detected; in response to the return operation, display the current Screen; the content displayed on the current screen is the content displayed on the current screen before responding to the input of the second user.
  • the electronic device further performs the following steps: detecting a third user input to the first card on the current screen; responding to the first card Three user inputs, the content displayed in the first area is the content displayed in the first area before responding to the first user input.
  • the display of the first card can be stopped through a third user input on the current screen, and there is no need to switch the current screen to another screen, which greatly reduces the cost of card management steps, and is convenient to operate. Switch back to the situation of responding to the content displayed in the first area before the first user input.
  • the electronic device further executes the following steps: the area on the current screen other than the first area further displays L icons, and L is a positive value greater than or equal to 1. Integer; a fourth user input to one of the L icons is detected; in response to the fourth user input, the interface after the application corresponding to one of the L icons is opened is displayed; one is detected Return operation; in response to the return operation, the current screen is displayed, and the content displayed on the current screen is the content displayed on the current screen before responding to the fourth user input.
  • the user opens the corresponding application through the operation of one of the L icons displayed in the area outside the first area on the current screen, and the operation is convenient; the slave L
  • the interface returns to the content displayed on the current screen before responding to the fourth user input, that is, it returns to the current screen displaying the first card, and this method is for the user
  • the operation is simple and easy, and it can quickly switch back to the current screen displaying the first card.
  • the first card further includes: a first control, the first control is used to open the first application; the first control is The first icon is a control displayed after the first scale is reduced; the N controls are controls displayed after the N icon is reduced by the second scale; the area of the first control is larger than the area of any one of the N controls
  • the first control, the N controls, and the content of the first card are respectively displayed in the upper left corner, upper right corner, and lower middle of the first card;
  • the first user input is the first voice input or the first A gesture input;
  • the first gesture input is a gesture input where the starting point is located on the first icon, and the sliding direction is a gesture input of sliding upward;
  • the first card changes with the first gesture input;
  • the second user The input and the fourth user input are respectively: a second voice input and a fourth voice input, or a second gesture input and a fourth gesture input; the second gesture input and the fourth gesture input are touch Input;
  • the third gesture input is input through a one-step operation
  • the user can understand through the first card that the application corresponding to the N controls can be opened on the first card; in addition, the first control is highlighted through a larger area, so that the user can learn about the first
  • the content of the card corresponds to the first control; it provides the first control on the first card, N controls, and the preferred distribution and display mode of the first card content; moreover, two specific methods of user input are clarified; and only need Operating on the current screen does not need to switch the current screen to other screens on the desktop, which greatly reduces the cost of card management steps, facilitates operation, and improves user experience; in addition, it provides an optimal user experience that is convenient for user operation and memory.
  • the third gesture input mode enables the user to memorize the first gesture input mode together.
  • the electronic device further executes the following steps: detecting a fifth user input to a second icon among the plurality of icons; responding to the first Five user input, the current screen displays a second card, the second card does not occupy the current screen; the second icon is a second folder icon, the second folder icon includes at least a second application An icon, the second application icon corresponds to a second application; or, the second icon is a second application icon, and the second application icon corresponds to a second application; the second card includes at least: second card content, The second card content corresponds to the second application, and the second card content includes part of the content contained in the P-th layer interface after the second application is opened, and P is a positive integer greater than or equal to 1; K Controls, each of the K controls is used to open a corresponding application, the application corresponds to a corresponding icon on the desktop before the second card is displayed, K is a positive integer greater than or equal to 1;
  • the second card is different
  • the second card can be displayed on the current screen; and the technical effect of displaying the second card on the current screen is the same as the technical effect of displaying the first card on the current screen.
  • the scope of the content of the second card is further limited, and part of redundant information is excluded, so that the content of the second card acquired or used by the user is simplified. That is to say, after the second card is displayed on the current screen and the second card does not occupy the current screen, the user can not only intuitively obtain the content of the second card, but also directly open the fourth application, and also directly access the current screen.
  • the operation of the screen takes into account the convenience of the three, and realizes the balance of the three in the convenience of use.
  • the first card and the second card can be displayed on the current screen.
  • the display of the second card has the same operation flow as the display of the first card.
  • the content displayed by the second card is the same as the content displayed by the first card and the The icon based on the second card display is different from the icon based on the first card display.
  • the display of the first card and the display of the second card can be independent of each other and do not affect each other.
  • the second card is always displayed on the current screen. In this way, when the user has been using the second card content in the near future, after the second card is displayed on the current screen, the user does not need to perform the fifth user input, and directly uses or obtains the current screen and the second card.
  • the second card content corresponding to the icon are clarified, and how to display the two cards if they cannot be displayed together.
  • the electronic device further executes the following steps: the fifth user input is input through a one-step operation; the content of the second card is on the second card The area of the second card accounts for the largest proportion; the area of the second card content is greater than or equal to the area of the second icon; before the second card is displayed, the K controls correspond to K icons, and the K icons are displayed On the second area, the second area includes only the second part of the background, the second icon, and the K icons, and the number of icons included in the second area is equal to K plus 1. .
  • the K icons corresponding to the K controls on the second card may be located in the second area, may be located in an area other than the second area on the current screen, or may be located on the current screen on the desktop. External screen; thus, the application corresponding to any icon displayed on the desktop can be opened on the second card, which is more convenient for users.
  • the electronic device further performs the following steps: detecting a sixth user input to one of the K controls; responding to the sixth user input User input displays the Q-th layer interface after the application corresponding to one of the K controls is opened; Q is a positive integer greater than or equal to 1; a return operation is detected; in response to the return operation, the current Screen; the content displayed on the current screen is the content displayed on the current screen before responding to the fifth user input.
  • the electronic device further executes the following steps: detecting a seventh user input to the second card on the current screen; responding to the first Seven user input, the content displayed in the second area is the content displayed in the second area before responding to the fifth user input.
  • the display of the second card can be stopped through a seventh user input on the current screen, and there is no need to switch the current screen to another screen, so that the cost of card management steps and other costs are greatly reduced, the operation is convenient, and the operation can be fast. Switch back to the situation of responding to the content displayed in the first area before the fifth user input.
  • the electronic device further performs the following steps: R icons are displayed in areas other than the second area on the current screen, where R is a positive value greater than or equal to 1. Integer; the eighth user input to one of the R icons is detected; in response to the eighth user input, the opened interface of the application corresponding to one of the R icons is displayed; one is detected Return operation; in response to the return operation, the current screen is displayed, and the content displayed on the current screen is the content displayed on the current screen before responding to the eighth user input.
  • the user can open the corresponding application through the operation of one of the R icons displayed in the area outside the second area on the current screen, and the operation is convenient; the slave R icon is also provided.
  • the interface after the application corresponding to one of the icons is opened returns the content displayed on the current screen before responding to the eighth user input, and this method is simple and easy for the user to operate.
  • the second card further includes: a second control, the second control is used to open the second application; the second control is The second icon is a control displayed after being reduced to a third scale; the K controls are controls that are displayed after the K icons are reduced to a fourth scale; the area of the second control is larger than the area of any one of the K controls
  • the shape and size of the first card are the same as those of the second card; the first ratio and the second ratio are the same as the third and fourth ratios, respectively;
  • the second control, the K controls, and the content of the second card are respectively displayed in the upper left corner, the upper right corner, and the lower middle of the second card;
  • the fifth user input is a fifth voice input or a fifth gesture Input;
  • the fifth gesture input is a gesture input where the starting point is located on the second icon, and the sliding direction is a gesture input of sliding upward; the second card changes with the fifth gesture input; the sixth user input,
  • the seventh user input and the eighth user input are respectively:
  • the seventh gesture input mode allows the user to memorize the fifth gesture input mode together.
  • a card display method is provided.
  • the method is applied to an electronic device including a display screen, and includes: the display screen displays the current screen of the desktop, and the current screen displays a number of icons; detecting a first user to one of the plurality of icons Input; in response to the first user input, the current screen displays a first card, the first card does not occupy the current screen; the first icon is a first folder icon, the first file
  • the folder icon includes at least a first application icon, and the first application icon corresponds to a first application; or, the first icon is a first application icon, and the first application icon corresponds to a first application;
  • the first card is at least Including: the first card content, the first card content includes part of the content contained in the M-th layer interface after the first application is opened, M is a positive integer greater than or equal to 1; N controls, among the N controls Each control of is used to open the corresponding application, the application corresponds to the corresponding icon on the desktop before the first card is displayed, N is a
  • the fact that the first card is different from all and any part of the M-th layer interface after the first application is opened means that the first card is different from all of the M-th layer interface after the first application is opened. It is different from any part of the M-th layer interface after the first application is opened.
  • the first card can be displayed on the current screen through the user's input to the first icon, and the current screen does not need to be switched to other screens, the cost of card management is low, and the location of the displayed card is more flexible.
  • the scope of the content of the first card is limited; the content of the first card can only display the key information, and then the key information can be obtained intuitively and quickly.
  • the user can still intuitively obtain the information displayed in the area other than the first card on the current screen, and directly perform operations on the current screen. For example, touch the icon displayed in the area other than the first card on the current screen to open the corresponding application, and slide the background displayed in the area other than the first card on the current screen of the desktop to switch to other screens.
  • the user can also directly open the corresponding application through one of the N controls on the first card. That is to say, the user can intuitively obtain the content of the first card, can directly open the application corresponding to one of the N controls, and can directly operate the current screen, taking into account the user’s convenience to the three parties.
  • the first card will always be displayed on the current screen. In this way, when the user has been using the first card content in the near future, after the first card is displayed on the current screen, the user does not need to perform the first user input, and directly uses the first card content on the current screen.
  • the method includes: the first user input is input through a one-step operation; the area of the first card content on the first card accounts for the largest proportion; the area of the first card content is greater than or equal to The area of the first icon; the area of the first card on the current screen is the first area; the current screen also displays a background; before the first card is displayed, the N controls correspond to N Icons, the N icons are displayed on the first area, the first area includes only the first part of the background, the first icon and the N icons, and the first area includes The number of icons is equal to N plus 1.
  • the above-mentioned card can be displayed only by performing one operation on the current screen, which greatly reduces the cost of card management steps, which is conducive to user operations and enhances user experience; the content of the first card is displayed more prominently, which is convenient for users Obtain the content of the first card intuitively and quickly; it is further clarified that the display position of the first card on the current screen is before the first card is displayed, including the first icon, the N icons and the second part of the background The position on the current screen; thus, it is more convenient for the user to obtain the positional relationship between the first card, the first icon, and the N icons.
  • the method includes: detecting a second user input to one of the N controls; and in response to the second user input, displaying The S-th layer interface after the application corresponding to one of the N controls is opened; S is a positive integer greater than or equal to 1; a return operation is detected; in response to the return operation, the current screen is displayed; The content displayed on the current screen is the content displayed on the current screen before responding to the input of the second user.
  • the method includes: detecting a third user input to the first card on the current screen; in response to the third user input, The content displayed in the first area is the content displayed in the first area before responding to the input of the first user.
  • the display of the first card can be stopped through a third user input on the current screen, and there is no need to switch the current screen to another screen, which greatly reduces the cost of card management steps, and is convenient to operate. Switch back to the situation of responding to the content displayed in the first area before the first user input.
  • the method includes: displaying L icons in an area other than the first area on the current screen, where L is a positive integer greater than or equal to 1; detected A fourth user input to one of the L icons; in response to the fourth user input, display the opened interface of the application corresponding to one of the L icons; detect a return operation; respond In the return operation, the current screen is displayed, and the content displayed on the current screen is the content displayed on the current screen before responding to the fourth user input.
  • the user opens the corresponding application through the operation of one of the L icons displayed in the area outside the first area on the current screen, and the operation is convenient; the slave L
  • the interface returns to the content displayed on the current screen before responding to the fourth user input, that is, it returns to the current screen displaying the first card, and this method is for the user
  • the operation is simple and easy, and it can quickly switch back to the current screen displaying the first card.
  • the method includes: the first card further includes: a first control, the first control is used to open the first application; the The first control is a control that is displayed after the first icon is reduced by a first scale; the N controls are controls that are displayed after N icons are reduced by a second scale; the area of the first control is larger than that of the N controls The area of any one control; the first control, the N controls, and the content of the first card are respectively displayed in the upper left corner, upper right corner, and lower middle of the first card; the first user input is the first A voice input or a first gesture input; the first gesture input is a gesture input where the starting point is located on the first icon, and the sliding direction is an upward sliding gesture input; the first card changes with the first gesture input; The second user input and the fourth user input are respectively: a second voice input and a fourth voice input, or, a second gesture input and a fourth gesture input; the second gesture input and the first gesture input
  • the four-gesture input are respectively: a second voice input and a fourth voice input, or
  • the user can understand through the first card that the application corresponding to the N controls can be opened on the first card; in addition, the first control is highlighted through a larger area, so that the user can learn about the first
  • the content of the card corresponds to the first control; it provides the first control on the first card, N controls, and the preferred distribution and display mode of the first card content; moreover, two specific methods of user input are clarified; and only need Operating on the current screen does not need to switch the current screen to other screens on the desktop, which greatly reduces the cost of card management steps, facilitates operation, and improves user experience; in addition, it provides an optimal user experience that is convenient for user operation and memory.
  • the third gesture input mode enables the user to memorize the first gesture input mode together.
  • the method includes: detecting a fifth user input to a second icon among the plurality of icons; in response to the fifth user input, The current screen displays a second card, and the second card does not occupy the current screen; the second icon is a second folder icon, and the second folder icon includes at least a second application icon.
  • the second application icon corresponds to the second application; or, the second icon is a second application icon, and the second application icon corresponds to the second application;
  • the second card includes at least: second card content, the second The card content corresponds to the second application, and the second card content includes part of the content contained in the P-th layer interface after the second application is opened, and P is a positive integer greater than or equal to 1;
  • K controls the Each of the K controls is used to open a corresponding application, the application corresponding to the corresponding icon on the desktop before the second card is displayed, K is a positive integer greater than or equal to 1;
  • the second card Different from all or any part of the P-th layer interface after the second application is opened;
  • the area of the second card content is larger than the area of the second icon;
  • the area of the second card on the current screen Is the second area; the second area does not intersect the first area, and the current screen also displays the first card; or, the second area intersects the first area, and the current screen Stop displaying the first card
  • the second card can be displayed on the current screen; and the technical effect of displaying the second card on the current screen is the same as the technical effect of displaying the first card on the current screen.
  • the scope of the content of the second card is further limited, and part of redundant information is excluded, so that the content of the second card acquired or used by the user is simplified. That is to say, after the second card is displayed on the current screen and the second card does not occupy the current screen, the user can not only intuitively obtain the content of the second card, but also directly open the fourth application, and also directly access the current screen.
  • the operation of the screen takes into account the convenience of the three, and realizes the balance of the three in the convenience of use.
  • the first card and the second card can be displayed on the current screen.
  • the display of the second card has the same operation flow as the display of the first card.
  • the content displayed by the second card is the same as the content displayed by the first card and the The icon based on the second card display is different from the icon based on the first card display.
  • the display of the first card and the display of the second card can be independent of each other and do not affect each other.
  • the second card is always displayed on the current screen. In this way, when the user has been using the second card content in the near future, after the second card is displayed on the current screen, the user does not need to perform the fifth user input, and directly uses or obtains the current screen and the second card.
  • the second card content corresponding to the icon are clarified, and how to display the two cards if they cannot be displayed together.
  • the method includes: the fifth user input is input through a one-step operation; the percentage of the area of the second card content on the second card The largest; the area of the second card content is greater than or equal to the area of the second icon; before the second card is displayed, the K controls correspond to K icons, and the K icons are displayed in the second In terms of area, the second area only includes the second part of the background, the second icon and the K icons, and the number of icons included in the second area is equal to K plus 1.
  • the K icons corresponding to the K controls on the second card can be located in the second area, in an area other than the second area on the current screen, or in the current screen on the desktop. External screen; thus, the application corresponding to any icon displayed on the desktop can be opened on the second card, which is more convenient for users.
  • the method includes: detecting a sixth user input to one of the K controls; and in response to the sixth user input, displaying The Q-th layer interface after the application corresponding to one of the K controls is opened; Q is a positive integer greater than or equal to 1; a return operation is detected; in response to the return operation, the current screen is displayed; The content displayed on the current screen is the content displayed on the current screen before responding to the fifth user input.
  • the method includes: detecting a seventh user input to the second card on the current screen; in response to the seventh user input, The content displayed in the second area is the content displayed in the second area before responding to the fifth user input.
  • the display of the second card can be stopped through a seventh user input on the current screen, and there is no need to switch the current screen to another screen, so that the cost of card management steps and other costs are greatly reduced, the operation is convenient, and the operation can be fast. Switch back to the situation of responding to the content displayed in the first area before the fifth user input.
  • the method includes: displaying R icons in an area other than the second area on the current screen, where R is a positive integer greater than or equal to 1; detected An eighth user input to one of the R icons; in response to the eighth user input, display the opened interface of the application corresponding to one of the R icons; detect a return operation; respond In the return operation, the current screen is displayed, and the content displayed on the current screen is the content displayed on the current screen before responding to the eighth user input.
  • the slave R icon is also provided.
  • the interface after the application corresponding to one of the icons is opened returns the content displayed on the current screen before responding to the eighth user input, and this method is simple and easy for the user to operate.
  • the method includes: the second card further includes: a second control, the second control is used to open the second application; the The second control is the control displayed after the second icon is reduced by a third ratio; the K controls are the control displayed after the K icons are reduced by the fourth ratio; the area of the second control is larger than that of the K controls The area of any one control; the shape and size of the first card are the same as those of the second card; the first ratio and the second ratio are respectively the same as the third ratio and the first The four ratios are the same; the content of the second control, the K controls, and the second card are respectively displayed in the upper left corner, upper right corner, and lower middle of the second card; the fifth user input is a fifth voice Input or fifth gesture input; the fifth gesture input is a gesture input in which the starting point is located on the second icon, and the sliding direction is upward sliding; the second card changes with the fifth gesture input; the The sixth user input, the seventh user input, and the eighth user
  • Gesture input; the sixth gesture input and the eighth gesture input are touch inputs; the seventh gesture input is input through a one-step operation; the seventh gesture input is the starting point on the second card, and the sliding direction is The fifth gesture input is a gesture input in which the sliding direction is opposite. In this way, the user can understand through the second card that the application corresponding to the K controls can be opened on the second card; in addition, the second control is highlighted in a larger area, so that the user can learn about the second one more clearly.
  • the content of the card corresponds to the second control; the second control on the second card, K controls, and the preferred distribution and display mode of the second card content are provided; and two specific methods of user input are clarified; and only need Operating on the current screen does not need to switch the current screen to other screens on the desktop, which greatly reduces the cost of card management steps, facilitates operation, and improves user experience; in addition, it provides an optimal user experience that is convenient for user operation and memory.
  • the seventh gesture input mode allows the user to memorize the fifth gesture input mode together.
  • the first folder icon includes E first application icons; E is a positive integer greater than or equal to 2; the first switching user input is detected; response In the first switching user input, the first card content of the first card is switched to another first card content, and the first card content and the another first card content are respectively connected to the E-th card content.
  • the two first application icons in one application icon correspond to each other. In this way, when the first folder icon includes a plurality of first application icons, the first card content of the first card can be switched according to the first switching user input input by the user.
  • the second folder icon includes F second application icons; F is a positive integer greater than or equal to 2; a second switching user input is detected; response In the second switching user input, the second card content of the second card is switched to another second card content, and the second card content and the another second card content are respectively the same as the F th
  • the two second application icons in the second application icons correspond to each other.
  • the second folder icon includes a plurality of second application icons
  • the second card content of the second card can be switched according to the switching user input input by the user.
  • the second folder icon includes a plurality of second application icons
  • the second card content of the second card can be switched according to the second switching user input input by the user.
  • At least one first application icon in the E first application icons corresponds to a plurality of first cards; the third switching user input is detected; in response to The third switching user input, the plurality of first cards are switched.
  • the multiple first cards can be switched according to the third switching user input input by the user.
  • At least one second application icon in the F second application icons corresponds to a plurality of second cards; the fourth switching user input is detected; in response to The fourth switching user input, and the plurality of second cards are switched.
  • the multiple second cards can be switched according to the fourth switching user input input by the user.
  • the first card is suspended on the current screen; the first card further includes a fixed button; after touching the fixed button, the The first card is fixed on the current screen.
  • the user is provided with at least two choices. The user can choose to float the first card on the current screen or fix it on the current screen according to his own preferences.
  • the second card is suspended on the current screen; the second card further includes a fixed button; after touching the fixed button, the The second card is fixed on the current screen.
  • the user is provided with at least two choices. The user can choose to float the second card on the current screen or fix it on the current screen according to his own preferences.
  • the fixed button of the first card is converted into a close button; after touching the close After the button, stop displaying the first card; or, the first card further includes a close button; after touching the close button, stop displaying the first card.
  • two implementation manners for stopping the display of the first card are provided, and the user stops displaying the first card by pressing the close button.
  • the fixed button of the second card is converted to a close button; when the close button is touched After the button, stop displaying the second card; or, the second card further includes a close button; after touching the close button, stop displaying the second card.
  • two implementation manners for stopping the display of the second card are provided, and the user stops displaying the second card by pressing the close button.
  • the first icon is a first application icon, and the first application icon corresponds to a plurality of first cards; a fifth switching user input is detected; response In the fifth switching user input, the plurality of first cards are switched.
  • the first icon is the first application icon and corresponds to multiple first cards, the multiple first cards can be switched according to the fifth switching user input input by the user.
  • a sixth switching user input to the first control and one of the N controls is detected, and in response to the sixth switching user input, the N One of the two controls exchanges positions with the first control and adjusts the size ratio to adapt to the adjusted position.
  • the first card content is updated, and the updated first card content corresponds to the adjusted first control.
  • the N controls are initially displayed on the first card in the form of a sphere; after touching the sphere, the first card displays the N number of controls are described. In this way, another mode of operation is provided, so that the N controls are only expanded for display when they need to be expanded for display, and contracted into a sphere when they do not need to be expanded for display, thereby saving more display space for the first card to include Other content is displayed.
  • a ninth user input to the first control or any one of the N controls is detected, and in response to the ninth user input, the The display screen displays the opened content of the first application or the application corresponding to any one of the N controls. In this way, it is convenient for the user to open the first application corresponding to the first control on the first card or the application corresponding to any one of the N controls.
  • the touch device is placed in the first control or any one of the N controls in a direction perpendicular to the current screen Above, and after inputting the first control or any one of the N controls in the direction; or, it is detected that the touch device is placed in the direction perpendicular to the current screen Above the first control or any one of the N controls, the first control or any one of the N controls is enlarged, and the first control or the first control or the After any one of the N controls is far away from the input; or, it is detected that in a direction perpendicular to the current screen, the touch device is placed above any one of the N controls, among the N controls Any one of the controls is enlarged, after detecting a touch input to any one of the enlarged controls; in response to the above input, the display screen displays that the first application or the application corresponding to any one of the N controls is open After the content.
  • the opening method of the application corresponding to the first control or any one of the N controls is provided; so that the user can open the first application or the N control corresponding to the first control on the first card more conveniently, quickly and flexibly The application corresponding to any one of the controls.
  • the first card when the first card is selected, it is dragged to another area on the current screen other than the first area, and the first icon is displayed in the first area according to the first icon.
  • a tenth user input to the current screen is detected, and in response to the tenth user input, the current screen enters the editing state, and the first A card is transparent or semi-transparent, and the first control and/or one of the N controls is restored to the first icon and/or the N icons on the current screen before responding to the first user input
  • the size and position of the corresponding icon in the current screen it is detected that any one or more icons in the first area on the current screen are dragged outside the first area and released, or it is detected that all the icons on the current screen are dragged outside the first area.
  • the mode of displaying the first card is stopped. Therefore, it is convenient for the user to stop displaying the first card in this manner. Further, corresponding operations can be performed on the second card to obtain corresponding results. Since the operation and the obtained result of the second card correspond to the operation and the obtained result of the first card, it will not be repeated here.
  • an eleventh user input to the current screen is detected, and in response to the eleventh user input, the current screen enters the editing state, so
  • the card is transparent or semi-transparent, and the first control and/or one of the N controls is restored to the first icon and/or the N icons on the current screen before responding to the first user input
  • the size and position of the corresponding icon in the current screen it is detected that any one or more icons in the first area on the current screen are dragged outside the first area and released, or it is detected that the current screen is on Drag any one or more icons outside the first area into the first area and release, in response to the above detection result, the first card is updated accordingly; the first card of the updated first card The content of the card corresponds to the updated first icon.
  • the first card moves with the drag gesture on the current screen.
  • an operation method is provided; the first card is directly dragged with the drag gesture on the current screen, and there is no need to drag it after releasing the fixation by a gesture such as a long press.
  • a gesture such as a long press.
  • corresponding operations can be performed on the second card to obtain corresponding results. Since the operation and the obtained result of the second card correspond to the operation and the obtained result of the first card, it will not be repeated here.
  • the first card when the first card is selected, drag it to an area other than the first card and/or the second card on the current screen to release After that, the content included in the first card remains unchanged. In this way, the first card is dragged to an area other than the first card and/or the second card on the current screen, and the new first card is not automatically switched to display.
  • the shapes of the first card and the second card are preset.
  • the shapes of the first card and the second card are preset to be the same. In this way, the shape of the card that the user sees is the same, and the experience is better.
  • the shape of the first card is a rectangle with rounded corners, and the rectangle with rounded corners covers several rows and several columns of icons arranged on the desktop. In this way, the shape of the first card is kept consistent with the arrangement of the icons in the area other than the first card on the current screen.
  • the first card further includes: a first sub-control, and an area of the first sub-control on the first card is a first sub-area
  • the area of the first card content on the first card is the third area; the first sub-area is outside the third area; the twelfth user input to the first sub-control is detected ,
  • the first card content stops displaying, the second sub-control corresponding to the first card content is displayed on the second sub-area, and the third card content corresponding to the first sub-control is displayed on the On the third area; the second sub-area is outside the third area; the first card content and the third card content respectively correspond to different functions and/or different information of the first application.
  • the user can switch between different functions of the first application and/or card content corresponding to no information by the user input to the first sub-control.
  • the first sub-region is the same as the second sub-region; or, the first sub-region is different from the second sub-region.
  • the first card content further includes: a second sub-control; the area of the first card content on the first card is a third area Detecting a thirteenth user input to the second sub-control, the first card content stops displaying, and the fourth card content corresponding to the second sub-control is displayed on the third area. In this way, it is possible to switch between different card contents through the controls included in the card contents, which is more convenient for users.
  • electronic devices include, but are not limited to, smart devices such as mobile phones, tablets, watches, bracelets, computers, glasses, helmets, televisions, and in-vehicle devices.
  • any implementation of the second aspect is also applicable to the first aspect without special instructions; any implementation of the first aspect, unless otherwise specified, It also applies to the second aspect.
  • an electronic device in a third aspect, includes: a display module, the display module displays the current screen of the desktop of the electronic device, the current screen displays a number of icons; A user input; the display module is further configured to, in response to the first user input, display a first card on the current screen, the first card does not occupy the current screen; the first icon is A first folder icon, the first folder icon includes at least a first application icon, and the first application icon corresponds to a first application; or, the first icon is a first application icon, and the first application icon Corresponding to the first application; the first card includes at least: first card content, the first card content includes part of the content contained in the M-th layer interface after the first application is opened, and M is a positive integer greater than or equal to 1 ; N controls, each of the N controls is used to open a corresponding application, the application corresponds to the corresponding icon on the desktop before the first card is displayed, and N is a positive value greater than or equal to 1. An integer; the first card is
  • any implementation manner of the third aspect corresponds to any implementation manner of the second aspect respectively.
  • the technical effects corresponding to the third aspect and any one of the implementation manners of the third aspect please refer to the technical effects corresponding to any one of the foregoing second aspect and the second aspect, which will not be repeated here.
  • a computer-readable storage medium including instructions, which when the instructions run on an electronic device, cause the electronic device to execute the card display in the second aspect and any one of the second aspects. method.
  • a graphical user interface system on an electronic device has a display screen, a memory, and one or more processors, the one or more processors are used to execute one or more computer programs stored in the memory, and the graphical user interface includes the A graphical user interface displayed when the electronic device executes the second aspect and any one of the implementation methods of the second aspect.
  • a computer program product which when running on a computer, causes the computer to execute the card display method in any one of the second aspect and the second aspect.
  • an electronic system including: an electronic device and a server; the electronic device includes a display screen and a communication interface; the server includes one or more processors, a memory, and one or more computer programs, the One or more computer programs are stored in the one or more memories, and when the one or more processors execute the one or more computer programs, the electronic system realizes the second aspect and the second aspect The card display method in any one of the implementation modes.
  • any implementation manner and corresponding technical effect of the seventh aspect please refer to the foregoing implementation manner and corresponding technical effect of the second aspect and any implementation manner and corresponding technical effect of the second aspect, which will not be omitted here. Go into details.
  • Figure 1 is a schematic diagram of the user interface displayed by the pop-up window provided.
  • Figure 2 is a schematic diagram of a user interface for card management operations provided.
  • FIG. 3 is a schematic structural diagram of an electronic device provided by an embodiment of the application.
  • FIG. 4 is a block diagram of the software structure of an electronic device provided by an embodiment of the application.
  • Fig. 5 is a schematic diagram of the software flow of a card display method provided by an embodiment of the application.
  • FIG. 6 is a schematic flowchart of a card display method provided by an embodiment of the application.
  • FIG. 7 is a schematic diagram of the structure of layers involved in the card display method provided by an embodiment of the application.
  • FIG. 8 is a schematic diagram of the generation of the card layer substrate involved in the card display method provided by the embodiment of the application.
  • FIG. 9 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 10 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 11 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 12 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 13 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 14 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 15 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 16 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 17 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 18 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 19 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 20 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 21 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 22 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 23 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 24 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 25 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 26 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 27 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 28 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 29 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 30 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 31 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 32 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 33 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 34 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 35 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 36 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 37 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 38 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 39 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 40 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 41 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 42 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • FIG. 43 is a schematic structural diagram of an electronic device provided by an embodiment of the application.
  • first and second in the embodiments of the present application are used to distinguish different icons, contents, modules, applications, etc., and do not represent a sequence. Unless otherwise specified, the two are different. For example, the first application is different from the second application.
  • a card is an information carrier with a closed outline, which provides important or closely related information intuitively and quickly in a concentrated form for the display and interaction of the above-mentioned information.
  • the card is mainly displayed on the negative screen of the desktop of the electronic device.
  • the user interface 102 includes a navigation bar area 1022, a status bar area 1026, and a second screen of the desktop located between the navigation bar area 1022 and the status bar area 1026.
  • the second screen of the desktop includes a fixed icon area 1023, a page indicator area 1024, and a slidable page area 1025.
  • the negative one screen of the desktop, the first screen of the desktop, and the third screen of the desktop include areas that also include a fixed icon area, a page indicator area, and a slideable page area. It can be seen from the page indicator area 1024 that the desktop includes a negative screen, a first screen, a second screen, and a third screen. Therefore, in Figure 1, the negative screen of the desktop, the first screen of the desktop, the second screen of the desktop, and the third screen of the desktop together form the desktop. Among them, one or more icons can be displayed in the sliding page area included in the screen other than the second screen of the desktop on the desktop.
  • the navigation bar can be hidden; in some optional embodiments, the status bar can be hidden; in some optional embodiments, the navigation bar and the status bar are integrated as a whole.
  • the negative screen of the desktop is located on the user interface displayed when the electronic device displays the desktop and slides to the left to the left.
  • the first screen of the desktop, the second screen of the desktop, the third screen of the desktop, etc. are located on the user interface that starts from the negative one of the desktop and is displayed in sequence after sliding to the right. It should be noted that Fig. 1 is only an example and is not used to limit the scope of the desktop of this application.
  • the shape of the card is usually a rectangle with rounded corners, which is similar to the shape of a credit card, although other shapes are also possible.
  • the card enables users of electronic devices to obtain information and perform operations more conveniently and intuitively, and is therefore widely used.
  • the existing card display position is fixed and not flexible enough; the display and switching operations of the card are cumbersome and the management cost is high; the card only displays the information of a single application, which makes the operation of other applications inconvenient. Therefore, it is necessary to provide a card display method with simple operation, flexible display position change, and convenient manipulation of other applications.
  • the payment code occupies the second screen of the entire desktop, forming a payment code interface. If the user wants to switch to another application displayed on the user interface, he needs to exit the payment code interface first, and then touch other icons on the user interface, which is not convenient enough. In addition, if the user wants to view or touch the content or icon hidden by the pop-up window 10410 on the user interface 104 as shown in FIG. The pop-up window 10410 disappears, and then to view or touch the above-mentioned blocked content or icon, the operation is relatively cumbersome. Moreover, the pop-up window 10410 cannot be fixedly displayed on the user interface 104 either.
  • the user interface 102 will not display the above pop-up window 1041; if you want to quickly enter the Alipay payment code, you need to press and hold the Alipay icon 1021 displayed on the user interface 102 again, which is cumbersome.
  • FIG. 2 is a schematic diagram of a user interface for switching between different card displays in a card display method provided.
  • the interface 200 displays a negative screen with the desktop. Take the cancellation of the display of the card 2002 on the interface 200 as an example.
  • the interface 201 switches to the interface 202 shown in FIG. 2c; the user touches the button 2021 on the interface 202 shown in FIG. 2c; after returning to the negative screen of the desktop, the negative screen of the desktop at this time is as shown in FIG. 2d.
  • Card 2002 is no longer displayed. In this way, if you want to manage the display switching of different cards, you need to enter the setting interface first, and then browse the settings on the setting interface. The operation is cumbersome.
  • FIG. 3 shows a schematic diagram of the structure of the electronic device 100.
  • the electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, an antenna 1, and an antenna 2.
  • Mobile communication module 150 wireless communication module 160, audio module 170, speaker 170A, receiver 170B, microphone 170C, earphone jack 170D, sensor module 180, buttons 190, motor 191, indicator 192, camera 193, display screen 194, and Subscriber identification module (subscriber identification module, SIM) card interface 195, etc.
  • SIM Subscriber identification module
  • the sensor module 180 may 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 sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, and ambient light Sensor 180L, bone conduction sensor 180M, etc.
  • the structure illustrated in the embodiment of the present application does not constitute a specific limitation on the electronic device 100.
  • the electronic device 100 may include more or fewer components than those shown in the figure, or combine certain components, or split certain components, or arrange different components.
  • the illustrated components can be implemented in hardware, software, or a combination of software and hardware.
  • the processor 110 may include one or more processing units.
  • the processor 110 may include an application processor (AP), a modem processor, a graphics processing unit (GPU), and an image signal processor. (image signal processor, ISP), controller, video codec, digital signal processor (digital signal processor, DSP), baseband processor, and/or neural-network processing unit (NPU), etc.
  • AP application processor
  • modem processor modem processor
  • GPU graphics processing unit
  • image signal processor image signal processor
  • ISP image signal processor
  • controller video codec
  • digital signal processor digital signal processor
  • DSP digital signal processor
  • NPU neural-network processing unit
  • the different processing units may be independent devices or integrated in one or more processors.
  • the controller can generate operation control signals according to the instruction operation code and timing signals to complete the control of fetching instructions and executing instructions.
  • a memory may also be provided in the processor 110 to store instructions and data.
  • the memory in the processor 110 is a cache memory.
  • the memory can store instructions or data that have just been used or recycled by the processor 110. If the processor 110 needs to use the instruction or data again, it can be directly called from the memory. Repeated accesses are avoided, the waiting time of the processor 110 is reduced, and the efficiency of the system is improved.
  • the processor 110 may include one or more interfaces.
  • the interface may include an integrated circuit (inter-integrated circuit, I2C) interface, an integrated circuit built-in audio (inter-integrated circuit sound, I2S) interface, a pulse code modulation (pulse code modulation, PCM) interface, and a universal asynchronous transmitter/receiver (universal asynchronous) interface.
  • I2C integrated circuit
  • I2S integrated circuit built-in audio
  • PCM pulse code modulation
  • PCM pulse code modulation
  • UART universal asynchronous transmitter/receiver
  • MIPI mobile industry processor interface
  • GPIO general-purpose input/output
  • SIM subscriber identity module
  • USB Universal Serial Bus
  • the USB interface 130 is an interface that complies with the USB standard specification, and specifically may be a Mini USB interface, a Micro USB interface, a USB Type C interface, and so on. It can be understood that the interface connection relationship between the modules illustrated in the embodiment of the present application is merely a schematic description, and does not constitute a structural limitation of the electronic device 100. In other embodiments of the present application, the electronic device 100 may also adopt different interface connection modes in the foregoing embodiments, or a combination of multiple interface connection modes.
  • the charging management module 140 is used to receive charging input from the charger.
  • the power management module 141 is used to connect the battery 142, the charging management module 140 and the processor 110.
  • the wireless communication function of the electronic device 100 can be implemented by the antenna 1, the antenna 2, the mobile communication module 150, the wireless communication module 160, the modem processor, and the baseband processor.
  • the antenna 1 and the antenna 2 are used to transmit and receive electromagnetic wave signals.
  • Each antenna in the electronic device 100 can be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve antenna utilization.
  • Antenna 1 can be multiplexed as a diversity antenna of a wireless local area network.
  • the antenna can be used in combination with a tuning switch.
  • the mobile communication module 150 can provide a wireless communication solution including 2G/3G/4G/5G and the like applied to the electronic device 100.
  • the mobile communication module 150 may include at least one filter, a switch, a power amplifier, a low noise amplifier (LNA), and the like.
  • the mobile communication module 150 can receive electromagnetic waves by the antenna 1, and perform processing such as filtering, amplifying and transmitting the received electromagnetic waves to the modem processor for demodulation.
  • the mobile communication module 150 can also amplify the signal modulated by the modem processor, and convert it into electromagnetic waves for radiation via the antenna 1.
  • at least part of the functional modules of the mobile communication module 150 may be provided in the processor 110.
  • at least part of the functional modules of the mobile communication module 150 and at least part of the modules of the processor 110 may be provided in the same device.
  • the modem processor may include a modulator and a demodulator.
  • the modulator is used to modulate the low frequency baseband signal to be sent into a medium and high frequency signal.
  • the demodulator is used to demodulate the received electromagnetic wave signal into a low-frequency baseband signal.
  • the demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing.
  • the application processor outputs a sound signal through an audio device (not limited to the speaker 170A, the receiver 170B, etc.), or displays an image or video through the display screen 194.
  • the modem processor may be an independent device.
  • the modem processor may be independent of the processor 110 and be provided in the same device as the mobile communication module 150 or other functional modules.
  • the wireless communication module 160 can provide applications on the electronic device 100 including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), bluetooth (BT), and global navigation satellites. System (global navigation satellite system, GNSS), frequency modulation (FM), near field communication (NFC), infrared technology (infrared, IR) and other wireless communication solutions.
  • the wireless communication module 160 may be one or more devices integrating at least one communication processing module.
  • the wireless communication module 160 receives electromagnetic waves via the antenna 2, frequency modulates and filters the electromagnetic wave signals, and sends the processed signals to the processor 110.
  • the wireless communication module 160 may also receive a signal to be sent from the processor 110, perform frequency modulation, amplify it, and convert it into electromagnetic waves to radiate through the antenna 2.
  • the antenna 1 of the electronic device 100 is coupled with the mobile communication module 150, and the antenna 2 is coupled with the wireless communication module 160, so that the electronic device 100 can communicate with the network and other devices through wireless communication technology.
  • the wireless communication technology may include global system for mobile communications (GSM), general packet radio service (GPRS), code division multiple access (CDMA), broadband Code division multiple access (wideband code division multiple access, WCDMA), time-division code division multiple access (TD-SCDMA), long term evolution (LTE), BT, GNSS, WLAN, NFC , FM, and/or IR technology, etc.
  • the GNSS may include global positioning system (GPS), global navigation satellite system (GLONASS), Beidou navigation satellite system (BDS), quasi-zenith satellite system (quasi -zenith satellite system, QZSS) and/or satellite-based augmentation systems (SBAS).
  • GPS global positioning system
  • GLONASS global navigation satellite system
  • BDS Beidou navigation satellite system
  • QZSS quasi-zenith satellite system
  • SBAS satellite-based augmentation systems
  • the electronic device 100 implements a display function through a GPU, a display screen 194, an application processor, and the like.
  • the GPU is an image processing microprocessor, which is connected to the display screen 194 and the application processor.
  • the GPU is used to perform mathematical and geometric calculations and is used for graphics rendering.
  • the processor 110 may include one or more GPUs that execute program instructions to generate or change display information.
  • the display screen 194 is used to display images, videos, and the like.
  • the display screen 194 includes a display panel.
  • the display panel can use liquid crystal display (LCD), organic light-emitting diode (OLED), active matrix organic light-emitting diode or active-matrix organic light-emitting diode (active-matrix organic light-emitting diode).
  • LCD liquid crystal display
  • OLED organic light-emitting diode
  • active-matrix organic light-emitting diode active-matrix organic light-emitting diode
  • AMOLED flexible light-emitting diode (FLED), Miniled, MicroLed, Micro-oLed, quantum dot light-emitting diode (QLED), etc.
  • the electronic device 100 may include one or N display screens 194, and N is a positive integer greater than one.
  • the electronic device 100 can implement a shooting function through an ISP, a camera 193, a video codec, a GPU, a display screen 194, and an application processor.
  • the ISP is used to process the data fed back from the camera 193.
  • the camera 193 is used to capture still images or videos.
  • the object generates an optical image through the lens and is projected to the photosensitive element.
  • Digital signal processors are used to process digital signals. In addition to digital image signals, they can also process other digital signals. For example, when the electronic device 100 selects the frequency point, the digital signal processor is used to perform Fourier transform on the energy of the frequency point.
  • Video codecs are used to compress or decompress digital video.
  • the electronic device 100 may support one or more video codecs. In this way, the electronic device 100 can play or record videos in multiple encoding formats, such as: moving picture experts group (MPEG) 1, MPEG2, MPEG3, MPEG4, and so on.
  • MPEG moving picture experts group
  • MPEG2 MPEG2, MPEG3, MPEG4, and so on.
  • NPU is a neural-network (NN) computing processor.
  • NN neural-network
  • the external memory interface 120 may be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100.
  • the external memory card communicates with the processor 110 through the external memory interface 120 to realize the data storage function. For example, save music, video and other files in an external memory card.
  • the internal memory 121 may be used to store computer executable program code, where the executable program code includes instructions.
  • the internal memory 121 may include a storage program area and a storage data area.
  • the storage program area can store an operating system, at least one application program (such as a sound playback function, an image playback function, etc.) required by at least one function.
  • the data storage area can store data (such as audio data, phone book, etc.) created during the use of the electronic device 100.
  • the internal memory 121 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one magnetic disk storage device, a flash memory device, a universal flash storage (UFS), and the like.
  • the processor 110 executes various functional applications and data processing of the electronic device 100 by running instructions stored in the internal memory 121 and/or instructions stored in a memory provided in the processor.
  • the electronic device 100 can implement audio functions through the audio module 170, the speaker 170A, the receiver 170B, the microphone 170C, the earphone interface 170D, and the application processor. For example, music playback, recording, etc.
  • the pressure sensor 180A is used to sense the pressure signal and can convert the pressure signal into an electrical signal.
  • the pressure sensor 180A may be provided on the display screen 194.
  • the capacitive pressure sensor may include at least two parallel plates with conductive materials.
  • the electronic device 100 determines the intensity of the pressure according to the change in capacitance.
  • the electronic device 100 detects the intensity of the touch operation according to the pressure sensor 180A.
  • the electronic device 100 may also calculate the touched position according to the detection signal of the pressure sensor 180A.
  • touch operations that act on the same touch position but have different touch operation strengths may correspond to different operation instructions. For example: when a touch operation whose intensity of the touch operation is less than the first pressure threshold is applied to the short message application icon, an instruction to view the short message is executed. When a touch operation with a touch operation intensity greater than or equal to the first pressure threshold acts on the short message application icon, an instruction to create a new short message is executed.
  • the gyro sensor 180B may be used to determine the movement posture of the electronic device 100.
  • the air pressure sensor 180C is used to measure air pressure.
  • the electronic device 100 calculates the altitude based on the air pressure value measured by the air pressure sensor 180C to assist positioning and navigation.
  • the magnetic sensor 180D includes a Hall sensor.
  • the acceleration sensor 180E can detect the magnitude of the acceleration of the electronic device 100 in various directions (generally three axes).
  • Distance sensor 180F used to measure distance.
  • the electronic device 100 can measure the distance by infrared or laser. In some embodiments, when shooting a scene, the electronic device 100 may use the distance sensor 180F to measure the distance to achieve fast focusing.
  • the proximity light sensor 180G may include, for example, a light emitting diode (LED) and a light detector such as a photodiode.
  • the ambient light sensor 180L is used to sense the brightness of the ambient light.
  • the fingerprint sensor 180H is used to collect fingerprints.
  • the electronic device 100 can use the collected fingerprint characteristics to implement fingerprint unlocking, access application locks, fingerprint photographs, fingerprint answering calls, and so on.
  • the temperature sensor 180J is used to detect temperature.
  • Touch sensor 180K also called “touch device”.
  • the touch sensor 180K may be disposed on the display screen 194, and the touch screen is composed of the touch sensor 180K and the display screen 194, which is also called a “touch screen”.
  • the touch sensor 180K is used to detect touch operations acting on or near it.
  • the touch sensor can pass the detected touch operation to the application processor to determine the type of touch event.
  • the visual output related to the touch operation can be provided through the display screen 194.
  • the touch sensor 180K may also be disposed on the surface of the electronic device 100, which is different from the position of the display screen 194.
  • the SIM card interface 195 is used to connect to the SIM card.
  • the SIM card can be inserted into the SIM card interface 195 or pulled out from the SIM card interface 195 to achieve contact and separation with the electronic device 100.
  • the electronic device 100 may support 1 or N SIM card interfaces, and N is a positive integer greater than 1.
  • the SIM card interface 195 can support Nano SIM cards, Micro SIM cards, SIM cards, etc.
  • the same SIM card interface 195 can insert multiple cards at the same time. The types of the multiple cards can be the same or different.
  • the SIM card interface 195 can also be compatible with different types of SIM cards.
  • the SIM card interface 195 may also be compatible with external memory cards.
  • the electronic device 100 interacts with the network through the SIM card to implement functions such as call and data communication.
  • the electronic device 100 adopts an eSIM, that is, an embedded SIM card.
  • the eSIM card can be embedded in the electronic device 100 and cannot be separated from the electronic device 100.
  • the software system of the electronic device 100 may adopt a layered architecture, an event-driven architecture, a microkernel architecture, a microservice architecture, or a cloud architecture.
  • the embodiments of the present application provide a card display method, electronic equipment, and computer-readable storage medium, so that users can quickly display and switch cards on the current screen of the desktop through simple operations, even only one step
  • the current screen of the desktop is any screen of the desktop, which can be any of the negative one screen of the desktop, the first screen of the desktop, the second screen of the desktop, the third screen of the desktop, and so on.
  • FIG. 4 is a block diagram of the software structure of the electronic device 100 according to an embodiment of the present application.
  • the layered architecture divides the software into several layers, and each layer has a clear role and division of labor. Communication between layers through software interface.
  • the Android system is divided into five layers, from top to bottom, the application program layer, the system framework layer, the system library and runtime layer, the hardware abstraction layer, and the kernel layer.
  • the application layer can include a series of application packages. As shown in Figure 4, the application package can include programs such as desktop manager, contacts, calendar, text messages, and music. Among them, the desktop manager is used to manage and display the icons of all common applications and their corresponding card information. There is no icon on the desktop; when the user triggers the card display operation, the card information is loaded and displayed. Ordinary applications, such as contacts, calendars, and other programs that can click icons on the desktop, are used to provide card display-related data.
  • the system framework layer provides application programming interfaces (Application Programming Interface, API) and programming frameworks for applications in the application layer, including various components and services to support developers' Android development.
  • the system framework layer includes some predefined functions. As shown in Figure 4, the system framework layer can include a view system, an input manager, a card service manager, a resource manager, a window manager, a content provider, and so on.
  • the view system includes visual controls, such as controls that display text, controls that display pictures, and so on.
  • the view system can be used to build applications.
  • the display interface can be composed of one or more views.
  • the window manager is used to manage window programs. The window manager can obtain the size of the display screen, determine whether there is a status bar, lock the screen, take a screenshot, etc.
  • the input manager is used to manage touch events and realize the dispatch of touch events.
  • the card service manager is used to receive the card information issued by the desktop application App (Application) and save it, and at the same time provides an interface for the desktop program to query the card information of the App.
  • the Card Service Manager can be used as a Service process resident in the Andorid system, providing a remote calling interface to receive card information released by the App, and providing another remote calling interface for desktop programs to query card information.
  • the card service manager saves the unique ID of the App and the card information corresponding to the App. Among them, the card information corresponding to the App is published and stored in the form of a data structure.
  • the unique ID of the App may be an application package name (PackageName) of the App or a hash code of the application package name.
  • the resource manager provides various resources for the application, such as localized strings, icons, pictures, layout files, video files, and so on.
  • the window manager is used to manage window programs. The window manager can obtain the size of the display screen, determine whether there is a status bar, lock the screen, take a screenshot, etc.
  • the content provider is used to store and retrieve data and make these data accessible to applications.
  • the data may include videos, images, audios, phone calls made and received, browsing history and bookmarks, phone book, etc.
  • the system library and runtime layer include the system library and Android Runtime.
  • the system library can include multiple functional modules. For example: browser kernel, 3D graphics library (for example: OpenGL ES), font library, etc.
  • the browser kernel is responsible for interpreting the grammar of the webpage (such as an application HTML and JavaScript under the standard universal markup language) and rendering (displaying) the webpage.
  • the 3D graphics library is used to implement three-dimensional graphics drawing, image rendering, synthesis and layer processing.
  • the font library is used to realize the input of different fonts.
  • the Android runtime includes core libraries and virtual machines. The Android runtime is responsible for the scheduling and management of the Android system.
  • the core library consists of two parts: one part is the function functions that the java language needs to call, and the other part is the core library of Android.
  • the application layer and application framework layer run in a virtual machine.
  • the virtual machine executes the java files of the application layer and the application framework layer as binary files.
  • the virtual machine is used to perform functions such as object life cycle management, stack management, thread management, security and exception management, and garbage collection.
  • the hardware abstraction layer is the abstract interface of the device kernel driver, which provides an application programming interface for accessing the underlying device to the higher-level Java API framework.
  • HAL contains multiple library modules, each of which implements an interface for a specific type of hardware component.
  • the kernel layer is the layer between hardware and software.
  • the kernel layer includes at least camera driver, display driver, Bluetooth driver, audio driver, sensor driver, touch driver and WLAN.
  • the core layer is The basis of the system. The final function realization of the system is done through the kernel layer.
  • Fig. 5 is a schematic diagram of the software flow of a card display method provided by an embodiment of the application.
  • the desktop-related applications running in the application layer of the electronic device include two types, the desktop manager 502 and common applications such as weather 504 and calendar 505.
  • common applications such as weather 504 and calendar 505 are preset with card information, and the card information corresponding to the common application is transmitted to the card service manager 503 of the system framework layer under certain conditions.
  • pre-setting the card information in the common application includes pre-setting the card information in the common application through the RemoteViews data structure, such as defining RemoteViews and their coordinate layout, setting the font color of RemoteViews, Data information such as string content, icons, and operations in response to user input.
  • the common application program is preset with card information including card information about the card layout described in the common application program through a data structure of an xml file.
  • RemoteViews remoteView new RemoteViews(getPackageName(),R.layout.layout_notification)
  • the above xml file can be expanded and defined as needed.
  • the ordinary application program will report to the card service manager of the system framework layer under certain conditions, such as when the data of the ordinary application program changes, or after booting up.
  • 503 transmits the card information corresponding to the ordinary application.
  • the card service manager 503 receives and saves the card information.
  • the card service manager 503 may store the ID corresponding to each icon and the card information corresponding to the ID in the form of a list.
  • the desktop manager determines whether to query the card based on user input, and generates and displays the card on the current screen of the desktop of the electronic device according to the query result.
  • the user input can be the user's gesture input or the user's voice command input.
  • the user's gesture may be a user's gesture on the touch screen, or a gesture of sliding with the current screen of the desktop.
  • the touch screen detects the first gesture and reports the first gesture to the desktop manager 502 of the application layer via the input manager 501 of the system framework layer.
  • the desktop manager 502 receives the first gesture, and determines whether the first gesture meets the preset gesture; if so, the desktop manager 502 obtains the first icon to be used as a reference for displaying the card based on the first gesture, and then obtains the first icon.
  • the desktop manager 502 queries the card service manager 503 for the card information corresponding to the ID, and the card service manager 503 transmits the card information corresponding to the ID to the desktop manager 502; based on the received For the card information corresponding to the ID, the desktop manager 502 generates a display card.
  • the system framework layer does not need to set a card service manager 503; ordinary applications such as weather 504 and calendar 505 are equipped with their own card service manager; the desktop manager 502 sends ordinary applications such as weather 504 and calendar 505 based on the above ID
  • the respective card service manager queries the card information corresponding to the ID, and the ordinary application program with the same ID transmits the card information corresponding to the ID to the desktop manager 502 through its card service manager, and the ordinary application program that is different from the ID
  • the card information is not transmitted to the desktop manager 502 through its card service manager; the desktop manager 502 generates a card based on the received card information corresponding to the ID.
  • the above-mentioned pre-setting can be used by the electronic device manufacturer to pre-set the self-developed application of the electronic device before it leaves the factory.
  • an electronic device that has just been shipped from the factory has not yet installed applications other than those developed by the manufacturer of the electronic device.
  • an electronic device manufacturer and a third-party application provider have negotiated in advance, and the third-party application downloaded through the application market that comes with the electronic device is pre-set as described above.
  • the applications on the electronic device may also be preset for some applications, and some applications are not preset.
  • FIG. 6 is a schematic diagram of an implementation process of a card display method provided by an embodiment of the application.
  • Figure 6a shows a schematic diagram of the implementation process of the card display method.
  • the card service manager scans the general application App, obtains a list of apps that provide card information, and notifies the App to update the card information; or, the data of the general application App on the desktop changes ;
  • the App assembles card information, and transmits the ID of the ordinary application App and the card information corresponding to the ID to the card service manager, and the card service manager obtains and saves the ID and the card information corresponding to the ID;
  • the ID not only corresponds to the card information, but also corresponds to the App;
  • the desktop manager detects the user input; in S604, it determines whether the user input meets the preset input; if the user input does not meet the preset input, returns to S604; if the user If the input meets the preset input, execute S
  • the user input can be the user's gesture input or the user's voice command input.
  • the user's gesture may be a user's gesture on the touch screen, or a gesture of sliding with the current screen of the desktop. Take the user inputting the first gesture on the touch screen of the electronic device as an example.
  • S604 specifically determines whether the first gesture conforms to the preset gesture; if the first gesture does not conform to the preset gesture, return to S604; S605 specifically refers to the desktop manager determining whether to use the first gesture as a reference for displaying the card The ID corresponding to the first icon of, query and read the corresponding card information from the card service manager.
  • judging whether the first gesture conforms to the preset gesture specifically, judging whether the sliding direction of the first gesture conforms to the preset sliding direction.
  • the desktop manager determines the ID corresponding to the first icon to be used as a reference for displaying the card according to the first gesture, and queries and reads the corresponding card information from the card service manager; specifically, the desktop manager according to the first gesture
  • the starting point is to determine the ID corresponding to the first icon to be used as a reference to display the card, and query and read the corresponding card information from the card service manager.
  • Fig. 6b shows a further detailed flowchart of step S606 in Fig. 6a.
  • the card information is parsed into a card view, and the default shape and default size of the card view are obtained; in S6062, according to the default shape and default size of the card view and the first icon used as a reference to display the card, obtain The area covered by the card displayed based on the first icon, that is, the first area; and after all the cards on the current screen of the desktop of the electronic device are restored to the icon state, the icons displayed in the first area are obtained.
  • S6064 may not be included; after the card is displayed, the icon corresponding to the first area is obscured by the card, and the control corresponding to the above icon is also displayed on the card.
  • the card information includes the default shape, default size, and card content of the card view after it is displayed.
  • the card content includes the content of each element.
  • the content of each element is the content contained in the content interface or the functional interface displayed after the ordinary application corresponding to the card information is opened.
  • the content interface includes a content simplified interface.
  • the function interface includes a simplified function interface.
  • the content of the simplified content interface is less than the content of the content interface.
  • the content of the function reduction interface is less than the content of the function interface.
  • the first icon to be used as a reference for displaying the card is determined according to the starting point of the first gesture.
  • the default shape and/or default size of the card view included in the card information of each common application program may be the same or different.
  • the default shape and default size of the card view included in the card information of each common application are the same.
  • the shape and size of the card can also be changed according to the user's input.
  • S4063 and S4064 can be combined into one step to perform the card view display and the reduced display animation of the icon displayed in the first area. That is, the card view display animation and the reduced display animation of the icon displayed in the first area are performed at the same time, and the sequence is no longer distinguished.
  • the card view display animation and the reduced display animation of the icon displayed in the first area are combined into one animation—the card view display and the reduced display animation of the icon displayed in the first area are combined in S4063 and S4064 Executed.
  • S4063 and S4064 can be exchanged in order. That is, the zoom out display animation of the icon displayed in the first area is executed first, and then the card view display animation is executed.
  • FIG. 7 is a schematic diagram of the structure of layers involved in the card display method provided by an embodiment of the application.
  • the card display method provided by the embodiment of the present application involves three layers: an icon layer 701, a card layer 702, and a wallpaper layer 703.
  • the icon layer 701 contains icons displayed on the current screen of the desktop of the electronic device.
  • the card layer 702 contains the cards displayed on the current screen of the desktop of the electronic device.
  • the wallpaper layer 703 contains the wallpaper displayed on the current screen of the desktop of the electronic device. When there is no icon on the current screen of the desktop of the electronic device, there is no icon layer on the current screen of the desktop of the electronic device.
  • the card 7021 included in the card layer is taken as an example to further describe the area division on the card 7021.
  • the card 7021 includes a card title bar 70213 and a card content area 70214.
  • the card title bar 70213 includes a first control area 70211 and a second control area 70212.
  • the area of the card 7021 on the current screen of the desktop of the electronic device is the first area; after all the cards on the current screen of the desktop of the electronic device are restored to the icon state, the icons displayed in the first area include the first area.
  • the first control area 70211 only displays the first control corresponding to the first icon; the second control area 70212 displays N controls corresponding to other icons.
  • the first control area 70211 does not display controls corresponding to any icons; the second control area 70212 displays controls corresponding to other icons, or the second control area 70212 displays controls other than the first icon and other icons. The control corresponding to any icon of.
  • the first control displayed in the first control area 70211 can be a control displayed after an application icon or a folder icon is reduced to a certain ratio;
  • the N controls displayed in the second control area 70212 are N icons reduced to another ratio Displayed controls;
  • the N icons include application icons and/or folder icons.
  • the content displayed on the card content area 70214 is associated with the first icon and also associated with the first control.
  • the card title bar 70213 is located at the upper part of the card 7021; the card content area 70214 is located at the lower part of the card 7021; at this time, the card title bar 70213 is arranged horizontally.
  • the card title bar 70213 is located at the lower part of the card 7021; the card content area 70214 is located at the upper part of the card 7021; at this time, the card title bar 70213 is arranged horizontally.
  • the card title bar 70213 is located on the left side of the card 7021; the card content area 70214 is located on the right side of the card 7021; at this time, the card title bar 70213 is arranged vertically.
  • the card title bar 70213 is located at the upper part of the card 7021; the card content area 70214 is located at the lower part of the card 7021; at this time, the card title bar 70213 is arranged vertically.
  • the first control area 70211 is located on the left side of the card title bar 70213; the second control area 70212 is located on the right side of the card title bar 70213.
  • the first control area 70211 is located on the right side of the card title bar 70213; the second control area 70212 is located on the left side of the card title bar 70213.
  • the first control area 70211 is located at the upper part of the card title bar 70213; the second control area 70212 is located at the lower part of the card title bar 70213.
  • the first control area 70211 is located at the lower part of the card title bar 70213; the second control area 70212 is located at the upper part of the card title bar 70213.
  • the above related card title bar 70213 and card content area 70214 are located on the upper, lower, left, and right sides of the card 7021, respectively, are the card title bar 70213, and the card content area 70214 is located on the upper, lower, left, and right sides of the card 7021 area. side.
  • first control area 70211 and second control area 70212 are located on the upper, lower, left and right sides of the card title bar 70213 respectively.
  • the first control area 70211 and the second control area 70212 are located within the area of the card title bar 70213. Top, bottom, left and right sides.
  • the second control area 70212 may also be located outside the card title bar 70213, for example, at the upper part outside the card title bar 70213 area.
  • a floating ball is provided on the upper part outside the area of the card 7021, and the second control area 70212 is displayed only after the floating ball is touched.
  • the card 7021 includes a card layer substrate 70215 and a second control area 70212. Among them, all areas on the card 7021 except for the second control area 70212 belong to the card layer substrate 70215.
  • the second control area 70212 may be located in the upper left corner, upper right corner, lower left corner, lower right corner, upper portion, lower portion, left side, and right side within the card 7021 area.
  • the second control areas are arranged horizontally.
  • the second control area 70212 is located on the left and right sides of the card 7021 area, the second control areas are arranged vertically.
  • the second control area 70212 may be located at any other position within the card 7021 area.
  • the second control area 70212 may be located outside the area of the card 7021, for example, located at the upper part outside the area of the card 7021.
  • a floating ball is provided on the upper part of the periphery of the card 7021, and the floating ball will display the second control area 70212 after being touched.
  • the icon layer 701 and the wallpaper layer 703 may always exist; while the card layer 702 may sometimes not exist.
  • the card 7021 will be triggered to generate a display under the first input trigger.
  • the card 7021 is triggered to be displayed, which also indicates that the card layer 702 is generated and displayed.
  • the icons on the icon layer 701 covered by the card 7021 will be absorbed by the card 7021 and displayed on the card 7021 in the form of a control after being scaled down. At this time, the number of icons contained in the icon layer 701 will be reduced.
  • the card 7021 when the card 7021 is triggered by the second gesture, it will be triggered to transform into an icon; the controls that were previously absorbed and scaled down and displayed on the card 7021 as controls will be restored to the size and position of the icon before being absorbed.
  • the card layer 702 is located between the icon layer 701 and the wallpaper layer 703; in some cases, the card layer 702 is located above the icon layer 701.
  • the circle in the first control area and the runway rectangle in the second control area are only used to identify the position of the first control area and the second control area on the card layer, and are not used to limit the first control area and the second control area.
  • the shape of the first control area and the second control area can be any shape, including but not limited to a circle, a rectangle, a rounded rectangle, a racetrack rectangle, and the like.
  • the rounded rectangle of the card is only a schematic example of the shape of the card; it is not used to limit the shape of the card.
  • the shape of the card can be other shapes.
  • the other shapes are any shapes that those skilled in the art can think of; including but not limited to rounded rectangles, racetrack rectangles, and the like.
  • FIG. 8 is a schematic diagram of the generation of the card layer substrate involved in the card display method provided by the embodiment of the application.
  • Figures 8a and 8b respectively show two different ways of generating the card layer substrate.
  • the icon 801 represents the icon of the calendar application.
  • the display content area 802 gradually increases; the size of the icon 801 remains unchanged, reduced by a certain ratio, or enlarged by a certain ratio.
  • the position of the icon 801 in the display content area 802 gradually approaches the upper left corner of the display content area 802.
  • the icon 801 is located at the upper left corner of the display content area 802'.
  • a card layer substrate 800 is produced.
  • the icon includes two parts: the number 16 and the display content area. 811 represents the number 16, and 812 represents the display content area.
  • the number 16 is the identifier of the calendar application, used to indicate that today is the 16th. The selection of the number 16 is only for illustrative purposes, and will change synchronously as time changes. For example, today is the 16th, tomorrow, the identifier of the calendar application will change from the number 16 to the number 17.
  • the display content area 812 gradually increases; the number 16 811 also gradually increases, and gradually approaches the upper left corner of the display content area 812. Finally, when the display content area 812 increases to 812', it does not increase; when the number 16 811 increases to 811', it does not increase; at this time, the number 16 811' is located at the upper left corner of the display content area 812' .
  • a card layer substrate 810 is produced.
  • the above two generation methods of the card layer substrate are only used for illustrative examples, and are not used to limit the generation methods of the card layer substrate. Any method for generating the card layer substrate that can be imagined by those skilled in the art is within the protection scope of the embodiments of the present application.
  • the icon of the calendar application in FIG. 8a may also be located in the upper right corner of the card layer substrate.
  • the icon of the calendar application in FIG. 8a may also be located in another position of the card layer substrate; the display content area may also be located in another position of the card layer substrate.
  • the above-mentioned other positions do not conflict with the above-mentioned other positions.
  • FIG. 9 is a schematic diagram of a user interface of a card display method provided by an embodiment of the application.
  • Take the memo application icon as an example.
  • the user takes the touch point on the memo application icon 9021 as the starting point and moves the finger in the direction shown in Fig. 9a.
  • the interface 902 shown in Fig. 9a switches to The interface 903 shown in Figure 9b.
  • a card 9031 is generated.
  • the area of the card 9031 in Figure 9b is the first area; the icons displayed on the interface 903 of the first area in Figure 9a include memo, player, file management, settings, gallery, Facebook, cloud sharing, Twitter and QQ nine application icons.
  • the first control corresponding to the memo application icon may not be displayed on the card 9031; the controls corresponding to the other eight application icons displayed on the interface 903 in the first area are displayed in the upper right corner of the card 9031.
  • the first control corresponding to the memo application icon may be displayed in the upper left corner of the card 9031.
  • the control displayed on the upper right corner of the card 9031 may not correspond to the above eight application icons, but may correspond to other icons, and the other icons are located on the desktop.
  • the other icons can be located on the current screen on the desktop, or on other screens on the desktop.
  • it may also be a voice input, such as "display a card based on a memo icon".
  • the gesture input shown in FIG. 9a and the gesture input for sharing or deleting the icon shown in FIG. 9a may be the same or different gesture input; that is, the embodiment of the present application supports two different gesture inputs, respectively To generate a display card based on an icon, and display a window for sharing or deleting the icon; or, the embodiment of the application supports a gesture input, generating a display card based on an icon and displaying a window for sharing or deleting the icon.
  • the "share” and “delete” displayed in the above window and/or the corresponding controls may be located on the card, so that there is no need to display an additional window.
  • the lower part of the control in the upper right corner of the card 9031 displays the content of the memo application. For example: hold a regular departmental meeting in room 302 at 9 am; discuss the progress of the T project at noon and the old week; show the demo to the customer at 3 pm; call my mother at 8 pm; pick up the child from the cram school at 9 pm Home; learn English every day at 11pm.
  • the user uses the touch point 920 of the finger on the card 9031 as the starting point and moves the finger along the direction shown in FIG. 9b.
  • the card 9031 disappears and stops displaying.
  • the interface 903 shown in FIG. 9b Switch to or return to the interface 902 shown in FIG. 9a.
  • the user can use the touch point on the memo application icon 9021 as the starting point, and move the finger in a direction other than the direction shown in FIG. 9a, and the interface 902 shown in FIG. 9a switches To the interface 903 shown in Figure 9b.
  • the user takes the touch point of the finger on the card 9031 as the starting point and moves the finger in a direction other than the direction shown in Figure 9b.
  • the card 9031 disappears and the display stops, as shown in Figure 9b.
  • the shown interface 903 returns to the interface 902 shown in FIG. 9a.
  • switching from the interface 902 shown in FIG. 9a to the sliding direction of the first gesture input corresponding to the interface 903 shown in FIG. 9b is the second gesture corresponding to returning from the interface 903 shown in FIG. 9b to the interface 902 shown in FIG. 9a
  • the input sliding direction is opposite.
  • the other eight application icons displayed on the interface 902 of FIG. 9a in the first area are displayed in the second control area of the card 9031 in the form of a control after being reduced to another scale; the content of the memo is displayed on the card 9031 display content area.
  • the application icons that are not displayed in the first area on the interface 902 of FIG. 9a can still be opened by touching or in other ways, and their position has not changed, and their layout has no effect.
  • the content displayed on the card is the content of the memo, which is convenient for the user to obtain intuitively and conveniently, and only requires one step of operation. If you want to view more memo content displayed on the card, you can view more memo content by swiping in another direction on the card, etc. Therefore, it is not necessary that the memo application icon is displayed in the first control area of the card 9031 in the form of a control after being reduced to a certain ratio, that is, the upper left corner. Because there is no need to display the first control corresponding to the memo application icon in the first control area of the card 9031, the user can also learn that the card content displays the content interface or content simplified interface displayed after the memo application is opened.
  • the card display method provided by the embodiment of the present application is particularly suitable for situations where the card needs to be viewed for a long period of time. For example, a family of three visits a mall on a certain day, buys clothes, cosmetics, school supplies and other items for the children, husband and wife, and eats and watches movies in the mall. Due to frequent use of the payment code, the husband can use the mobile phone’s desktop On the current screen, an Alipay card is generated and displayed through a one-step operation, and the Alipay card displays a payment code. When in use, just take out the phone to show the card; when not in use, just lock the screen of the phone. This makes it unnecessary to switch between opening and closing the payment code frequently during consumption in the consumer shopping mall, which is convenient to use.
  • the user needs to view the memo within a period of time, he can perform the operation only once according to the preset gesture; the next time he views the memo, he only needs to swipe to the screen, and he does not need to operate according to the preset gesture again.
  • the user wants to view the content of another application, or display the shortcut function under another application, he can close the card first, and then use the touch point on the other application icon as the starting point, and follow the preset gestures. Just generate a display card based on another icon.
  • the card and the icon can coexist on the current screen of the desktop, and the card can be displayed on the current screen of the desktop according to the user's gestures or the card can be turned off to restore to the icon; the user can directly view the content of the card on the current screen of the desktop, At the same time, the user can directly open the application corresponding to any icon in the area other than the card on the current screen, and the user can also directly open the application corresponding to each of the N controls on the card, which is convenient to operate and has a better user experience; for example; , The user can directly touch the WeChat icon to open the WeChat application; the user can also directly touch the control corresponding to the QQ application in the upper right corner of the card to open the QQ application.
  • the user can not only intuitively obtain the content of the first card, but also directly open the application corresponding to each of the N controls, and can directly operate the current screen, taking into account the convenience of the user to the three parties, and realizes Balance in the convenience of the three parties.
  • the conversion between the icon displayed on the interface 902 of FIG. 9a and the card 9031 in the first area has a magnetic visual effect, which improves the user experience.
  • the memo application icon 9021 can be directly displayed in the upper left corner of the card 9031 in the form of a control, and does not need to be reduced to a certain ratio; it can also be displayed in the upper left corner of the card 9031 in the form of a control after being enlarged to a certain ratio.
  • the card 9031 may not be a square with rounded corners, but may have other shapes. The other shapes are any shapes that those skilled in the art can think of; including but not limited to rounded rectangles, racetrack rectangles, and the like.
  • the user can not only move the finger in the direction shown in FIG. 9a, but the user can move the finger in other directions.
  • any direction such as oblique upward 45 degrees, horizontal direction, etc., is not limited here.
  • the first gesture input is used to generate a card based on the icon. Based on the first gesture input, a display card 9031 is generated. The starting point of the first gesture input may be located on the memo application icon 9021 or in a certain area around the memo application icon 9021.
  • the sliding direction of the first gesture input is the first direction.
  • the first direction can include only one fixed direction or different directions; for example, first to the left and then up.
  • the first gesture input may be a gesture input obtained by touching on the current screen of the desktop.
  • the first gesture input may also be a gesture input of sliding with the current screen of the desktop.
  • the first gesture input is a gesture input that draws a circle from the current screen of the desktop.
  • the mobile terminal generates a card based on the icon according to the vertical projection gesture input of the first gesture input on the current screen of the desktop.
  • the second gesture input is used to restore the icon based on the card.
  • the starting point of the second gesture input may be located on the card 9031 or in a certain area around the card 9031.
  • the sliding direction of the second gesture input is the second direction.
  • the second direction can include only a fixed direction or a different direction.
  • the sliding direction of the second gesture input and the sliding direction of the first gesture input may be opposite or not opposite.
  • the direction of the second gesture input is the direction shown in FIG. 9b
  • the direction of the first gesture input may be the direction obliquely upward by 45 degrees in FIG. 9a.
  • the corresponding relationship between the sliding direction of the first gesture input and the sliding direction of the second gesture input needs to be preset.
  • the sliding direction of the second gesture input is opposite to the sliding direction of the first gesture input.
  • start point of the second gesture input may be the same as the end point of the first gesture input, or may be different from the end point of the first gesture input.
  • the end point of the second gesture input may be the same as the start point of the first gesture input, or may be different from the start point of the first gesture input.
  • the starting point of the first gesture input may be located on the icon to be converted into a card, or may be located in a certain area around the icon to be converted into a card.
  • the starting point of the first gesture input is located in a certain area around the icon to be converted into a card, which can be compared to the distance between the starting point and the center of other icons, and the distance between the starting point and the icon to be converted into a card
  • the distance between the centers is the shortest.
  • the icon to be converted into a card is a memo application icon. Compared with other icons, the distance between the starting point of the first gesture input and the center of the memo application icon is the shortest; then the starting point of the first gesture input is located around the memo application icon Within a certain area.
  • the preset rules determine which icon to generate based on card. For example, the starting point of the first gesture input is located in the middle of the player application icon and the memo application icon along the horizontal direction in Fig. 9a. Since the starting point, the distance between the first gesture input and the player application icon becomes shorter. If the distance from the memo application icon becomes longer, it is determined to generate a card based on the player application icon.
  • the preset rules can be other rules.
  • the preset gesture is a closed curve including only one first icon, and a first icon included in the closed curve is determined as the one first icon.
  • the starting point of the first gesture input is located in a certain area around the icon to be converted into a card, or the starting point of the first gesture input is located at the center of the icon to be converted into a card, and the preset length is The radius of the circle.
  • the starting point of the first gesture input is located in a certain area around the icon to be converted into a card is not limited to the above-mentioned embodiments, and other embodiments that can be imagined by those skilled in the art are also within the protection scope of the embodiments of the present application.
  • the starting point of the second gesture input can be located on the card to be converted into an icon, or can be located in a certain area around the card to be converted into an icon. Wherein, the starting point of the second gesture input is located in a certain area around the card to be converted into an icon, and the starting point of the second gesture input may be located in a circular range with the center of the card as the center and the preset length as the radius. . Take, for example, that there are two cards on the current screen of the desktop of the electronic device.
  • the starting point of the second gesture input is located in a certain area around the two cards, determine which card has the shortest distance from the center, and the card with the shortest center distance from the starting point is the card to be converted into an icon; If the distance between the centers of the two cards is the same, it is determined based on which card is converted into an icon according to a preset rule. Taking FIG. 27c as an example, the distance between the starting point of the second gesture input and the center of the card 27042 is equal to the distance from the center of the card 27041. Since the card 27042 is located above the card 27041, the icon is determined to be restored based on the card 27042.
  • the preset rules can be other rules.
  • the starting point of the second gesture input is located in a certain area around the card to be converted into an icon, and may also be an area within a certain distance from the center of the card.
  • the starting point of the second gesture input located in a certain area around the card to be converted into an icon is not limited to the above-mentioned embodiments, and other embodiments that can be imagined by those skilled in the art are also within the protection scope of the embodiments of the present application.
  • the end point of the first gesture input and the end point of the second gesture input are not limited.
  • the end point of the first gesture input can be located on the icon to be covered and absorbed by the card; it can also be located in a certain area around the icon to be covered and absorbed by the card.
  • the end point of the first gesture input may be located on the right side of the Facebook application icon in Fig. 9a.
  • the end point of the second gesture input can be located on the card to be converted into an icon; it can also be located in a certain area around the card to be converted into an icon.
  • the end point of the second gesture input may be located below the card 9031 in FIG. 9b.
  • a card is generated based on the icon.
  • the card is generated based on the icon.
  • the card is generated based on the icon.
  • the icon is determined by the starting point of the first gesture input.
  • the default size of the card is preset.
  • the card information provided by a common application App presets the default size of the card to be a rounded rectangle with 3 rows and 2 columns of icons.
  • the fixed fulcrum of the card is determined according to the position of the icon.
  • the fixed fulcrum at the lower right corner of the card 9031 in Fig. 9b is determined according to the position of the memo application icon 9021.
  • the generating direction of the card is determined according to the sliding direction of the first gesture.
  • the generating direction of the card 9031 is determined according to the sliding direction of the first gesture.
  • the icon is restored based on the card.
  • the icon is restored based on the card.
  • the starting point of the second gesture input is located on the card.
  • the starting point of the second gesture input is located in a specific area on the card.
  • the starting point of the second gesture input is located in a certain area around the card.
  • the fingers are shown moving on the screen of the electronic device, the fingers are only used for illustrative examples and not for limitation.
  • Various touch devices such as a stylus are also within the protection scope of the embodiments of the present application.
  • the first gesture input is not limited to the gesture input obtained by touching on the touch screen of the electronic device; it may also include the gesture input obtained by moving the drop point on the touch screen of the electronic device.
  • each of the N controls displayed on the card is a control related to each of the N icons, and the user can open a corresponding application through each of the N controls.
  • Figure 10 Take Figure 10 as an example to further expand the description.
  • the interface 1002 shown in FIG. 10a is switched to the interface 1003 shown in FIG. 10b.
  • a control is displayed in the upper right corner of the card 10031.
  • the control is related to the icon. Take the gallery control in the control as an example.
  • the gallery application corresponding to the gallery control 10032 will be opened; accordingly, the interface 1003 shown in FIG. 10b is switched to the interface 1004 shown in FIG. 10c.
  • the user can perform normal operations on the gallery application.
  • the user touches the button 10041, and the interface 1004 shown in FIG. 10c returns to the interface 1003 shown in FIG. 10b.
  • the user can also touch the icon displayed in the area other than the card 10031 on the interface 1003 shown in Figure 10b, such as touching the WeChat icon on the interface 1003, open the WeChat application, enter the opened interface of the WeChat application, and display After the opened interface is completed, by touching the return button, it still returns to the interface 1003 shown in FIG. 10b.
  • the user can also touch the WeChat icon on the interface 1003 to open WeChat credit, enter the interface after the WeChat application is opened, and after completing the operation on the interface after the WeChat application is opened, touch the back button to still return to the interface shown in Figure 10b 1003; After that, the user touches the gallery control 10032 on the card 10031 on the interface 1003 to enter the interface 1004 shown in FIG. 10c. After the operation is completed, the user touches the button 10041 to return to the interface 1003 shown in FIG. 10b.
  • the controls displayed by the card may also be controls related to icons other than the card overlay icon, and the user can open a corresponding application through each of the N controls.
  • Figure 11 Take Figure 11 as an example to further expand the description.
  • Fig. 11a using the touch point 1110 on the memo application icon 11021 as a starting point, after sliding along the sliding direction shown in Fig. 11a, the interface 1102 shown in Fig. 11a is switched to the interface 1103 shown in Fig. 11b.
  • a control is displayed in the upper right corner of the card 11031.
  • the control is related to icons other than the card overlay icon. Take the learning control in the control as an example.
  • the learning application corresponding to the learning control 11032 is opened; accordingly, the interface 1103 shown in FIG. 11b is switched to the interface 1104 shown in FIG. 11c.
  • the user can perform normal operations on the learning application.
  • the user touches the button 11041, and the interface 1104 shown in FIG. 11c returns to the interface 1103 shown in FIG. 11b.
  • the control displayed in the second control area has an operational follow-up connection or a content connection with the content of the card.
  • the second control area displays controls, and the controls are those displayed after the icons of applications used for sharing, such as WeChat, QQ, etc., are reduced by another ratio.
  • the second control area displays controls, and the controls are associated with the card content.
  • the content of the card includes "Learning English at 21 o'clock”
  • the controls include controls that are displayed after the learning application icon is reduced to another ratio.
  • the learning application icon may not be displayed on the current screen of the desktop of the electronic device, for example, displayed on other screens of the desktop of the electronic device.
  • the user can also touch the icon displayed in the area other than the card 11031 on the interface 1103 shown in Figure 11b, such as touching the WeChat icon on the interface 1103, open the WeChat application, enter the opened interface of the WeChat application, and click After the opened interface is completed, by touching the return button, it still returns to the interface 1103 shown in FIG. 11b.
  • the user can also touch the WeChat icon on the interface 1103 to open WeChat Credit, enter the interface after the WeChat application is opened, and after completing the operation on the interface after the WeChat application is opened, touch the back button to still return to the interface shown in Figure 11b 1103; After that, the user touches the gallery control 11032 on the card 11031 on the interface 1103 to enter the interface 1104 shown in Figure 11c. After the operation is completed, the user touches the button 11041 to return to the interface 1103 shown in Figure 11b.
  • the first gesture input may also have multiple methods.
  • Fig. 12 shows four modes including the mode shown in Fig. 9. Among them, the method shown in Figure 12a is the same as that shown in Figure 9, and will not be repeated here;
  • Figure 12c shows that after double-touching on the memo application icon and sliding outwards, it will also generate based on the memo application icon The card shown in Figure 12b.
  • Fig. 12d shows that after long pressing the memo application icon, the card shown in Fig. 12b is also generated based on the memo application icon.
  • Fig. 12 shows four modes including the mode shown in Fig. 9. Among them, the method shown in Figure 12a is the same as that shown in Figure 9, and will not be repeated here;
  • Figure 12c shows that after double-touching on the memo application icon and sliding outwards, it will also generate based on the memo application icon The card shown in Figure 12b.
  • Fig. 12d shows that after long pressing the memo application icon, the card shown in Fig. 12b is also generated based on the
  • FIG. 12e shows that after taking the touch point on the memo application icon as the starting point and the direction shown in Fig. 12e as the sliding direction, the card shown in Fig. 12b is also generated based on the memo application icon.
  • Figures 12a, 12d, and 12e show that a card is generated based on an icon through a single-point touch
  • Figure 12c shows that a card is generated based on an icon through a two-point touch.
  • a multi-point touch mode such as a three-point touch and a four-point touch can also be used to generate a card based on the icon. No further explanation here.
  • the card generated based on the icon may also have a variety of different coverage areas under the trigger of the first gesture input. Take, for example, that the starting point of the first gesture input is on the memo application icon, and the direction of the first gesture is sliding upward.
  • Figure 13 shows three ways in which the card generated based on the icon covers different ranges. In some embodiments, as shown in FIGS. 13a-13b, after the finger slides in the direction shown in FIG. 13a with the touch point on the memo application icon as the starting point, the card 13031 shown in FIG. 13b is generated;
  • the icons are memo, file management and Facebook.
  • the card 13031 is restored to the icons of the memo, file management and Facebook applications shown in Figure 13a, and the interface shown in Figure 13b is restored to The interface shown in Figure 13a.
  • the card 13031' shown in FIG. 13c is generated; card 13031' The covered icons are Memo, Player, File Management, Settings, Facebook and Twitter.
  • the card 13031' is restored to the memo, player, file management, settings, Facebook and Twitter applications shown in Figure 13a. Icon, the interface shown in Figure 13c is restored to the interface shown in Figure 13a.
  • the card 13031" shown in Figure 13d is generated; card 13031"
  • the covered icons are icons for memo, file management, Facebook, Alipay, games and mall applications.
  • the card 13031" is restored to the icons of the memo, file management, Facebook, Alipay, game and mall applications shown in Figure 13a, Figure 13d
  • the interface shown is restored to the interface shown in Figure 13a.
  • cards covering different ranges in response to the same starting point and direction of the first gesture input, cards covering different ranges can be generated.
  • the starting point and direction in FIG. 13a are only illustrative examples; taking other touch points as the starting point and sliding in other directions, cards covering different areas can be generated based on the icon.
  • the touch point on the memo application icon as a starting point, sliding left and horizontally, you can generate an overlay memo, player, gallery, and mail application icon based on the memo application icon, or you can generate an overlay memo, player, and mail application based on the memo application icon.
  • the correspondence between the range covered by the card and the starting point and direction of the first gesture needs to be preset. After setting, the same first gesture can only generate cards with the same coverage.
  • the card may also include the first control.
  • the card containing the first control may be as shown in Fig. 14a, Fig. 14b, Fig. 14c, Fig. 14d, and Fig. 14e. Take Figure 14a as an example for further explanation.
  • the first control area 1402 displays the first control
  • the second control area 1401 displays the control
  • the card content area 1403 displays the card content.
  • Figure 15 shows four of them. Wherein, FIG. 15a shows that after a double-point touch on the card 1504 and sliding inward, it will also be restored to the icon shown in FIG. 15b based on the card 1504. Fig. 15c shows that on the card 1505, selecting the control area 15051 on the card 1505 will also restore to the icon shown in Fig. 15b based on the card 1505.
  • Figure 15d shows that on the interface 1503', touching the area outside the card 1506 will also restore to the icon shown in Figure 15b based on the card 1506.
  • Fig. 15e shows that on the card 1507, touching any icon in the second control area on the card 1507 will also restore to the icon shown in Fig. 15b based on the card 1507.
  • the interfaces of interface 1503, interface 1503', interface 1503" and interface 1503"' after being restored to icons based on cards are 1502.
  • card 1504 card 1505, card 1506 and card 1507 are all the same cards, interface 1503, interface 1503', interface 1503" and interface 1503"' are all the same interface; just for It is clearly stated that different reference signs are used in different drawings.
  • multi-point touch modes such as three-point touch and four-point touch can also be used to restore the icon based on the card. No further explanation here.
  • FIG. 16 shows other ways of triggering the second gesture input based on the card recovery icon.
  • the interface 1604 shown in Fig. 16a contains a card 16041, and the card 16041 contains a second control area 16042; after the finger selects the second control area 16042, the interface 1604 shown in Fig. 16a switches to the interface 1605 shown in Fig. 16b. At this time, the card 16041 is restored to the icon.
  • Figure 17 shows another way of generating a card based on an icon and restoring it to an icon based on the card.
  • the interface 1702 shown in Figure 17a take the touch point of the finger on the memo application icon as the starting point and slide upward in the direction shown in Figure 17a; the interface 1702 shown in Figure 17a will become as shown in Figure 17b ⁇ interface 1703.
  • a card 17031 is generated.
  • the card 17031 is floating on the interface 1703.
  • the interface 1703 switches to the interface 1704; at the same time, the card 17031 switches to the card 17041, and the fixed button 17032 included in the card 17031 switches to the close button 17042 included in the card 17041.
  • the card 17041 is fixed on the interface 1704.
  • the interface 1704 returns to the interface 1702. In this way, after the card is generated, the card has two states-the floating state and the fixed state; when the card is in the floating state, when the first operation is detected, the card is converted from the floating state to the fixed state; when the card is in the fixed state, the In the second operation, the card is restored to an icon.
  • the card when the card is in the fixed state, when the third operation is detected, the card is converted from the fixed state to the suspended state.
  • the card when the card is in a hovering state, you can drag the card to another position, and the content of the card will change with the change of the icon covered by that position.
  • the embodiment of the present application also provides multiple ways to open the application corresponding to each control in the second control area on the card.
  • Figure 18-22 shows several of these ways. Take, for example, opening the Twitter app.
  • Figure 18a taking the touch point on the memo application icon 18021 as the starting point, sliding upward in the direction shown in Figure 18a, a card 18031 is generated. The interface at this time is the interface 1803 shown in Figure 18b.
  • the second control area 18032 is located on the upper part of the card 18031.
  • a card 19033 is generated.
  • the interface at this time is the interface 1903 shown in Fig. 19b .
  • the floating ball 19032 is located on the upper part of the card 19031. Take, for example, opening the Twitter app.
  • the enlarged second control area will be displayed above the second control area 21032.
  • the enlarged second control area will not be displayed above the second control area 21032. Touch your finger to the Twitter application control in the enlarged second control area 21042, and the Twitter application is opened.
  • the finger is not located above the Twitter application control in the second control area 22032
  • the enlarged Twitter will not be displayed above the Twitter application control in the second control area 21032 Application controls. Touch the enlarged Twitter application control with your finger, and the Twitter application is opened.
  • the finger can also directly touch the Twitter application controls included in the second control area of the interface.
  • the Twitter application is opened.
  • the controls in the second control area of the card can be quickly restored to icons on the current screen of the desktop.
  • FIG 23a there is extra space in the lower part of the interface 2303; select the second control area 23032 on the card 23031 and drag it toward the lower part of the interface 2303; after dragging it to the lower part of the interface 2304 shown in Figure 23b, the second The control area 23032 is switched to the second control area 23042, and the selected second control area 23042 is released; at this time, the controls on the second control area 23042 are restored to the original icon size, and are arranged in the same arrangement as the desktop icons in Figure 23c The lower part of the interface 2305 is shown. In this way, the controls in the second control area of the card can be quickly restored to icons on the current screen; it is convenient for users to operate.
  • an icon does not only correspond to a card.
  • One application icon can correspond to multiple cards. Take the calendar application icon corresponding to two cards as an example. As shown in Figure 24, after the finger slides upwards in the direction shown in Figure 24a with the touch point on the calendar application icon 24021 on the interface 2402 as the starting point, a card 24031 is generated. The interface at this time is the interface shown in Figure 24b. 2403; Afterwards, slide your finger to the left on the card 24031 in the direction shown in Figure 24b. At this time, the card 24031 is converted to a card 24041.
  • the interface at this time is the interface 2404 shown in Figure 24c; where the card 24031 and the card
  • the display style, content and form of 24041 are different; the finger can also slide right on the card 24041 to switch the card 24041 back to the card 24031.
  • one application icon can correspond to multiple cards; after the card is generated, switching between the multiple cards can be realized through operations. It should be noted that an application icon corresponds to several cards, which need to be set in advance.
  • cards can also be generated based on folder icons.
  • the folder icon is an icon in which the icons on the desktop are merged into a folder and displayed in the form of an icon.
  • a card 25031 is generated.
  • the interface at this time is the interface shown in Figure 25b. 2503; After that, the finger slides to the left in the direction shown in Figure 25b on the card 25031, and the card 25031 is converted into a card 25041.
  • the interface at this time is the interface 2504 shown in Figure 25c; the finger is on the card 25041, Sliding to the left in the direction shown in FIG.
  • the card 25041 is converted into a card 25051 at this time, and the interface at this time is the interface 2505 shown in FIG. 25d.
  • the finger can also slide to the right on the card 25051, at this time the card 25051 is converted into a card 25041; the finger continues to slide on the card 25041 to the right, at this time the card 25041 is converted to a card 25031.
  • card 25031 corresponds to the card generated based on the Alipay application icon in the folder icon
  • card 25041 corresponds to the card generated based on the memo application icon in the folder icon
  • card 25051 corresponds to the weather application icon generated in the folder icon Card.
  • one folder icon can correspond to multiple cards. After the card is generated, operations can be performed to switch between the multiple cards corresponding to the multiple icons included in the folder icon.
  • the finger starts from the touch point on the memo application icon 26021 on the interface 2602 and slides upward in the direction shown in Figure 26a to generate a card 26031.
  • the interface at this time is the interface shown in Figure 26b. 2603; After that, using the touch point on the Alipay application icon 26033 on the interface 2603 as the starting point, slide your finger upwards in the direction shown in Figure 26b to generate a card 26041.
  • the card 26031 is restored to the icon previously covered by it.
  • the interface at this time is the interface 2604 shown in FIG. 26c. That is, in the embodiment shown in FIG. 26, there can only be at most one card at the same time.
  • the finger starts from the touch point on the memo application icon 27021 on the interface 2702 and slides upward in the direction shown in Figure 27a to generate a card 27031.
  • the interface at this time is the interface shown in Figure 27b. 2703; After that, using the touch point on the Alipay application icon 27033 on the interface 2703 as the starting point, slide the finger upwards in the direction shown in Figure 27b to generate a card 27041. At this time, the card 27031 remains unchanged.
  • the interface at this time is The interface 2704 shown in Figure 27c. That is, in the embodiment shown in FIG. 27, there may be multiple cards at the same time; but there is no overlapping area between the multiple cards. As an example, FIG.
  • FIG. 27 illustrates the rules to be satisfied for the coexistence of multiple cards in this embodiment. Although only two cards are shown in FIG. 27, the two cards are not used to limit the scope of the embodiments of this application. Three, four, five and more cards are all within the scope of implementation of this application. . This is also true for subsequent examples of multiple cards, which does not limit the number of cards in the embodiment of the present application, but is only an illustrative example.
  • the finger starts from the touch point on the memo application icon 28021 on the interface 2802 and slides upward in the direction shown in Figure 28a to generate a card 28031.
  • the interface at this time is the interface shown in Figure 28b. 2803; After that, using the touch point on the Alipay application icon 28032 on the interface 2803 as the starting point, slide the finger upwards in the direction shown in Figure 28b to generate a card 28041. At this time, the card 28031 remains unchanged.
  • the interface at this time is The interface 2804 shown in Figure 28c. After that, using the touch point on the weather application icon 28042 on the interface 2804 as the starting point, the finger slides upwards in the direction shown in Figure 28c to generate a card 28051.
  • the card 28031 and the card 28041 are restored to be covered by each
  • the icon at this time is the interface 2805 shown in Figure 28d. That is to say, in the embodiment shown in FIG. 28, when there is no overlapping area between the cards, multiple cards can coexist on the current screen; when there is an overlapping area between the cards, only the newly generated card is displayed, and The newly generated card that has an overlapping area will be restored to the icon previously covered by it.
  • the embodiments of the present application also provide several implementation manners.
  • the finger starts from the touch point on the memo application icon 29021 on the interface 2902 and slides upward in the direction shown in Figure 29a to generate a card 29031.
  • the interface at this time is the interface shown in Figure 29b. 2903;
  • the touch point on the weather application icon 29032 on the interface 2903 as the starting point, slide the finger upwards in the direction shown in Figure 29b to generate a card 29041.
  • the card 29031 disappears.
  • the interface at this time is Figure 29c As shown in the interface 2904; afterwards, after the finger slides down in the direction shown in Figure 29c with the touch point on the card 29041 as the starting point, the card 29041 disappears, the previously generated card 29031 is displayed again, and the interface at this time is again Revert to interface 2903. That is, in the embodiment shown in FIG. 29, after the newly generated card is not displayed, the newly generated card is displayed on the current screen.
  • the finger starts from the touch point on the memo application icon 30021 on the interface 3002 and slides upward in the direction shown in Figure 30a to generate a card 30031.
  • the interface at this time is the interface shown in Figure 30b. 3003; After that, take the touch point on the weather application icon 30032 on the interface 3003 as the starting point and slide the finger upwards in the direction shown in Figure 30b to generate a card 30041. At this time, the card 30031 disappears.
  • the interface at this time is Figure 30c As shown in the interface 3004; afterwards, after the finger slides down in the direction shown in Figure 30c with the touch point on the card 30041 as the starting point, the card 30041 is restored to the icon covered by it, and the previously generated card 30031 is not Displayed, the interface at this time is restored to interface 3002 again. That is, in the embodiment shown in FIG. 30, after the newly generated card is not displayed, the next newly generated card is not displayed on the current screen.
  • Figure 31 shows how the card changes after dragging the card to a different position. As shown in Figure 31, after the finger slides upwards in the direction shown in Figure 31a with the touch point on the memo application icon 31021 on the interface 3102 as the starting point, a card 31031 is generated.
  • the interface at this time is the interface shown in Figure 31b 3103; After that, select the card 31031 with your finger and drag it upwards; when you drag the card 31031 to the position shown in Figure 31c, the interface is now the interface 3104 shown in Figure 31c; release the card 31031 with your finger, and then the card 31031 Converted to card 31051, the interface is now interface 3105 shown in Figure 31d; it can be seen that the content of card 31051 has changed, and the content of card 31051 at this time is recorded as card content one; in addition, on interface 3102, Take the touch point on the Alipay application icon as the starting point and slide in the upward sliding direction to generate a card.
  • the icons covered by the card are the icons of Alipay, stocks, games, maps, clocks, malls, Huawei sports, Taobao and music applications.
  • the content of is recorded as card content two; then card content one is the same as card content two. That is, in the embodiment shown in FIG. 31, after the card generated based on the icon is dragged to another position and released, the content of the card can be changed at this time.
  • Figures 32-38 show several specific implementations.
  • Figures 32-33 show two implementations in which the card and the icon are displayed on the current screen of the electronic device after the icon outside the card is dragged to the icon covered by the card to generate a folder icon.
  • FIG. 32 icons other than Card 32021 and Card 32021 coexist on the interface 3202 shown in Figure 32a.
  • the second control area in the upper right corner of the card 32021 contains the QQ control; after the finger long presses the memo application icon 32022, the desktop enters Edit state, the interface at this time is converted to interface 3203, and card 32021 is also converted to card 32031 in transparent or semi-transparent state; at the same time, the icon covered by card 32031 is displayed on interface 3203; finger drag memo application icon 32032 toward card 32031
  • the covered QQ application icon moves; when the finger puts the memo application icon 32032 on top of the QQ application icon, the interface at this time is converted to interface 3204; after the finger releases the memo application icon 32032, the QQ application icon and the memo application icon 32032 will merge It is the folder icon 32052, the interface at this time is converted to the interface 3205, and the card 32031 in the transparent state or semi-transparent state is converted to the card 32051
  • the icons other than the card 33021 and the card 33021 coexist on the interface 3302 shown in Figure 33a.
  • the second control area in the upper right corner of the card 33021 contains the QQ control; after the finger long presses the memo application icon 33032, the desktop enters Editing state, the interface at this time is converted to interface 3303, and the card 33021 is converted to a transparent state or a semi-transparent state card 33303; at the same time, the icon covered by the card 33031 is displayed on the interface 3303; the finger drags the memo application icon 33032 toward the card
  • the QQ application icon covered by 33031 moves; when the finger puts the memo application icon 33032 above the QQ application icon, the interface at this time is converted to interface 3304; after the finger releases the memo application icon 33032, the QQ application icon and the memo application icon 33032 will Merged into a folder icon 33052, the card 33031 is converted to a transparent or semi-transparent card 33051 at this time, and the
  • FIG. 34 shows an implementation manner in which specific application icons under the folder icons covered by the card are dragged out of the card, and the card and the icon are displayed on the current screen of the electronic device.
  • the icons other than the card 34021 and the card 34021 coexist on the interface 3402 shown in Figure 34a.
  • the second control area at the upper right corner of the card 34021 contains the folder control 34022; after a long finger press on the blank space, the desktop enters In the editing state, the card 34021 is converted to the transparent or semi-transparent card 34031; the interface is converted to the interface 3403, and the icon covered by the card 34031 is displayed on the interface 3403; the finger touches the folder icon 34032, at this time
  • the interface of the is converted to interface 3404, the folder icon 34032 is enlarged and displayed as the folder icon 34041, the finger selects and drags the memo application icon 34042 out; after the finger drags the memo application icon 34042 to the position shown in Figure 34e and releases it,
  • the memo application icon 34042 is shrunk and displayed as the memo application icon 34052.
  • the card 34031 is converted to a transparent or semi-transparent card 34051, and the interface at this time is converted to an interface 3405; after that, the card 34051 is converted to a card 34061, and the card 34061 is no longer Transparent, interface 3405 is converted to interface 3406; the difference between card 34061 and card 34021 is that the second control area in the upper right corner of card 34061 contains QQ control 34062 and no longer contains folder control 34022. That is to say, in the embodiment shown in FIG. 34, after the desktop enters the editing state, drag the specific application icon under the folder icon covered by the card to the outside of the card. Compared with the original card, the generated card is only The controls contained in the second control area are different, and the rest are the same.
  • FIG. 35 and FIG. 36 show two implementation manners in which the card and the icon are displayed on the current screen of the electronic device after the application icon covered by the card is directly dragged out of the card.
  • icons other than the card 35021 and the card 35021 coexist on the interface 3502 shown in Figure 35a.
  • the second control area 35022 in the upper right corner of the card 35021 contains WeChat, Alipay, QQ, Calendar, Settings, Clock, Twitter And the icon of the stock application; after long pressing the blank space with the finger, the desktop enters the editing state, and the card 35021 is converted to the transparent or semi-transparent card 35031; the interface is converted to the interface 3503, which is also covered by the card 35031 The icon is displayed on the interface 3503; the finger selects and drags the QQ application icon 35032 out; when the finger drags the QQ application icon 35032 to the position shown in Figure 35d and releases it, the card 35031 is converted to a transparent state or a semi-transparent state at this time At this time, the interface is converted to interface 3504.
  • the QQ application icon is dragged to the vacant position, without causing other application icons to fill in sequence; after that, card 35041 is converted to card 35051, card 35051 No longer transparent, interface 3504 is converted to interface 3505, the second control area 35052 in the upper right corner of card 35051 contains icons for WeChat, Alipay, calendar, settings, clock, Twitter and stock applications; card 35051 is compared with card 35021, both The difference is that the second control area 35052 of the card 35051 does not contain the QQ control, and the second control area 35022 of the card 35021 contains the QQ control. That is to say, in the embodiment shown in Figure 31, after the desktop enters the editing state, drag the application icon covered by the card to the outside of the card. Compared with the original card, the generated card only contains the second control area. The controls are different, and the rest are the same.
  • FIG 36 icons other than the card 36021 and the card 36021 coexist on the interface 3602 shown in Figure 36a.
  • the second control area 36022 in the upper right corner of the card 36021 contains WeChat, Alipay, QQ, calendar, settings, clock, and Twitter.
  • the icon of the stock application after long pressing the blank space with the finger, the desktop enters the editing state, and the card 36021 is converted to the transparent state or the semi-transparent state card 36031; the interface is converted to the interface 3603, which is also covered by the card 36031
  • the icon is displayed on the interface 3603; the finger selects and drags the QQ application icon 36032 out.
  • the card 36031 is converted to a transparent or semi-transparent card 36041; when the QQ application icon 36032 is dragged to the position shown in Figure 36d and released, the interface at this time is converted to the interface 3604; after that, the card 36041 is converted to card 36051, card 36051 is no longer transparent, interface 3604 is converted to interface 3605, the second control area 36052 in the upper right corner of card 36051 contains WeChat, settings, Twitter, calendar, file management, clock, Facebook and stock applications Icon; the difference between card 36051 and card 36021 is that the content of the card content area, the first control area and the second control area of card 36051 are respectively the same as the card content area, first control area and second control area of card 36021 The content of the control area is different.
  • FIGS. 37-38 show an implementation manner in which the card and the icon are displayed on the current screen of the electronic device after the icon outside the card is dragged to the icon covered by one of the cards to generate a folder. Take two cards as an example.
  • FIG. 37 there are card 37011 and card 37012 on the interface 3701 shown in Figure 37a; after the finger presses the mail application icon 37023, the desktop enters the editing state, and the card 37011 and card 37012 are respectively converted to a transparent state or Card 37021 in the semi-transparent state and card 37022 in the transparent state or semi-transparent state; the interface at this time is converted to the interface 3702, and the icons covered by the card 37021 and the card 37022 are displayed on the interface 3702; the finger drags the mail application icon 37023 toward The setting application icon 37024 covered by the card 37022 moves; when the finger places the mail application icon 37023 above the setting application icon 37024, the interface is converted to interface 3703; after the finger releases the mail application icon 37023, the setting application icon 37024 and mail The application icon 37023 will be merged into the folder icon 37042.
  • the card 37021 is converted to the card 37041, the card 37041 is no longer transparent, and the card 37022 disappears.
  • the interface at this time is converted to the interface 3704, and the icon covered by the card 37022 is displayed on the interface 3704 . That is to say, in the embodiment shown in FIG. 37, after multiple cards are displayed on the current screen and the desktop enters the editing state, as long as any card is edited, the edited card is no longer displayed.
  • FIG 38 there are cards 38011 and 38012 on the interface 3801 shown in Figure 38a; after a finger long presses the mail application icon 38023, the desktop enters the editing state, and the cards 38011 and 38012 are respectively converted to a transparent state or Card 38021 in the translucent state and card 38022 in the transparent state or translucent state; the interface at this time is converted to the interface 3802, and the icons covered by the card 38021 and the card 38022 are displayed on the interface 3802; drag the mail application icon 38023 to face The settings application icon 38024 covered by the card 38022 moves; after the finger puts the mail application icon 38023 on top of the settings application icon 38024, the interface is converted to interface 3803; after the finger releases the mail application icon 38023, the settings application icon 38024 and mail The application icon 38023 will be merged into the folder icon 38042.
  • the card 38021 is converted to the card 38011, the card 38011 is no longer transparent, and the card 38022 is converted to the card 3841.
  • the interface at this time is converted to the interface 3804, and the icon covered by the card 38041 is displayed in On interface 3804; after that, card 38041 is converted to card 38051, card 38051 is no longer transparent, interface 3804 is converted to interface 3805, card 38011 remains unchanged; compared with card 38012, the difference between the two is: card 38051
  • the controls contained in the second control area are different from the controls contained in the second control area of the card 38012. That is to say, in the embodiment shown in FIG. 38, after multiple cards are displayed on the current screen and the desktop enters the editing state, even if some of the cards are edited, the edited card is still retained, but the displayed content is The difference.
  • FIG. 39 shows a schematic diagram of a user interface for differently distinguishing between icons that generate cards and icons that cannot be generated.
  • the text below the icon used to generate the card is displayed with horizontal lines; the text below the icon that cannot be used to generate the card is not displayed at all. In this way, the user can identify and distinguish the icon used to generate the card through whether the icon on the current screen of the desktop has the above-mentioned mark.
  • the user recognizes that a horizontal line is displayed under the memo application icon shown in FIG. 39a, which is used to generate a card.
  • the folder icon will also include the above mark.
  • the marking method may also include displaying a horizontal line between the text below the icon used to generate the card and the icon, and displaying a box wrapping the icon on the periphery of the icon used to generate the card, A special mark, such as a star, is displayed at a specific position such as the upper right corner outside the icon used to generate the card. It is also possible to distinguish and recognize the icons used to generate the card by means of animation display.
  • the icon used to generate the card will display a specific animation; the icon that does not generate the card will not be displayed.
  • marking methods are only illustrative examples, and are not used to limit the scope of the embodiments of the present application. Other distinguishing methods that those skilled in the art can think of are all within the scope of the embodiments of the present application.
  • the content of generating a card based on the memo application icon in FIGS. 39a and 39b and restoring the icon to the icon based on the card is consistent with the related content of the above-mentioned FIGS. 9a and 9b, and will not be repeated here.
  • FIGS. 40-41 a card 40010 is displayed on the interface 4001 shown in FIG. 40a.
  • the first control 40011 is displayed in the upper left corner of the card 40010, and first sub-controls 40012, 40013, and 40014 are displayed around the first control 40011.
  • the payment code function of Alipay can be used directly.
  • the interface 4001 shown in FIG. 40a is switched to the interface 4002 shown in FIG. 40b.
  • the first sub-control 40012 will be switched to the first sub-control 40022; at the same time, the payment code interface displayed on the card content of the card 40010 is also switched to the scan interface displayed on the card content of the card 40020.
  • the scan function of Alipay can be used directly.
  • the user needs to call more functions, he can directly touch and click the first control 40011 to open the Alipay application to further call more functions; or directly touch and click the first sub-control 40014 to call more Function.
  • a card 41010 is displayed on the interface 4101 shown in FIG. 41a.
  • the card content 41011 is displayed on the card 41010.
  • the upper part of the card content 41011 displays a two-dimensional code and an instruction frame containing the two-dimensional code, and the lower part displays "scan", "payment code” and "transit code”.
  • the indicator arrow of the indicator box points to the "payment code” displayed below.
  • the card content 41021 displays a scan function interface and an instruction box containing the function interface at the top of the card content 41021, and "scan", "payment code” and “transit code” are displayed at the bottom.
  • the indicator arrow of the indicator box points to the "scan” displayed below.
  • the scan function of Alipay can be used directly.
  • FIG. 42 In order to switch between the first control in the card and other controls in the card, and to switch the display of the corresponding card.
  • the embodiment of the present application also provides the embodiment shown in FIG. 42.
  • a card 42010 is displayed on the interface 4201 shown in FIG. 42a.
  • the first control is displayed in the upper left corner of the card 42010.
  • Three first sub-controls are displayed around the first control.
  • Several controls are displayed in the upper right corner of the card 42010. Take control 42011 as an example.
  • the payment code function of Alipay can be used directly.
  • the interface 4201 shown in FIG. 42a is switched to the interface 4202 shown in FIG. 42b.
  • Control 42011 is a control displayed after the calendar application icon is scaled down.
  • the control 42011 will be switched to the first control and displayed in the upper left corner of the card 42020; at the same time, the payment code interface displayed on the card content of the card 42010 is also switched to the calendar interface displayed on the card content of the card 42020.
  • the first control can be interchanged with other controls on the card; at the same time, the content of the card will be updated synchronously with the update of the first control.
  • the method provided in the embodiment of this application is applicable to the following electronic devices.
  • FIG. 43 shows an electronic device 4300 provided by this application.
  • the electronic device 4300 includes at least one processor 4310, a memory 4320, and a display 4330.
  • the processor 4310 is coupled with the memory 4320 and the touch screen 4330.
  • the coupling in the embodiment of the present application may be a communication connection, an electrical connection, or other forms.
  • the memory 4320 is used to store program instructions.
  • the touch screen 4330 is used to display the user interface.
  • the processor 4310 is configured to call the program instructions stored in the memory 4020, so that the electronic device 4300 executes the steps executed by the electronic device in the card display method provided in the embodiment of the present application. It should be understood that the electronic device 4300 can be used to implement the card display method provided in the embodiment of the present application, and related features can be referred to the above, which will not be repeated here.
  • the display screen when the display screen has a touch function, the display screen is also called a touch display screen. Operations on the touch screen can be realized through virtual keys.
  • the display When the display does not have a touch function, the display is also called a non-touch display. The operation on the non-touch screen can be realized by physical buttons.
  • This application provides a computer program product containing instructions, which when the computer program product runs on an electronic device, causes the electronic device to execute the steps executed by the electronic device in the card display method provided in the embodiments of this application.
  • the present application provides a computer-readable storage medium, including instructions, which when run on an electronic device, cause the electronic device to execute the steps performed by the electronic device in the card display method provided in the embodiments of the present application.
  • the embodiments of the present application can be implemented in hardware or in hardware and software. When implemented by hardware and software, the above functions can be stored in a computer-readable medium. Based on this understanding, the technical solutions of the embodiments of the present application are essentially or the part that contributes to the prior art, or all or part of the technical solutions can be embodied in the form of software products, and the computer software products are stored in a storage
  • the medium includes several instructions for causing a computer device (which may be a personal computer, a server, or a network device, etc.) or a processor to execute all or part of the steps of the methods described in the various embodiments of the present application.
  • the aforementioned storage media include: flash memory, mobile hard disk, read-only memory, random access memory, magnetic disk or optical disk and other media that can store program codes.

Abstract

一种电子设备包括:显示屏,处理器,存储器和存储在存储器上的计算机程序,当计算机程序被处理器执行时,使得电子设备执行:显示桌面的当前屏;桌面的当前屏显示若干图标和背景;检测到对其中一个第一图标的用户输入;当前屏显示未占满该当前屏的第一卡片;该第一图标对应第一应用;第一卡片包括:第一卡片内容,包括第一应用打开后的第M层界面包含的部分内容;N个控件,N个控件中的每一个用于打开对应的应用,该应用对应于在显示第一卡片之前该桌面上相应的图标;第一卡片不同于第一应用打开后的第M层界面的全部和任意部分,M和N均为正整数。用户既能直观获取卡片内容,又能直接打开若干第二应用,还能直接对该桌面的当前屏进行操作。

Description

卡片显示方法、电子设备及计算机可读存储介质
本申请要求在2020年2月11日提交中国国家知识产权局、申请号为202010094030.9的中国专利申请的优先权,发明名称为“卡片显示方法、电子设备及计算机可读存储介质”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本申请涉及信息显示领域,尤其涉及卡片显示方法、电子设备及计算机可读存储介质。
背景技术
卡片能够使用户在电子设备上直观方便地查看相关信息或者运行某个应用下的特定功能,得到广泛应用。不过,现有的卡片显示位置固定,不够灵活;卡片的显示和切换操作繁琐,管理成本高;卡片挤占图标,影响桌面格局,或遮挡图标,导致对其他图标对应应用的操作不便。
发明内容
为了解决现有技术中存在的上述技术问题,本申请提出了卡片显示方法、电子设备及计算机可读存储介质;使得用户通过简便操作,即可在桌面(home screen)的当前屏(current screen)上实现卡片显示、切换及对其他应用的操控,卡片位置灵活,管理成本低,操作便利,提升用户体验。
第一方面,提供一种电子设备。该电子设备包括:显示屏;一个或多个处理器;存储器;以及一个或多个计算机程序,其中所述一个或多个计算机程序存储在所述存储器上,当所述计算机程序被所述一个或多个处理器执行时,使得所述电子设备执行以下步骤:显示桌面的当前屏,所述当前屏显示若干个图标;检测到对所述若干个图标中一个第一图标的第一用户输入;响应于所述第一用户输入,所述当前屏显示第一卡片,所述第一卡片未占满所述当前屏;所述第一图标为第一文件夹图标,所述第一文件夹图标至少包括第一应用图标,所述第一应用图标对应第一应用;或者,所述第一图标为第一应用图标,所述第一应用图标对应第一应用;所述第一卡片至少包括:第一卡片内容,所述第一卡片内容包括所述第一应用打开后的第M层界面包含的部分内容,M为大于等于1的正整数;N个控件,所述N个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第一卡片之前所述桌面上相应的图标,N为大于等于1的正整数;所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分。所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分是指,所述第一卡片不同于所述第一应用打开后的第M层界面的全部,也不同于所述第一 应用打开后的第M层界面的任意部分。这样,通过用户对第一图标的输入就可以在当前屏上显示第一卡片,不需要将当前屏切换至其他屏,卡片管理成本较低,显示卡片的位置较为灵活。此外,限定了第一卡片内容的范围;第一卡片内容就可以只显示关键信息,进而就能直观快捷地获取关键信息。另外,由于第一卡片显示在该桌面的当前屏上且未占满该当前屏,用户仍然可以直观获取到该当前屏上第一卡片以外区域显示的信息,在该当前屏上直接进行操作,如触摸该当前屏上第一卡片以外区域显示的图标以打开对应的应用,左右滑动该桌面的当前屏上第一卡片以外区域显示的背景以切换至其他屏。并且,用户还能通过第一卡片上的N个控件中的每一个控件直接打开对应的应用。也就是说,用户既能直观地获取第一卡片内容,又能直接打开N个控件中的一个控件对应的应用,还能直接对该当前屏进行操作,兼顾了用户对三方的使用便利,实现了在三方的使用便利上的平衡。另外,只要不停止显示第一卡片,第一卡片就一直显示在该当前屏上。如此,在用户近期一直要使用第一卡片内容时,在该当前屏上显示第一卡片后,用户无需再执行第一用户输入,直接使用该当前屏上第一卡片内容。本技术方案所包括的各技术特征相互之间紧密联系,组成一个密不可分的整体,正是由于这样一个整体,所以本技术方案产生了上述有益的技术效果。下述的各实施例对应的方案均如此,不再一一赘述。
根据第一方面,或者以上第一方面的任意一种实现方式,所述第一卡片在所述当前屏上的区域为第一区域;在显示所述第一卡片之前,所述N个图标位于所述第一区域;或者,所述N个图标位于所述当前屏上第一区域以外的区域;或者,所述N个图标位于所述桌面上所述当前屏以外的屏;或者,所述N个图标的任意部分位于上述三处区域中的任意区域。这样,在显示第一卡片之前,第一卡片上的N个控件对应的N个图标,可以位于第一区域、可以位于该当前屏上第一区域以外区域、还可以位于该桌面上该当前屏以外屏;从而,在第一卡片上可以打开桌面上显示的任意图标对应的应用,更加方便用户。
根据第一方面,或者以上第一方面的任意一种实现方式,所述第一用户输入通过一步操作输入;所述第一卡片内容在所述第一卡片上的面积占比最大;所述第一卡片内容的面积大于等于所述第一图标的面积;所述第一卡片在所述当前屏上的区域为第一区域;所述当前屏还显示背景;在显示所述第一卡片之前,所述N个控件对应N个图标,所述N个图标显示在所述第一区域上,所述第一区域只包括所述背景的第一部分、所述第一图标和所述N个图标,所述第一区域包括的图标的个数等于N加1。这样,明确了仅需在该当前屏上执行一步操作,就可显示上述卡片,使得卡片管理的步骤等成本大为降低,利于用户操作,提升用户体验;更加突出显示第一卡片内容,便于用户直观快捷地获取到第一卡片内容;进一步明确了该第一卡片在该当前屏上的显示位置为显示该第一卡片之前,包含该第一图标、该N个图标和背景的第二部分的该当前屏上的位置;从而,更加方便用户获取第一卡片与第一图标、N个图标之间的位置关系。
根据第一方面,或者以上第一方面的任意一种实现方式,M为大于等于2 的正整数。这样,就能通过用户输入,在卡片上直接显示所述第一应用打开后的第2层、第3层等以下的界面,减少操作步数,方便用户。比如,支付宝的付款码界面为支付宝的第2层界面,通过用户输入就直接显示出来。第2层以下的其他更深层次界面,也能通过用户输入就直接显示出来。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:检测到对所述N个控件中的一个控件的第二用户输入;响应于所述第二用户输入,显示所述N个控件中的一个控件对应的应用打开后的第S层界面;S为大于等于1的正整数;检测到一个返回操作;响应于所述返回操作,显示所述当前屏;所述当前屏显示的内容为响应所述第二用户输入之前所述当前屏显示的内容。这样,就提供了从第一卡片进入N个控件中的一个控件对应的应用打开后的第S层界面的方式,且这种方式对于用户来说,操作简单易行,能够快捷地切换至N个控件中的一个控件对应的应用打开后的第S层界面的情形;以及提供了从N个控件中的一个控件对应的应用打开后的第S层界面返回响应所述第二用户输入之前所述当前屏显示的内容,也即返回该当前屏显示第一卡片的情形,且这种方式对于用户来说,操作简单易行,能够快捷地切换回该当前屏显示第一卡片的情形。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:检测到对所述当前屏上所述第一卡片的第三用户输入;响应于所述第三用户输入,所述第一区域显示的内容为响应所述第一用户输入之前所述第一区域显示的内容。这样,在该当前屏上通过一个第三用户输入就可以停止显示所述第一卡片,不需要将该当前屏切换至其他屏,使得卡片管理的步骤等成本大为降低,操作便利,能够快捷地切换回响应第一用户输入之前第一区域显示的内容的情形。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:所述当前屏上第一区域以外的区域还显示L个图标,L为大于等于1的正整数;检测到对所述L个图标中的一个图标的第四用户输入;响应于所述第四用户输入,显示所述L个图标中的一个图标对应的应用打开后的界面;检测到一个返回操作;响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第四用户输入之前所述当前屏显示的内容。这样,就使得在该当前屏上显示第一卡片后,用户通过该当前屏上第一区域以外区域显示的L个图标中一个图标的操作,打开对应的应用,操作便利;还提供了从L个图标中的一个图标对应的应用打开后的界面返回响应所述第四用户输入之前所述当前屏显示的内容,也即返回该当前屏显示第一卡片的情形,且这种方式对于用户来说,操作简单易行,能够快捷地切换回该当前屏显示第一卡片的情形。
根据第一方面,或者以上第一方面的任意一种实现方式,所述第一卡片还包括:第一控件,所述第一控件用于打开所述第一应用;所述第一控件为所述第一图标缩小第一比例后显示的控件;所述N个控件为N个图标缩小第二比例后显示的控件;所述第一控件的面积大于所述N个控件中任意一个控件的面积;所 述第一控件、所述N个控件、所述第一卡片内容分别显示在所述第一卡片的左上角、右上角和中下部;所述第一用户输入为第一语音输入或第一手势输入;所述第一手势输入为起点位于所述第一图标上,滑动方向为向上滑动的手势输入;所述第一卡片随着所述第一手势输入而变化;所述第二用户输入和所述第四用户输入分别为:第二语音输入和第四语音输入,或者,第二手势输入和第四手势输入;所述第二手势输入和所述第四手势输入为触摸输入;所述第三手势输入通过一步操作输入;所述第三手势输入为起点位于所述第一卡片上,滑动方向与所述第一手势输入的滑动方向相反的手势输入。这样,使得用户通过第一卡片就能明了在第一卡片上还能打开N个控件对应的应用;另外,通过面积较大的方式来突出展示第一控件,使得用户更加清晰明了地获悉第一卡片内容与第一控件相对应;提供了第一卡片上的第一控件、N个控件和第一卡片内容的优选分布及显示方式;并且,明确了用户输入的两种具体方式;并且仅需在该当前屏上操作,不需要将该当前屏切换至桌面的其他屏,使得卡片管理的步骤等成本大为降低,操作便利,提升用户体验;另外,提供了便于用户操作和记忆的优选的第三手势输入方式,使得用户能够结合第一手势输入方式一同记忆。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:检测到对所述若干个图标中一个第二图标的第五用户输入;响应于所述第五用户输入,所述当前屏显示第二卡片,所述第二卡片未占满所述当前屏;所述第二图标为第二文件夹图标,所述第二文件夹图标至少包括第二应用图标,所述第二应用图标对应第二应用;或者,所述第二图标为第二应用图标,所述第二应用图标对应第二应用;所述第二卡片至少包括:第二卡片内容,所述第二卡片内容与所述第二应用相对应,所述第二卡片内容包括所述第二应用打开后的第P层界面包含的部分内容,P为大于等于1的正整数;K个控件,所述K个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第二卡片之前所述桌面上相应的图标,K为大于等于1的正整数;所述第二卡片不同于所述第二应用打开后的第P层界面的全部和任意部分;所述第二卡片内容的面积大于所述第二图标的面积;所述第二卡片在所述当前屏上的区域为第二区域;所述第二区域与所述第一区域不交叉,所述当前屏还显示所述第一卡片;或者,所述第二区域与所述第一区域交叉,所述当前屏停止显示所述第一卡片。这样,就能在该当前屏上显示第二卡片;并且在该当前屏上显示第二卡片的技术效果与在该当前屏上显示第一卡片的技术效果相同。此外,进一步限定了第二卡片内容的范围,排除部分冗余信息,使得用户获取或使用的第二卡片内容精简。也就是说,在该当前屏显示第二卡片且该第二卡片未占满该当前屏之后,用户既能直观地获取第二卡片内容,又能直接打开第四应用,还能直接对该当前屏进行操作,兼顾了三者的使用便利,实现了三者在使用便利上的平衡。另外,还能在该当前屏上显示第一卡片和第二卡片,第二卡片的显示与第一卡片的显示涉及的操作流程相同,第二卡片显示的内容与第一卡片显示的内容以及第二卡片显示基于的图标与第一卡片显示基于的图标存在差异。第一卡片的显示和第二卡片的显示可相互独立, 互不影响。此外,在不停止显示所述第二卡片时,所述第二卡片一直显示在该当前屏上。如此,在近期用户一直要使用所述第二卡片内容时,在该当前屏上显示第二卡片后,用户无需再执行所述第五用户输入,直接使用或获取该当前屏上与该第二图标相对应的第二卡片内容。另外,明确了第一卡片和第二卡片共同显示的条件,以及在不能共同显示的情形下,两者如何显示。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:所述第五用户输入通过一步操作输入;所述第二卡片内容在所述第二卡片上的面积占比最大;;所述第二卡片内容的面积大于等于所述第二图标的面积;在显示所述第二卡片之前,所述K个控件对应K个图标,所述K个图标显示在所述第二区域上,所述第二区域只包括所述背景的第二部分、所述第二图标和所述K个图标,所述第二区域包括的图标的个数等于K加1。这样,在显示第二卡片之前,第二卡片上的K个控件对应的K个图标,可以位于第二区域、可以位于该当前屏上第二区域以外区域、还可以位于该桌面上该当前屏以外屏;从而,在第二卡片上可以打开桌面上显示的任意图标对应的应用,更加方便用户。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:检测到对所述K个控件中的一个控件的第六用户输入;响应于所述第六用户输入,显示所述K个控件中的一个控件对应的应用打开后的第Q层界面;Q为大于等于1的正整数;检测到一个返回操作;响应于所述返回操作,显示所述当前屏;所述当前屏显示的内容为响应所述第五用户输入之前所述当前屏显示的内容。这样,就提供了从第二卡片进入K个控件中的一个控件对应的应用打开后的第Q层界面的方式,且这种方式对于用户来说,操作简单易行,能够快捷地切换至K个控件中的一个控件对应的应用打开后的第Q层界面的情形;以及提供了从K个控件中的一个控件对应的应用打开后的第Q层界面返回响应所述第六用户输入之前所述当前屏显示的内容,且这种方式对于用户来说,操作简单易行。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:检测到对所述当前屏上所述第二卡片的第七用户输入;响应于所述第七用户输入,所述第二区域显示的内容为响应所述第五用户输入之前所述第二区域显示的内容。这样,在该当前屏上通过一个第七用户输入就可以停止显示所述第二卡片,不需要将该当前屏切换至其他屏,使得卡片管理的步骤等成本大为降低,操作便利,能够快捷地切换回响应第五用户输入之前第一区域显示的内容的情形。
根据第一方面,或者以上第一方面的任意一种实现方式,所述电子设备还执行以下步骤:所述当前屏上第二区域以外的区域还显示R个图标,R为大于等于1的正整数;检测到对所述R个图标中的一个图标的第八用户输入;响应于所述第八用户输入,显示所述R个图标中的一个图标对应的应用打开后的界面;检测到一个返回操作;响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第八用户输入之前所述当前屏显示的内容。这样,就使得在该当前 屏上显示第二卡片后,用户通过该当前屏上第二区域以外区域显示的R个图标中一个图标的操作,打开对应的应用,操作便利;还提供了从R个图标中的一个图标对应的应用打开后的界面返回响应所述第八用户输入之前所述当前屏显示的内容,且这种方式对于用户来说,操作简单易行。
根据第一方面,或者以上第一方面的任意一种实现方式,所述第二卡片还包括:第二控件,所述第二控件用于打开所述第二应用;所述第二控件为所述第二图标缩小第三比例后显示的控件;所述K个控件为K个图标缩小第四比例后显示的控件;所述第二控件的面积大于所述K个控件中任意一个控件的面积;所述第一卡片的形状和大小分别与所述第二卡片的形状和大小相同;所述第一比例、所述第二比例分别与所述第三比例、所述第四比例相同;所述第二控件、所述K个控件、所述第二卡片内容分别显示在所述第二卡片的左上角、右上角和中下部;所述第五用户输入为第五语音输入或第五手势输入;所述第五手势输入为起点位于所述第二图标上,滑动方向为向上滑动的手势输入;所述第二卡片随着所述第五手势输入而变化;所述第六用户输入、所述第七用户输入和所述第八用户输入分别为:第六语音输入、第七语音输入和第八语音输入,或者,第六手势输入、第七手势输入和第八手势输入;所述第六手势输入和所述第八手势输入为触摸输入;所述第七手势输入通过一步操作输入;所述第七手势输入为起点位于所述第二卡片上,滑动方向与所述第五手势输入的滑动方向相反的手势输入。这样,使得用户通过第二卡片就能明了在第二卡片上还能打开K个控件对应的应用;另外,通过面积较大的方式来突出展示第二控件,使得用户更加清晰明了地获悉第二卡片内容与第二控件相对应;提供了第二卡片上的第二控件、K个控件和第二卡片内容的优选分布及显示方式;并且,明确了用户输入的两种具体方式;并且仅需在该当前屏上操作,不需要将该当前屏切换至桌面的其他屏,使得卡片管理的步骤等成本大为降低,操作便利,提升用户体验;另外,提供了便于用户操作和记忆的优选的第七手势输入方式,使得用户能够结合第五手势输入方式一同记忆。
第二方面,提供一种卡片显示方法。所述方法应用于包含显示屏的电子设备,包括:所述显示屏显示桌面的当前屏,所述当前屏显示若干个图标;检测到对所述若干个图标中一个第一图标的第一用户输入;响应于所述第一用户输入,所述当前屏显示第一卡片,所述第一卡片未占满所述当前屏;所述第一图标为第一文件夹图标,所述第一文件夹图标至少包括第一应用图标,所述第一应用图标对应第一应用;或者,所述第一图标为第一应用图标,所述第一应用图标对应第一应用;所述第一卡片至少包括:第一卡片内容,所述第一卡片内容包括所述第一应用打开后的第M层界面包含的部分内容,M为大于等于1的正整数;N个控件,所述N个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第一卡片之前所述桌面上相应的图标,N为大于等于1的正整数;所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分。所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分是指,所述第一卡片不同于所述第一应用打开后的第M层界面的全部,也不同于所述第一应用打 开后的第M层界面的任意部分。这样,通过用户对第一图标的输入就可以在当前屏上显示第一卡片,不需要将当前屏切换至其他屏,卡片管理成本较低,显示卡片的位置较为灵活。此外,限定了第一卡片内容的范围;第一卡片内容就可以只显示关键信息,进而就能直观快捷地获取关键信息。另外,由于第一卡片显示在该桌面的当前屏上且未占满该当前屏,用户仍然可以直观获取到该当前屏上第一卡片以外区域显示的信息,在该当前屏上直接进行操作,如触摸该当前屏上第一卡片以外区域显示的图标以打开对应的应用,左右滑动该桌面的当前屏上第一卡片以外区域显示的背景以切换至其他屏。并且,用户还能通过第一卡片上的N个控件中的一个控件直接打开对应的应用。也就是说,用户既能直观地获取第一卡片内容,又能直接打开N个控件中的一个控件对应的应用,还能直接对该当前屏进行操作,兼顾了用户对三方的使用便利,实现了在三方的使用便利上的平衡。另外,只要不停止显示第一卡片,第一卡片就一直显示在该当前屏上。如此,在用户近期一直要使用第一卡片内容时,在该当前屏上显示第一卡片后,用户无需再执行第一用户输入,直接使用该当前屏上第一卡片内容。
根据第二方面,所述方法包括:所述第一用户输入通过一步操作输入;所述第一卡片内容在所述第一卡片上的面积占比最大;所述第一卡片内容的面积大于等于所述第一图标的面积;所述第一卡片在所述当前屏上的区域为第一区域;所述当前屏还显示背景;在显示所述第一卡片之前,所述N个控件对应N个图标,所述N个图标显示在所述第一区域上,所述第一区域只包括所述背景的第一部分、所述第一图标和所述N个图标,所述第一区域包括的图标的个数等于N加1。这样,明确了仅需在该当前屏上执行一步操作,就可显示上述卡片,使得卡片管理的步骤等成本大为降低,利于用户操作,提升用户体验;更加突出显示第一卡片内容,便于用户直观快捷地获取到第一卡片内容;进一步明确了该第一卡片在该当前屏上的显示位置为显示该第一卡片之前,包含该第一图标、该N个图标和背景的第二部分的该当前屏上的位置;从而,更加方便用户获取第一卡片与第一图标、N个图标之间的位置关系。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:检测到对所述N个控件中的一个控件的第二用户输入;响应于所述第二用户输入,显示所述N个控件中的一个控件对应的应用打开后的第S层界面;S为大于等于1的正整数;检测到一个返回操作;响应于所述返回操作,显示所述当前屏;所述当前屏显示的内容为响应所述第二用户输入之前所述当前屏显示的内容。这样,就提供了从第一卡片进入N个控件中的一个控件对应的应用打开后的第S层界面的方式,且这种方式对于用户来说,操作简单易行,能够快捷地切换至N个控件中的一个控件对应的应用打开后的第S层界面的情形;以及提供了从N个控件中的一个控件对应的应用打开后的第S层界面返回响应所述第二用户输入之前所述当前屏显示的内容,也即返回该当前屏显示第一卡片的情形,且这种方式对于用户来说,操作简单易行,能够快捷地切换回该当前屏显示第一卡片的情形。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:检 测到对所述当前屏上所述第一卡片的第三用户输入;响应于所述第三用户输入,所述第一区域显示的内容为响应所述第一用户输入之前所述第一区域显示的内容。这样,在该当前屏上通过一个第三用户输入就可以停止显示所述第一卡片,不需要将该当前屏切换至其他屏,使得卡片管理的步骤等成本大为降低,操作便利,能够快捷地切换回响应第一用户输入之前第一区域显示的内容的情形。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:所述当前屏上第一区域以外的区域还显示L个图标,L为大于等于1的正整数;检测到对所述L个图标中的一个图标的第四用户输入;响应于所述第四用户输入,显示所述L个图标中的一个图标对应的应用打开后的界面;检测到一个返回操作;响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第四用户输入之前所述当前屏显示的内容。这样,就使得在该当前屏上显示第一卡片后,用户通过该当前屏上第一区域以外区域显示的L个图标中一个图标的操作,打开对应的应用,操作便利;还提供了从L个图标中的一个图标对应的应用打开后的界面返回响应所述第四用户输入之前所述当前屏显示的内容,也即返回该当前屏显示第一卡片的情形,且这种方式对于用户来说,操作简单易行,能够快捷地切换回该当前屏显示第一卡片的情形。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:所述第一卡片还包括:第一控件,所述第一控件用于打开所述第一应用;所述第一控件为所述第一图标缩小第一比例后显示的控件;所述N个控件为N个图标缩小第二比例后显示的控件;所述第一控件的面积大于所述N个控件中任意一个控件的面积;所述第一控件、所述N个控件、所述第一卡片内容分别显示在所述第一卡片的左上角、右上角和中下部;所述第一用户输入为第一语音输入或第一手势输入;所述第一手势输入为起点位于所述第一图标上,滑动方向为向上滑动的手势输入;所述第一卡片随着所述第一手势输入而变化;所述第二用户输入和所述第四用户输入分别为:第二语音输入和第四语音输入,或者,第二手势输入和第四手势输入;所述第二手势输入和所述第四手势输入为触摸输入;所述第三手势输入通过一步操作输入;所述第三手势输入为起点位于所述第一卡片上,滑动方向与所述第一手势输入的滑动方向相反的手势输入。这样,使得用户通过第一卡片就能明了在第一卡片上还能打开N个控件对应的应用;另外,通过面积较大的方式来突出展示第一控件,使得用户更加清晰明了地获悉第一卡片内容与第一控件相对应;提供了第一卡片上的第一控件、N个控件和第一卡片内容的优选分布及显示方式;并且,明确了用户输入的两种具体方式;并且仅需在该当前屏上操作,不需要将该当前屏切换至桌面的其他屏,使得卡片管理的步骤等成本大为降低,操作便利,提升用户体验;另外,提供了便于用户操作和记忆的优选的第三手势输入方式,使得用户能够结合第一手势输入方式一同记忆。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:检测到对所述若干个图标中一个第二图标的第五用户输入;响应于所述第五用户输入,所述当前屏显示第二卡片,所述第二卡片未占满所述当前屏;所述第二图标 为第二文件夹图标,所述第二文件夹图标至少包括第二应用图标,所述第二应用图标对应第二应用;或者,所述第二图标为第二应用图标,所述第二应用图标对应第二应用;所述第二卡片至少包括:第二卡片内容,所述第二卡片内容与所述第二应用相对应,所述第二卡片内容包括所述第二应用打开后的第P层界面包含的部分内容,P为大于等于1的正整数;K个控件,所述K个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第二卡片之前所述桌面上相应的图标,K为大于等于1的正整数;所述第二卡片不同于所述第二应用打开后的第P层界面的全部和任意部分;所述第二卡片内容的面积大于所述第二图标的面积;所述第二卡片在所述当前屏上的区域为第二区域;所述第二区域与所述第一区域不交叉,所述当前屏还显示所述第一卡片;或者,所述第二区域与所述第一区域交叉,所述当前屏停止显示所述第一卡片。这样,就能在该当前屏上显示第二卡片;并且在该当前屏上显示第二卡片的技术效果与在该当前屏上显示第一卡片的技术效果相同。此外,进一步限定了第二卡片内容的范围,排除部分冗余信息,使得用户获取或使用的第二卡片内容精简。也就是说,在该当前屏显示第二卡片且该第二卡片未占满该当前屏之后,用户既能直观地获取第二卡片内容,又能直接打开第四应用,还能直接对该当前屏进行操作,兼顾了三者的使用便利,实现了三者在使用便利上的平衡。另外,还能在该当前屏上显示第一卡片和第二卡片,第二卡片的显示与第一卡片的显示涉及的操作流程相同,第二卡片显示的内容与第一卡片显示的内容以及第二卡片显示基于的图标与第一卡片显示基于的图标存在差异。第一卡片的显示和第二卡片的显示可相互独立,互不影响。此外,在不停止显示所述第二卡片时,所述第二卡片一直显示在该当前屏上。如此,在近期用户一直要使用所述第二卡片内容时,在该当前屏上显示第二卡片后,用户无需再执行所述第五用户输入,直接使用或获取该当前屏上与该第二图标相对应的第二卡片内容。另外,明确了第一卡片和第二卡片共同显示的条件,以及在不能共同显示的情形下,两者如何显示。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:所述第五用户输入通过一步操作输入;所述第二卡片内容在所述第二卡片上的面积占比最大;所述第二卡片内容的面积大于等于所述第二图标的面积;在显示所述第二卡片之前,所述K个控件对应K个图标,所述K个图标显示在所述第二区域上,所述第二区域只包括所述背景的第二部分、所述第二图标和所述K个图标,所述第二区域包括的图标的个数等于K加1。这样,在显示第二卡片之前,第二卡片上的K个控件对应的K个图标,可以位于第二区域、可以位于该当前屏上第二区域以外区域、还可以位于该桌面上该当前屏以外屏;从而,在第二卡片上可以打开桌面上显示的任意图标对应的应用,更加方便用户。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:检测到对所述K个控件中的一个控件的第六用户输入;响应于所述第六用户输入,显示所述K个控件中的一个控件对应的应用打开后的第Q层界面;Q为大于等于1的正整数;检测到一个返回操作;响应于所述返回操作,显示所述当前屏; 所述当前屏显示的内容为响应所述第五用户输入之前所述当前屏显示的内容。这样,就提供了从第二卡片进入K个控件中的一个控件对应的应用打开后的第Q层界面的方式,且这种方式对于用户来说,操作简单易行,能够快捷地切换至K个控件中的一个控件对应的应用打开后的第Q层界面的情形;以及提供了从K个控件中的一个控件对应的应用打开后的第Q层界面返回响应所述第六用户输入之前所述当前屏显示的内容,且这种方式对于用户来说,操作简单易行。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:检测到对所述当前屏上所述第二卡片的第七用户输入;响应于所述第七用户输入,所述第二区域显示的内容为响应所述第五用户输入之前所述第二区域显示的内容。这样,在该当前屏上通过一个第七用户输入就可以停止显示所述第二卡片,不需要将该当前屏切换至其他屏,使得卡片管理的步骤等成本大为降低,操作便利,能够快捷地切换回响应第五用户输入之前第一区域显示的内容的情形。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:所述当前屏上第二区域以外的区域还显示R个图标,R为大于等于1的正整数;检测到对所述R个图标中的一个图标的第八用户输入;响应于所述第八用户输入,显示所述R个图标中的一个图标对应的应用打开后的界面;检测到一个返回操作;响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第八用户输入之前所述当前屏显示的内容。这样,就使得在该当前屏上显示第二卡片后,用户通过该当前屏上第二区域以外区域显示的R个图标中一个图标的操作,打开对应的应用,操作便利;还提供了从R个图标中的一个图标对应的应用打开后的界面返回响应所述第八用户输入之前所述当前屏显示的内容,且这种方式对于用户来说,操作简单易行。
根据第二方面,或者以上第二方面的任意一种实现方式,所述方法包括:所述第二卡片还包括:第二控件,所述第二控件用于打开所述第二应用;所述第二控件为所述第二图标缩小第三比例后显示的控件;所述K个控件为K个图标缩小第四比例后显示的控件;所述第二控件的面积大于所述K个控件中任意一个控件的面积;所述第一卡片的形状和大小分别与所述第二卡片的形状和大小相同;所述第一比例、所述第二比例分别与所述第三比例、所述第四比例相同;所述第二控件、所述K个控件、所述第二卡片内容分别显示在所述第二卡片的左上角、右上角和中下部;所述第五用户输入为第五语音输入或第五手势输入;所述第五手势输入为起点位于所述第二图标上,滑动方向为向上滑动的手势输入;所述第二卡片随着所述第五手势输入而变化;所述第六用户输入、所述第七用户输入和所述第八用户输入分别为:第六语音输入、第七语音输入和第八语音输入,或者,第六手势输入、第七手势输入和第八手势输入;所述第六手势输入和所述第八手势输入为触摸输入;所述第七手势输入通过一步操作输入;所述第七手势输入为起点位于所述第二卡片上,滑动方向与所述第五手势输入的滑动方向相反的手势输入。这样,使得用户通过第二卡片就能明了在第二卡片上还能打开K个控件对应的应用;另外,通过面积较大的方式来突出展示第二控件,使得用户更加清晰 明了地获悉第二卡片内容与第二控件相对应;提供了第二卡片上的第二控件、K个控件和第二卡片内容的优选分布及显示方式;并且,明确了用户输入的两种具体方式;并且仅需在该当前屏上操作,不需要将该当前屏切换至桌面的其他屏,使得卡片管理的步骤等成本大为降低,操作便利,提升用户体验;另外,提供了便于用户操作和记忆的优选的第七手势输入方式,使得用户能够结合第五手势输入方式一同记忆。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一文件夹图标包括E个第一应用图标;E为大于等于2的正整数;检测到第一切换用户输入;响应于所述第一切换用户输入,所述第一卡片的第一卡片内容切换为另一第一卡片内容,所述第一卡片内容、所述另一第一卡片内容分别与所述E个第一应用图标中的两个第一应用图标相对应。这样,就使得第一文件夹图标包括多个第一应用图标时,能够根据用户输入的第一切换用户输入,将第一卡片的第一卡片内容进行切换。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第二文件夹图标包括F个第二应用图标;F为大于等于2的正整数;检测到第二切换用户输入;响应于所述第二切换用户输入,所述第二卡片的第二卡片内容切换为另一第二卡片内容,所述第二卡片内容、所述另一第二卡片内容分别与所述F个第二应用图标中的两个第二应用图标相对应。这样,就使得第二文件夹图标包括多个第二应用图标时,能够根据用户输入的切换用户输入,将第二卡片的第二卡片内容进行切换。这样,就使得第二文件夹图标包括多个第二应用图标时,能够根据用户输入的第二切换用户输入,将第二卡片的第二卡片内容进行切换。
根据第二方面,或者以上第二方面的任意一种实现方式,所述E个第一应用图标中的至少一个第一应用图标对应多张第一卡片;检测到第三切换用户输入;响应于所述第三切换用户输入,所述多张第一卡片切换。这样,就使得第一文件夹图标包括的至少一个第一应用图标对应多张第一卡片时,能够根据用户输入的第三切换用户输入,将多张第一卡片进行切换。
根据第二方面,或者以上第二方面的任意一种实现方式,所述F个第二应用图标中的至少一个第二应用图标对应多张第二卡片;检测到第四切换用户输入;响应于所述第四切换用户输入,所述多张第二卡片切换。这样,就使得第二文件夹图标包括的至少一个第二应用图标对应多张第二卡片时,能够根据用户输入的第四切换用户输入,将多张第二卡片进行切换。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片悬浮在所述当前屏上;所述第一卡片还包括固定按钮;在触摸所述固定按钮后,所述第一卡片固定在所述当前屏上。这样,就提供了第一卡片在所述当前屏上的另外一种显示方式,给用户提供了至少两种选择。用户可以根据自己的喜好,选择将第一卡片悬浮在所述当前屏上或者固定在所述当前屏上。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第二卡片悬浮在所述当前屏上;所述第二卡片还包括固定按钮;在触摸所述固定按钮后,所述 第二卡片固定在所述当前屏上。这样,就提供了第二卡片在所述当前屏上的另外一种显示方式,给用户提供了至少两种选择。用户可以根据自己的喜好,选择将第二卡片悬浮在所述当前屏上或者固定在所述当前屏上。
根据第二方面,或者以上第二方面的任意一种实现方式,在所述第一卡片固定在所述当前屏上之后,所述第一卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片;或者,所述第一卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片。这样,就提供了停止显示第一卡片的两种实施方式,用户通过关闭按钮,停止显示第一卡片。
根据第二方面,或者以上第二方面的任意一种实现方式,在所述第二卡片固定在所述当前屏上之后,所述第二卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片;或者,所述第二卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片。这样,就提供了停止显示第二卡片的两种实施方式,用户通过关闭按钮,停止显示第二卡片。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一图标为第一应用图标,所述第一应用图标对应多张第一卡片;检测到第五切换用户输入;响应于所述第五切换用户输入,所述多张第一卡片切换。这样,就使得第一图标为第一应用图标且对应多张第一卡片时,能够根据用户输入的第五切换用户输入,将多张第一卡片进行切换。
根据第二方面,或者以上第二方面的任意一种实现方式,检测到对第一控件和N个控件中一个控件的第六切换用户输入,响应于所述第六切换用户输入,所述N个控件中一个控件与所述第一控件互换位置并调整大小比例来适应调整后的位置,所述第一卡片内容更新,更新后的第一卡片内容与调整后的第一控件相对应。这样,就使得用户能够方便灵活地通过调整第一控件和N个控件中一个控件的交换,来更新第一卡片内容并显示;从而,用户感受更加便利灵活。
根据第二方面,或者以上第二方面的任意一种实现方式,所述N个控件起始以球体形式显示在所述第一卡片上;在触摸所述球体后,所述第一卡片显示所述N个控件。这样,就提供了另外一种操作方式,使得所述N个控件在需要展开显示时才展开显示,在不需要展开显示时收缩为球体,从而节省出更多的显示空间供第一卡片包括的其他内容显示。
根据第二方面,或者以上第二方面的任意一种实现方式,检测到对第一控件或所述N个控件中任意一个控件的第九用户输入,响应于所述第九用户输入,所述显示屏显示所述第一应用或所述N个控件中任意一个控件对应的应用打开后的内容。这样,就方便用户打开第一卡片上第一控件对应的第一应用或所述N个控件中任意一个控件对应的应用。
根据第二方面,或者以上第二方面的任意一种实现方式,检测到在垂直于所述当前屏的方向上,触控设备置于所述第一控件或所述N个控件中任意一个控件的上方,并且在所述方向上对所述第一控件或所述N个控件中任意一个控件的远离输入后;或者,检测到在垂直于所述当前屏的方向上,触控设备置于所述 第一控件或所述N个控件中任意一个控件的上方,所述第一控件或所述N个控件中任意一个控件放大,并且在所述方向上对所述第一控件或所述N个控件中任意一个控件的远离输入后;或者,检测到在垂直于所述当前屏的方向上,触控设备置于所述N个控件中任意一个控件的上方,所述N个控件中任意一个控件放大,检测到对所述放大后的任意一个控件的触摸输入后;响应于上述输入,所述显示屏显示所述第一应用或所述N个控件中任意一个控件对应的应用打开后的内容。这样,就提供了第一控件或N个控件中任意一个控件对应应用的打开方式;使得用户可以更加方便、快捷、灵活地打开第一卡片上第一控件对应的第一应用或所述N个控件中任意一个控件对应的应用。
根据第二方面,或者以上第二方面的任意一种实现方式,在选中第一卡片,拖动至所述当前屏上第一区域以外的另外一个区域,按照所述第一图标在所述第一区域的相对位置,在所述另外一个区域上存在另外一个第一图标时,所述第一卡片切换为所述另外一个第一卡片,所述另外一个第一卡片包括另外一个第一卡片内容,所述另外一个第一卡片内容与所述另外一个第一图标相对应。这样,就使得第一卡片拖动至所述当前屏上的满足一定条件的另外一个区域后,所述第一卡片会自动切换更新;从而,更加方便用户使用。
根据第二方面,或者以上第二方面的任意一种实现方式,检测到对所述当前屏的第十用户输入,响应于所述第十用户输入,所述当前屏进入编辑状态,所述第一卡片呈透明或半透明,所述第一控件和/或所述N个控件中一个控件恢复至响应所述第一用户输入之前所述当前屏上第一图标和/或所述N个图标中相应图标的大小及位置;检测到所述当前屏上所述第一区域内的任意一个或多个图标拖动至所述第一区域外并释放,或者,检测到所述当前屏上所述第一区域外的任意一个或多个图标拖动至所述第一区域内并释放,响应于上述检测结果,停止显示所述第一卡片;按照所述桌面上图标的排列方式,排列显示所述第一区域内的图标。这样,就提供了一种在所述当前屏进入编辑状态后,将第一区域内的图标拖动至第一区域外并释放后,或者,将第一区域外的图标拖动至第一区域内并释放后,停止显示所述第一卡片的方式。从而,便于用户通过该方式停止显示第一卡片。进一步地,还可以对第二卡片进行相应的操作,进而获取相应的结果。由于对第二卡片的操作和获取的结果与对第一卡片的操作和获取的结果相应,在此不再赘述。
根据第二方面,或者以上第二方面的任意一种实现方式,检测到对所述当前屏的第十一用户输入,响应于所述第十一用户输入,所述当前屏进入编辑状态,所述卡片呈透明或半透明,所述第一控件和/或所述N个控件中一个控件恢复至响应所述第一用户输入之前所述当前屏上第一图标和/或所述N个图标中相应图标的大小及其位置;检测到所述当前屏上所述第一区域内的任意一个或多个图标拖动至所述第一区域外并释放,或者,检测到所述当前屏上所述第一区域外的任意一个或多个图标拖动至所述第一区域内并释放,响应于上述检测结果,所述第一卡片相应更新;所述更新后的第一卡片的第一卡片内容与更新后的第一图标相 对应。这样,就提供了一种在所述当前屏进入编辑状态后,将第一区域内的图标拖动至第一区域外并释放后,或者,将第一区域外的图标拖动至第一区域内并释放后,更新显示所述第一卡片的方式。从而,便于用户通过该方式来更新显示第一卡片。进一步地,还可以对第二卡片进行相应的操作,进而获取相应的结果。由于对第二卡片的操作和获取的结果与对第一卡片的操作和获取的结果相应,在此不再赘述。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片在所述当前屏上随拖动手势移动。这样,就提供了一种操作方式;第一卡片在所述当前屏上随拖动手势直接拖动,不用再通过诸如长按的手势解除固定后,再拖动。从而,更加方便用户操作,提升用户体验。进一步地,还可以对第二卡片进行相应的操作,进而获取相应的结果。由于对第二卡片的操作和获取的结果与对第一卡片的操作和获取的结果相应,在此不再赘述。
根据第二方面,或者以上第二方面的任意一种实现方式,在选中所述第一卡片,拖动至所述当前屏上所述第一卡片和/或所述第二卡片以外的区域释放后,所述第一卡片包括的内容没有变化。这样,就使得所述第一卡片拖动至所述当前屏上所述第一卡片和/或所述第二卡片以外的区域,不会自动切换显示新的第一卡片。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片和所述第二卡片的形状是预先设置的。优选地,所述第一卡片和第二卡片的形状预先设置相同。这样,用户观看到的卡片形状相同,体验较好。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片的形状为圆角矩形,所述圆角矩形覆盖所述桌面上图标排列的若干行和若干列。这样,就使得第一卡片的形状与所述当前屏上第一卡片以外区域的图标的排列保持一致。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片还包括:第一子控件,所述第一子控件在所述第一卡片上的区域为第一子区域;所述第一卡片内容在所述第一卡片上的区域为第三区域;所述第一子区域在所述第三区域以外;检测到对所述第一子控件的第十二用户输入,所述第一卡片内容停止显示,与所述第一卡片内容对应的第二子控件显示在所述第二子区域上,与所述第一子控件对应的第三卡片内容显示在所述第三区域上;所述第二子区域在所述第三区域以外;所述第一卡片内容和所述第三卡片内容分别对应所述第一应用的不同功能和/或不同信息。这样,就使得用户通过对第一子控件的用户输入,实现对第一应用的不同功能和/或不用信息对应的卡片内容的切换。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一子区域与所述第二子区域相同;或者,所述第一子区域与所述第二子区域不同。
根据第二方面,或者以上第二方面的任意一种实现方式,所述第一卡片内容还包括:第二子控件;所述第一卡片内容在所述第一卡片上的区域为第三区域;检测到对所述第二子控件的第十三用户输入,所述第一卡片内容停止显示,与所 述第二子控件对应的第四卡片内容显示在所述第三区域上。这样,就能通过卡片内容包括的控件实现不同的卡片内容的切换,更加方便用户。
根据第二方面,或者以上第二方面的任意一种实现方式,电子设备包括但不限于手机、平板电脑、手表、手环、电脑、眼镜、头盔、电视、车载设备等智能设备。
需要说明的是,有关第二方面的任意一种实现方式,在没有特殊说明的情况下,也适用于第一方面;有关第一方面的任意一种实现方式,在没有特殊说明的情况下,也适用于第二方面。
第三方面,提供一种电子装置。该电子装置包括:显示模块,所述显示模块显示所述电子设备的桌面的当前屏,所述当前屏显示若干个图标;检测模块,检测到对所述若干个图标中一个第一图标的第一用户输入;所述显示模块还用于,响应于所述第一用户输入,在所述当前屏显示第一卡片,所述第一卡片未占满所述当前屏;所述第一图标为第一文件夹图标,所述第一文件夹图标至少包括第一应用图标,所述第一应用图标对应第一应用;或者,所述第一图标为第一应用图标,所述第一应用图标对应第一应用;所述第一卡片至少包括:第一卡片内容,所述第一卡片内容包括所述第一应用打开后的第M层界面包含的部分内容,M为大于等于1的正整数;N个控件,所述N个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第一卡片之前所述桌面上相应的图标,N为大于等于1的正整数;所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分。
第三方面的任意一种实现方式分别与第二方面的任意一种实现方式相对应。第三方面以及第三方面中任意一种实现方式所对应的技术效果可参见上述第二方面以及第二方面中任意一种实现方式所对应的技术效果,此处不再赘述。
第四方面,提供一种计算机可读存储介质,包括指令,当所述指令在电子设备上运行时,使得所述电子设备执行第二方面以及第二方面中任意一种实现方式中的卡片显示方法。
另外,第四方面中任意一种实现方式和对应的技术效果可参见上述第二方面的实现方式和对应的技术效果以及第二方面中任意一种实现方式和对应的技术效果,此处不再赘述。
第五方面,提供一种电子设备上的图形用户界面系统。所述电子设备具有显示屏、存储器、以及一个或多个处理器,所述一个或多个处理器用于执行存储在所述存储器中的一个或多个计算机程序,所述图形用户界面包括所述电子设备执行第二方面以及第二方面中任意一种实现方式的方法时显示的图形用户界面。
第六方面,提供一种计算机程序产品,当其在计算机上运行时,使得计算机执行如第二方面以及第二方面中任意一种实现方式中的卡片显示方法。
另外,第六方面中任意一种实现方式和对应的技术效果可参见上述第二方面的实现方式和对应的技术效果以及第二方面中任意一种实现方式和对应的技术效果,此处不再赘述。
第七方面,提供一种电子系统,包括:电子设备和服务器;所述电子设备包括显示屏和通信接口;所述服务器包括一个或多个处理器、存储器以及一个或多个计算机程序,所述一个或多个计算机程序存储在所述一个或多个存储器中,所述一个或多个处理器在执行所述一个或多个计算机程序时,使得所述电子系统实现第二方面以及第二方面中任意一种实现方式的卡片显示方法。
另外,第七方面中任意一种实现方式和对应的技术效果可参见上述第二方面的实现方式和对应的技术效果以及第二方面中任意一种实现方式和对应的技术效果,此处不再赘述。
附图说明
为了更清楚地说明现有技术和本申请实施例中的技术方案,下面将对现有技术和本申请实施例描述中所需要使用的附图作一简单地介绍。显而易见地,下面描述中的附图涉及本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为提供的弹出窗口显示的用户界面示意图。
图2为提供的卡片管理操作的用户界面示意图。
图3为本申请实施例提供的电子设备的结构示意图。
图4为本申请实施例提供的电子设备的软件结构框图。
图5为本申请实施例提供的卡片显示方法的软件流程示意图。
图6为本申请实施例提供的卡片显示方法的流程示意图。
图7为本申请实施例提供的卡片显示方法涉及的图层的结构示意图。
图8为本申请实施例提供的卡片显示方法涉及的卡片层基板生成的示意图。
图9为本申请实施例提供的卡片显示方法的用户界面的示意图。
图10为本申请实施例提供的卡片显示方法的用户界面的示意图。
图11为本申请实施例提供的卡片显示方法的用户界面的示意图。
图12为本申请实施例提供的卡片显示方法的用户界面的示意图。
图13为本申请实施例提供的卡片显示方法的用户界面的示意图。
图14为本申请实施例提供的卡片显示方法的用户界面的示意图。
图15为本申请实施例提供的卡片显示方法的用户界面的示意图。
图16为本申请实施例提供的卡片显示方法的用户界面的示意图。
图17为本申请实施例提供的卡片显示方法的用户界面的示意图。
图18为本申请实施例提供的卡片显示方法的用户界面的示意图。
图19为本申请实施例提供的卡片显示方法的用户界面的示意图。
图20为本申请实施例提供的卡片显示方法的用户界面的示意图。
图21为本申请实施例提供的卡片显示方法的用户界面的示意图。
图22为本申请实施例提供的卡片显示方法的用户界面的示意图。
图23为本申请实施例提供的卡片显示方法的用户界面的示意图。
图24为本申请实施例提供的卡片显示方法的用户界面的示意图。
图25为本申请实施例提供的卡片显示方法的用户界面的示意图。
图26为本申请实施例提供的卡片显示方法的用户界面的示意图。
图27为本申请实施例提供的卡片显示方法的用户界面的示意图。
图28为本申请实施例提供的卡片显示方法的用户界面的示意图。
图29为本申请实施例提供的卡片显示方法的用户界面的示意图。
图30为本申请实施例提供的卡片显示方法的用户界面的示意图。
图31为本申请实施例提供的卡片显示方法的用户界面的示意图。
图32为本申请实施例提供的卡片显示方法的用户界面的示意图。
图33为本申请实施例提供的卡片显示方法的用户界面的示意图。
图34为本申请实施例提供的卡片显示方法的用户界面的示意图。
图35为本申请实施例提供的卡片显示方法的用户界面的示意图。
图36为本申请实施例提供的卡片显示方法的用户界面的示意图。
图37为本申请实施例提供的卡片显示方法的用户界面的示意图。
图38为本申请实施例提供的卡片显示方法的用户界面的示意图。
图39为本申请实施例提供的卡片显示方法的用户界面的示意图。
图40为本申请实施例提供的卡片显示方法的用户界面的示意图。
图41为本申请实施例提供的卡片显示方法的用户界面的示意图。
图42为本申请实施例提供的卡片显示方法的用户界面的示意图。
图43为本申请实施例提供的电子设备的结构示意图。
具体实施方式
下面将结合附图,对本申请实施例中的技术方案进行清楚、完整地描述。显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有付出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
需要说明的是,本申请实施例中的“第一”、“第二”等描述,是用于区分不同的图标、内容、模块、应用等,不代表先后顺序。在没有特殊说明的情况下,两者是不同的。比如,第一应用与第二应用不同。
通常来说,卡片是一种具有封闭轮廓的信息载体,以浓缩的形式直观快捷地提供重要或密切相关的信息,用于上述信息的显示和交互。在实践中,卡片主要显示在电子设备的桌面的负一屏上。以图1为例阐述桌面的概念。在图1中,用户界面102包括:导航栏区域1022,状态栏区域1026,以及位于导航栏区域1022和状态栏区域1026之间的桌面的第二屏。所述桌面的第二屏包括固定图标区域1023、页面指示符区域1024和可滑动的页面区域1025。同样地,桌面的负一屏、桌面的第一屏和桌面的第三屏包含的区域也都包括固定图标区域、页面指示符区域和可滑动的页面区域。从页面指示符区域1024可知,桌面共包括负一屏、第一屏、第二屏和第三屏。故在图1中,桌面的负一屏、桌面的第一屏、桌面的第二屏和桌面的第三屏共同组成了桌面。其中,桌面上桌面的第二屏以外的屏所包 括的可滑动的页面区域,可以显示一个或多个图标。在一些可选的实施例中,导航栏可以被隐藏;在一些可选的实施例中,状态栏可以被隐藏;在一些可选的实施例中,导航栏和状态栏集成为一体。桌面的负一屏位于电子设备显示桌面时,向左滑动到最左侧时显示的用户界面上。桌面的第一屏、桌面的第二屏、桌面的第三屏等位于自桌面的负一屏开始,向右滑动后依次显示的用户界面上。需要说明的是,图1仅为示例,并不用于限制本申请桌面的范围。
卡片的形状通常为圆角矩形,类似于信用卡的形状,当然也可以为其他形状。卡片使得电子设备的用户更为方便直观地获取信息及执行操作,因而应用广泛。不过,现有的卡片显示位置固定,不够灵活;卡片的显示和切换操作繁琐,管理成本高;卡片只显示单个应用的信息,导致对其他应用的操作不够便利。因此,需要提供一种操作简单、显示位置灵活变化以及方便对其他应用操控的卡片显示方法。
以快捷进入支付宝付款码这一功能为例对图1进行说明。在图1a中,用户长按用户界面102显示的支付宝图标1021;之后用户界面102切换为用户界面104;用户界面104显示位于支付宝图标1021上方的弹出窗口1041;用户再触摸弹出窗口1041内的支付宝付款码10410,实现对支付宝应用下的付款码功能的快捷进入。这样,虽然不需要切换至桌面的其他屏,仅需在桌面的第二屏这一当前屏上操作,但这种操作需要两步,仍不够便利。并且,在打开支付宝应用下的付款码后,该付款码会占据整个桌面的第二屏,形成付款码界面。若用户想切换至用户界面上显示的其他应用,则需先退出该付款码界面,再触摸用户界面上的其他图标,不够便利。另外,若用户要查看或触摸如图1c所示的用户界面104上被弹出窗口10410遮挡的内容或图标,则需先触摸用户界面104上的其他位置,比如用户界面104上的空白位置,使得弹出窗口10410消失,再查看或触摸上述被遮挡的内容或图标,操作较为繁琐。并且弹出窗口10410也不能固定显示在用户界面104上。比如一旦打开某个应用,再返回后,用户界面102不会显示上述弹出窗口1041;若要快捷进入支付宝付款码,则还需再次长按用户界面102上显示的支付宝图标1021,操作较为繁琐。
图2为提供的一种卡片显示方法中不同卡片显示切换的用户界面示意图。界面200显示有桌面的负一屏。以在界面200上取消显示卡片2002为例。用户在图2a所示的界面200上触摸按钮2001;图2a所示的界面200切换至图2b所示的界面201;用户在图2b所示的界面201上触摸按钮2011;图2b所示的界面201切换至图2c所示的界面202;用户在图2c所示的界面202上触摸按钮2021;在返回至桌面的负一屏后,此时桌面的负一屏为如图2d所示,已经不再显示卡片2002。这样,若想对不同卡片的显示切换进行管理,则需要先进入设置界面,在设置界面上再浏览设置。操作较为繁琐。
本申请实施例提供的卡片显示的方法可以应用于图3所示的电子设备100中。图3示出了电子设备100的结构示意图。
电子设备100可以包括处理器110,外部存储器接口120,内部存储器121, 通用串行总线(universal serial bus,USB)接口130,充电管理模块140,电源管理模块141,电池142,天线1,天线2,移动通信模块150,无线通信模块160,音频模块170,扬声器170A,受话器170B,麦克风170C,耳机接口170D,传感器模块180,按键190,马达191,指示器192,摄像头193,显示屏194,以及用户标识模块(subscriber identification module,SIM)卡接口195等。其中传感器模块180可以包括压力传感器180A,陀螺仪传感器180B,气压传感器180C,磁传感器180D,加速度传感器180E,距离传感器180F,接近光传感器180G,指纹传感器180H,温度传感器180J,触摸传感器180K,环境光传感器180L,骨传导传感器180M等。
可以理解的是,本申请实施例示意的结构并不构成对电子设备100的具体限定。在本申请另一些实施例中,电子设备100可以包括比图示更多或更少的部件,或者组合某些部件,或者拆分某些部件,或者不同的部件布置。图示的部件可以以硬件,软件或软件和硬件的组合实现。
处理器110可以包括一个或多个处理单元,例如:处理器110可以包括应用处理器(application processor,AP),调制解调处理器,图形处理器(graphics processing unit,GPU),图像信号处理器(image signal processor,ISP),控制器,视频编解码器,数字信号处理器(digital signal processor,DSP),基带处理器,和/或神经网络处理器(neural-network processing unit,NPU)等。其中,不同的处理单元可以是独立的器件,也可以集成在一个或多个处理器中。
控制器可以根据指令操作码和时序信号,产生操作控制信号,完成取指令和执行指令的控制。
处理器110中还可以设置存储器,用于存储指令和数据。在一些实施例中,处理器110中的存储器为高速缓冲存储器。该存储器可以保存处理器110刚用过或循环使用的指令或数据。如果处理器110需要再次使用该指令或数据,可从所述存储器中直接调用。避免了重复存取,减少了处理器110的等待时间,因而提高了系统的效率。
在一些实施例中,处理器110可以包括一个或多个接口。接口可以包括集成电路(inter-integrated circuit,I2C)接口,集成电路内置音频(inter-integrated circuit sound,I2S)接口,脉冲编码调制(pulse code modulation,PCM)接口,通用异步收发传输器(universal asynchronous receiver/transmitter,UART)接口,移动产业处理器接口(mobile industry processor interface,MIPI),通用输入输出(general-purpose input/output,GPIO)接口,用户标识模块(subscriber identity module,SIM)接口,和/或通用串行总线(universal serial bus,USB)接口等。
USB接口130是符合USB标准规范的接口,具体可以是Mini USB接口,Micro USB接口,USB Type C接口等。可以理解的是,本申请实施例示意的各模块间的接口连接关系,只是示意性说明,并不构成对电子设备100的结构限定。在本申请另一些实施例中,电子设备100也可以采用上述实施例中不同的接口连接方式,或多种接口连接方式的组合。
充电管理模块140用于从充电器接收充电输入。电源管理模块141用于连接电池142,充电管理模块140与处理器110。电子设备100的无线通信功能可以通过天线1,天线2,移动通信模块150,无线通信模块160,调制解调处理器以及基带处理器等实现。
天线1和天线2用于发射和接收电磁波信号。电子设备100中的每个天线可用于覆盖单个或多个通信频带。不同的天线还可以复用,以提高天线的利用率。例如:可以将天线1复用为无线局域网的分集天线。在另外一些实施例中,天线可以和调谐开关结合使用。
移动通信模块150可以提供应用在电子设备100上的包括2G/3G/4G/5G等无线通信的解决方案。移动通信模块150可以包括至少一个滤波器,开关,功率放大器,低噪声放大器(low noise amplifier,LNA)等。移动通信模块150可以由天线1接收电磁波,并对接收的电磁波进行滤波,放大等处理,传送至调制解调处理器进行解调。移动通信模块150还可以对经调制解调处理器调制后的信号放大,经天线1转为电磁波辐射出去。在一些实施例中,移动通信模块150的至少部分功能模块可以被设置于处理器110中。在一些实施例中,移动通信模块150的至少部分功能模块可以与处理器110的至少部分模块被设置在同一个器件中。
调制解调处理器可以包括调制器和解调器。其中,调制器用于将待发送的低频基带信号调制成中高频信号。解调器用于将接收的电磁波信号解调为低频基带信号。随后解调器将解调得到的低频基带信号传送至基带处理器处理。低频基带信号经基带处理器处理后,被传递给应用处理器。应用处理器通过音频设备(不限于扬声器170A,受话器170B等)输出声音信号,或通过显示屏194显示图像或视频。在一些实施例中,调制解调处理器可以是独立的器件。在另一些实施例中,调制解调处理器可以独立于处理器110,与移动通信模块150或其他功能模块设置在同一个器件中。
无线通信模块160可以提供应用在电子设备100上的包括无线局域网(wireless local area networks,WLAN)(如无线保真(wireless fidelity,Wi-Fi)网络),蓝牙(bluetooth,BT),全球导航卫星系统(global navigation satellite system,GNSS),调频(frequency modulation,FM),近距离无线通信技术(near field communication,NFC),红外技术(infrared,IR)等无线通信的解决方案。无线通信模块160可以是集成至少一个通信处理模块的一个或多个器件。无线通信模块160经由天线2接收电磁波,将电磁波信号调频以及滤波处理,将处理后的信号发送到处理器110。无线通信模块160还可以从处理器110接收待发送的信号,对其进行调频,放大,经天线2转为电磁波辐射出去。
在一些实施例中,电子设备100的天线1和移动通信模块150耦合,天线2和无线通信模块160耦合,使得电子设备100可以通过无线通信技术与网络以及其他设备通信。所述无线通信技术可以包括全球移动通讯系统(global system for mobile communications,GSM),通用分组无线服务(general packet radio service,GPRS),码分多址接入(code division multiple access,CDMA),宽带码分多址 (wideband code division multiple access,WCDMA),时分码分多址(time-division code division multiple access,TD-SCDMA),长期演进(long term evolution,LTE),BT,GNSS,WLAN,NFC,FM,和/或IR技术等。所述GNSS可以包括全球卫星定位系统(global positioning system,GPS),全球导航卫星系统(global navigation satellite system,GLONASS),北斗卫星导航系统(beidou navigation satellite system,BDS),准天顶卫星系统(quasi-zenith satellite system,QZSS)和/或星基增强系统(satellite based augmentation systems,SBAS)。
电子设备100通过GPU,显示屏194,以及应用处理器等实现显示功能。GPU为图像处理的微处理器,连接显示屏194和应用处理器。GPU用于执行数学和几何计算,用于图形渲染。处理器110可包括一个或多个GPU,其执行程序指令以生成或改变显示信息。
显示屏194用于显示图像,视频等。显示屏194包括显示面板。显示面板可以采用液晶显示屏(liquid crystal display,LCD),有机发光二极管(organic light-emitting diode,OLED),有源矩阵有机发光二极体或主动矩阵有机发光二极体(active-matrix organic light emitting diode的,AMOLED),柔性发光二极管(flex light-emitting diode,FLED),Miniled,MicroLed,Micro-oLed,量子点发光二极管(quantum dot light emitting diodes,QLED)等。在一些实施例中,电子设备100可以包括1个或N个显示屏194,N为大于1的正整数。
电子设备100可以通过ISP,摄像头193,视频编解码器,GPU,显示屏194以及应用处理器等实现拍摄功能。
ISP用于处理摄像头193反馈的数据。摄像头193用于捕获静态图像或视频。物体通过镜头生成光学图像投射到感光元件。
数字信号处理器用于处理数字信号,除了可以处理数字图像信号,还可以处理其他数字信号。例如,当电子设备100在频点选择时,数字信号处理器用于对频点能量进行傅里叶变换等。
视频编解码器用于对数字视频压缩或解压缩。电子设备100可以支持一种或多种视频编解码器。这样,电子设备100可以播放或录制多种编码格式的视频,例如:动态图像专家组(moving picture experts group,MPEG)1,MPEG2,MPEG3,MPEG4等。
NPU为神经网络(neural-network,NN)计算处理器,通过借鉴生物神经网络结构,例如借鉴人脑神经元之间传递模式,对输入信息快速处理,还可以不断的自学习。
外部存储器接口120可以用于连接外部存储卡,例如Micro SD卡,实现扩展电子设备100的存储能力。外部存储卡通过外部存储器接口120与处理器110通信,实现数据存储功能。例如将音乐,视频等文件保存在外部存储卡中。
内部存储器121可以用于存储计算机可执行程序代码,所述可执行程序代码包括指令。内部存储器121可以包括存储程序区和存储数据区。其中,存储程序区可存储操作系统,至少一个功能所需的应用程序(比如声音播放功能,图像播 放功能等)等。存储数据区可存储电子设备100使用过程中所创建的数据(比如音频数据,电话本等)等。此外,内部存储器121可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件,闪存器件,通用闪存存储器(universal flash storage,UFS)等。处理器110通过运行存储在内部存储器121的指令,和/或存储在设置于处理器中的存储器的指令,执行电子设备100的各种功能应用以及数据处理。
电子设备100可以通过音频模块170,扬声器170A,受话器170B,麦克风170C,耳机接口170D,以及应用处理器等实现音频功能。例如音乐播放,录音等。
压力传感器180A用于感受压力信号,可以将压力信号转换成电信号。在一些实施例中,压力传感器180A可以设置于显示屏194。压力传感器180A的种类很多,如电阻式压力传感器,电感式压力传感器,电容式压力传感器等。电容式压力传感器可以是包括至少两个具有导电材料的平行板。当有力作用于压力传感器180A,电极之间的电容改变。电子设备100根据电容的变化确定压力的强度。当有触摸操作作用于显示屏194,电子设备100根据压力传感器180A检测所述触摸操作强度。电子设备100也可以根据压力传感器180A的检测信号计算触摸的位置。在一些实施例中,作用于相同触摸位置,但不同触摸操作强度的触摸操作,可以对应不同的操作指令。例如:当有触摸操作强度小于第一压力阈值的触摸操作作用于短消息应用图标时,执行查看短消息的指令。当有触摸操作强度大于或等于第一压力阈值的触摸操作作用于短消息应用图标时,执行新建短消息的指令。
陀螺仪传感器180B可以用于确定电子设备100的运动姿态。气压传感器180C用于测量气压。在一些实施例中,电子设备100通过气压传感器180C测得的气压值计算海拔高度,辅助定位和导航。磁传感器180D包括霍尔传感器。加速度传感器180E可检测电子设备100在各个方向上(一般为三轴)加速度的大小。距离传感器180F,用于测量距离。电子设备100可以通过红外或激光测量距离。在一些实施例中,拍摄场景,电子设备100可以利用距离传感器180F测距以实现快速对焦。接近光传感器180G可以包括例如发光二极管(LED)和光检测器,例如光电二极管。环境光传感器180L用于感知环境光亮度。指纹传感器180H用于采集指纹。电子设备100可以利用采集的指纹特性实现指纹解锁,访问应用锁,指纹拍照,指纹接听来电等。温度传感器180J用于检测温度。
触摸传感器180K,也称“触控器件”。触摸传感器180K可以设置于显示屏194,由触摸传感器180K与显示屏194组成触摸屏,也称“触控屏”。触摸传感器180K用于检测作用于其上或附近的触摸操作。触摸传感器可以将检测到的触摸操作传递给应用处理器,以确定触摸事件类型。可以通过显示屏194提供与触摸操作相关的视觉输出。在另一些实施例中,触摸传感器180K也可以设置于电子设备100的表面,与显示屏194所处的位置不同。
SIM卡接口195用于连接SIM卡。SIM卡可以通过插入SIM卡接口195, 或从SIM卡接口195拔出,实现和电子设备100的接触和分离。电子设备100可以支持1个或N个SIM卡接口,N为大于1的正整数。SIM卡接口195可以支持Nano SIM卡,Micro SIM卡,SIM卡等。同一个SIM卡接口195可以同时插入多张卡。所述多张卡的类型可以相同,也可以不同。SIM卡接口195也可以兼容不同类型的SIM卡。SIM卡接口195也可以兼容外部存储卡。电子设备100通过SIM卡和网络交互,实现通话以及数据通信等功能。在一些实施例中,电子设备100采用eSIM,即:嵌入式SIM卡。eSIM卡可以嵌在电子设备100中,不能和电子设备100分离。电子设备100的软件系统可以采用分层架构,事件驱动架构,微核架构,微服务架构,或云架构。
本申请实施例提供了卡片显示方法、电子设备及计算机可读存储介质,使得用户通过简便操作,甚至仅需一步操作,即可在桌面的当前屏上实现卡片的快捷显示及切换,同时对当前的图标格局影响较小,操作便利,提升用户体验。其中,桌面的当前屏为桌面的任意屏,可以为桌面的负一屏、桌面的第一屏、桌面的第二屏、桌面的第三屏等中的任意一屏。
图4是本申请实施例的电子设备100的软件结构框图。分层架构将软件分成若干层,每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中,将Android系统分为五层,从上至下分别为应用程序层,系统框架层,系统库与运行时层、硬件抽象层和内核层。应用程序层可以包括一系列应用程序包。如图4所示,应用程序包可以包括桌面管理器,联系人,日历,短信,音乐等程序。其中,桌面管理器用于管理并显示所有的普通应用程序的图标以及其对应的卡片信息,其在桌面上没有图标;当用户触发卡片显示操作时,加载并显示出卡片信息。普通应用程序,类似联系人、日历等可在桌面上点击图标的程序,用于提供卡片显示相关的数据。
系统框架层为应用程序层的应用程序提供应用编程接口(Application Programming Interface,API)和编程框架,包括各种组件和服务来支持开发者的安卓开发。系统框架层包括一些预先定义的函数。如图4所示,系统框架层可以包括视图系统、输入管理器、卡片服务管理器、资源管理器、窗口管理器、内容提供器等。视图系统包括可视控件,例如显示文字的控件,显示图片的控件等。视图系统可用于构建应用程序。显示界面可以由一个或多个视图组成的。窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小,判断是否有状态栏,锁定屏幕,截取屏幕等。输入管理器用于管理触摸事件,实现对触摸事件的派发。卡片服务管理器用于接收桌面的应用程序App(Application)发布的卡片信息并保存起来,同时提供接口供桌面程序查询App的卡片信息。以Android系统为例,卡片服务管理器可作为一个常驻在Andorid系统的Service进程,提供一个远程调用接口接收App发布的卡片信息,同时提供另一个远程调用接口供桌面程序查询卡片信息。卡片服务管理器保存App的唯一ID和该App对应的卡片信息。其中,该App对应的卡片信息以数据结构的形式发布和保存。该App的唯一ID可以为该App的应用包名称(PackageName)或者应用包名称的哈希码。资源管 理器为应用程序提供各种资源,比如本地化字符串,图标,图片,布局文件,视频文件等等。窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小,判断是否有状态栏,锁定屏幕,截取屏幕等。内容提供器用来存放和获取数据,并使这些数据可以被应用程序访问。所述数据可以包括视频,图像,音频,拨打和接听的电话,浏览历史和书签,电话簿等。
系统库与运行时层包括系统库和安卓运行时(Android Runtime)。系统库可以包括多个功能模块。例如:浏览器内核,3D图形库(例如:OpenGL ES),字体库等。浏览器内核负责对网页语法的解释(如标准通用标记语言下的一个应用HTML、JavaScript)并渲染(显示)网页。3D图形库用于实现三维图形绘图,图像渲染,合成和图层处理等。字体库用于实现不同字体的输入。安卓运行时包括核心库和虚拟机。安卓运行时负责安卓系统的调度和管理。核心库包含两部分:一部分是java语言需要调用的功能函数,另一部分是安卓的核心库。应用程序层和应用程序框架层运行在虚拟机中。虚拟机将应用程序层和应用程序框架层的java文件执行为二进制文件。虚拟机用于执行对象生命周期的管理,堆栈管理,线程管理,安全和异常的管理,以及垃圾回收等功能。
硬件抽象层是设备内核驱动的抽象接口,实现向更高级别的Java API框架提供访问底层设备的应用编程接口。HAL包含多个库模块,其中每个库模块都为特定类型的硬件组件实现一个接口。
内核层是硬件和软件之间的层。内核层至少包含摄像头驱动,显示驱动,蓝牙驱动,音频驱动,传感器驱动,触控驱动和WLAN。内核层是
Figure PCTCN2021072592-appb-000001
系统的基础。
Figure PCTCN2021072592-appb-000002
系统最终的功能实现都是通过内核层完成。
图5为本申请实施例提供的卡片显示方法的软件流程示意图。如图5所示,电子设备的应用程序层运行的有关桌面的应用程序包括两类,桌面管理器502和诸如天气504、日历505等普通应用程序。可选地,天气504、日历505等普通应用程序预先设置有卡片信息,并在一定条件下向系统框架层的卡片服务管理器503传送该普通应用程序对应的卡片信息。在有些实施例中,所述普通应用程序预先设置有卡片信息包括在所述普通应用程序中通过RemoteViews数据结构来预先设置卡片信息,如定义有RemoteViews及其坐标布局,设置有RemoteViews的字体颜色、字符串内容、图标和响应用户输入的操作等数据信息。在有些实施例中,所述普通应用程序预先设置有卡片信息包括在所述普通应用程序中通过xml文件这一数据结构描述的关于卡片布局的卡片信息。
在所述普通应用程序中通过RemoteViews数据结构来预先设置卡片信息的部分伪代码如下:
……
RemoteViews remoteView=new RemoteViews(getPackageName(),R.layout.layout_notification)
remoteView.setTextColor(R.id.re_text,Color.RED)
remoteView.setTextViewText(R.id.re_text,"remote view demo")
remoteView.setImageViewResource(R.id.re_image,R.drawable.btn_me_share)
remoteView.setOnClickPendingIntent(R.id.re_image,pendingIntent)
……
在所述普通应用程序中通过xml文件这一数据结构描述的关于卡片布局的卡片信息的部分伪代码如下:
……
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:contentDescription="@string/app_name"
android:id="@+id/re_image"
android:layout_width="wrap_content"
android:layout_height="wrap_contebnt"
android:src="@drawable/btn_me_share"/>
<TextView
android:id="@+id/re_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/red"
android:text="remote view demo"/>
</LinearLayout>
……
可以根据需要扩展定义上述xml文件。
在完成上述一系列的预先设置后,所述普通应用程序会在一定的条件下,比如在所述普通应用程序的数据发生变化时,或者在开机启动后,向系统框架层的卡片服务管理器503传送该普通应用程序对应的卡片信息。卡片服务管理器503接收并保存所述卡片信息。卡片服务管理器503可以以列表的形式保存每个图标对应的ID与该ID对应的卡片信息。桌面管理器基于用户输入来确定是否查询卡片,并根据查询结果,在电子设备的桌面的当前屏上生成并显示卡片。用户输入可以为用户的手势输入,也可以为用户的语音指令输入。其中,用户的手势,可以为用户在触摸屏上的手势,也可以为与桌面的当前屏隔空滑动的手势。以用户在电子设备的触摸屏上输入第一手势为例,触摸屏检测到第一手势并经系统框架层的输入管理器501将第一手势上报至应用程序层的桌面管理器502。桌面管理器502接收第一手势,并判断第一手势是否符合预先设定的手势;若符合,桌面管理器502基于第一手势,获取欲作为基准用于显示卡片的第一图标,进而获取该第一图标对应的ID,桌面管理器502基于该ID向卡片服务管理器503查询 该ID对应的卡片信息,卡片服务管理器503向桌面管理器502传送该ID对应的卡片信息;基于接收到的该ID对应的卡片信息,桌面管理器502生成显示卡片。
可选地,系统框架层无需设置卡片服务管理器503;天气504、日历505等普通应用程序设置有各自的卡片服务管理器;桌面管理器502基于上述ID向天气504、日历505等普通应用程序各自的卡片服务管理器查询该ID对应的卡片信息,与该ID相同的普通应用程序通过其卡片服务管理器向桌面管理器502传送该ID对应的卡片信息,与该ID不同的普通应用程序则不通过其卡片服务管理器向桌面管理器502传送卡片信息;桌面管理器502基于接收到的该ID对应的卡片信息生成卡片。
上述的预先设置可以为电子设备厂商在电子设备出厂前对其自行开发应用进行预先设置。比如刚出厂的电子设备,该电子设备上还未安装非该电子设备厂商自行开发应用以外的应用。再比如,电子设备厂商与第三方应用提供商提前协商一致,在通过电子设备自带的应用市场下载的第三方应用是经过上述预先设置的。当然,电子设备上的应用也可以为部分应用经过预先设置,部分应用没有经过预先设置。
图6为本申请实施例提供的卡片显示方法的实现流程示意图。其中,图6a示出了卡片显示方法的实现流程示意图。如图6a所示,在S601,开机启动后,卡片服务管理器扫描普通应用程序App,获取提供卡片信息的App列表,并通知App更新卡片信息;或者,桌面的普通应用程序App的数据发生变化;在S602,App组装卡片信息,并将普通应用程序App的ID及该ID对应的卡片信息向卡片服务管理器传送,卡片服务管理器获取并保存该ID及与该ID对应的卡片信息;该ID不仅与卡片信息对应,还与App相对应;在S603,桌面管理器检测用户输入;在S604,判断用户输入是否符合预设输入;若用户输入不符合预设输入,则返回S604;若用户输入符合预设输入,则执行S605;在S605,桌面管理器根据用户输入确定要作为基准用于显示卡片的第一图标对应的ID,从卡片服务管理器查询读取对应的卡片信息;在S606,在电子设备的桌面的当前屏上,基于所述卡片信息生成显示卡片。
用户输入可以为用户的手势输入,也可以为用户的语音指令输入。其中,用户的手势,可以为用户在触摸屏上的手势,也可以为与桌面的当前屏隔空滑动的手势。以用户在电子设备的触摸屏上输入第一手势为例。
相应地,S604就具体为判断第一手势是否符合预设手势;若第一手势不符合预设手势,则返回S604;S605就具体为桌面管理器根据第一手势确定要作为基准用于显示卡片的第一图标对应的ID,从卡片服务管理器查询读取对应的卡片信息。
可选地,判断第一手势是否符合预设手势,具体为,判断第一手势的滑动方向是否符合预设的滑动方向。
可选地,桌面管理器根据第一手势确定要作为基准用于显示卡片的第一图标 对应的ID,从卡片服务管理器查询读取对应的卡片信息;具体为,桌面管理器根据第一手势的起点确定要作为基准用于显示卡片的第一图标对应的ID,从卡片服务管理器查询读取对应的卡片信息。
图6b示出了图6a中步骤S606进一步细化的流程示意图。在S6061,将所述卡片信息解析为卡片视图,并获取卡片视图的默认形状和默认大小;在S6062,根据卡片视图的默认形状和默认大小以及用于作为基准来显示卡片的第一图标,获取基于第一图标显示的卡片所覆盖的区域,也即第一区域;并获取在所述电子设备的桌面的当前屏上的所有卡片恢复至图标状态后,所述第一区域显示的图标,此时所述桌面的当前屏不显示任何卡片;在S6063,执行卡片视图显示动画;在S6064,执行所述第一区域对应的图标的缩小显示动画,即上述图标缩小后以控件的形式显示在卡片上,此时就没有图标位于第一区域上。
在有些实施例中,可以不包含S6064;在显示卡片后,所述第一区域对应的图标被卡片遮挡,同时在卡片上也显示上述图标对应的控件。
其中,卡片信息包含了卡片视图在显示后的默认形状、默认大小和卡片内容。卡片内容包括各元素的内容。所述各元素的内容为该卡片信息对应的普通应用程序在打开后显示的内容界面或功能界面包含的内容。所述内容界面包括内容简化界面。所述功能界面包括功能简化界面。所述内容简化界面的内容少于所述内容界面的内容。所述功能减少界面的内容少于所述功能界面的内容。
可选地,要作为基准用于显示卡片的第一图标根据第一手势的起点确定。
可选地,每个普通应用程序的卡片信息所包括的卡片视图的默认形状和/或默认大小可以相同,也可以不同。优选地,每个普通应用程序的卡片信息所包括的卡片视图的默认形状和默认大小相同。在每个普通应用程序在预先设置时,会建议设置相同的卡片视图的默认形状和默认大小。
可选地,在卡片显示桌面的当前屏之后,还可以根据用户的输入来改变卡片的形状和大小。
可选地,S4063和S4064可以合并为一个步骤,执行卡片视图显示及所述第一区域显示的图标的缩小显示动画。即卡片视图显示动画和所述第一区域显示的图标的缩小显示动画同时进行,不再区分先后顺序。或者,将卡片视图显示动画和所述第一区域显示的图标的缩小显示动画合并为一个动画——卡片视图显示及所述第一区域显示的图标的缩小显示动画,在S4063和S4064合并的步骤中执行。
可选地,S4063和S4064可以互换顺序。即先执行第一区域显示的图标的缩小显示动画,再执行卡片视图显示动画。
需要说明的是,图6b所示的流程仅仅是图6a中S606进一步细化的一种实施例,图6a中S606还可以有其他细化的实施例。
图7为本申请实施例提供的卡片显示方法涉及的图层的结构示意图。如图7a所示,本申请实施例提供的卡片显示方法涉及三个图层:图标层701、卡片层702和壁纸层703。图标层701包含电子设备的桌面的当前屏上显示的图标。卡 片层702包含电子设备的桌面的当前屏上显示的卡片。壁纸层703包含电子设备的桌面的当前屏上显示的壁纸。在电子设备的桌面的当前屏上没有图标时,电子设备的桌面的当前屏上没有图标层。同样地,在电子设备的桌面的当前屏上没有卡片和/或壁纸时,电子设备的桌面的当前屏上没有卡片层和/或壁纸层。下面以卡片层包含的卡片7021为例,进一步阐述卡片7021上的区域划分。
如图7b所示,按照显示区域划分,卡片7021包含卡片标题栏70213和卡片内容区70214。其中,卡片标题栏70213包含第一控件区70211和第二控件区70212。卡片7021在所述电子设备的桌面的当前屏上的区域为第一区域;在所述电子设备的桌面的当前屏上所有卡片都恢复至图标状态后,所述第一区域显示的图标包括第一图标和其他图标。在有些实施例中,第一控件区70211仅显示与第一图标对应的第一控件;第二控件区70212显示与其他图标对应的N个控件。在有些实施例中,第一控件区70211不显示与任何图标对应的控件;第二控件区70212显示与其他图标对应的控件,或者,第二控件区70212显示与除第一图标和其他图标以外的任意图标对应的控件。
其中,第一控件区70211显示的第一控件可以为一个应用的图标或一个文件夹的图标缩小一定比例后显示的控件;第二控件区70212显示的N个控件为N个图标缩小另外比例后显示的控件;所述N个图标包含应用的图标和/或文件夹的图标。卡片内容区70214上显示的内容与第一图标相关联,也与第一控件相关联。
可选地,卡片标题栏70213位于卡片7021的上部;卡片内容区70214位于卡片7021的下部;此时卡片标题栏70213横向排列。可选地,卡片标题栏70213位于卡片7021的下部;卡片内容区70214位于卡片7021的上部;此时卡片标题栏70213横向排列。可选地,卡片标题栏70213位于卡片7021的左侧;卡片内容区70214位于卡片7021的右侧;此时卡片标题栏70213竖向排列。可选地,卡片标题栏70213位于卡片7021的上部;卡片内容区70214位于卡片7021的下部;此时卡片标题栏70213竖向排列。
可选地,第一控件区70211位于卡片标题栏70213的左侧;第二控件区70212位于卡片标题栏70213的右侧。可选地,第一控件区70211位于卡片标题栏70213的右侧;第二控件区70212位于卡片标题栏70213的左侧。可选地,第一控件区70211位于卡片标题栏70213的上部;第二控件区70212位于卡片标题栏70213的下部。可选地,第一控件区70211位于卡片标题栏70213的下部;第二控件区70212位于卡片标题栏70213的上部。
以上有关卡片标题栏70213、卡片内容区70214位于卡片7021的上部、下部、左侧、右侧分别为卡片标题栏70213、卡片内容区70214位于卡片7021区域之内的上部、下部、左侧、右侧。
以上有关第一控件区70211、第二控件区70212位于卡片标题栏70213的上部、下部、左侧和右侧分别为第一控件区70211、第二控件区70212位于卡片标题栏70213区域之内的上部、下部、左侧和右侧。
可选地,第二控件区70212还可以位于卡片标题栏70213之外,比如位于卡片标题栏70213区域之外的上部。可选地,卡片7021区域之外的上部设置有悬浮球,悬浮球在被触摸后,才显示第二控件区70212。
除了上述方式以外,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内;此处不再一一赘述。
如图7c所示,按照内容显示的一致性划分,卡片7021包括卡片层基板70215和第二控件区70212。其中,卡片7021上除了第二控件区70212以外的区域都属于卡片层基板70215。可选地,第二控件区70212可以位于卡片7021区域之内的左上角、右上角、左下角、右下角、上部、下部、左侧、右侧。在第二控件区70212位于卡片7021区域之内的上部、下部时,第二控件区横向排列。在第二控件区70212位于卡片7021区域之内的左侧、右侧时,第二控件区竖向排列。可选地,第二控件区70212可以位于卡片7021区域之内的其他任意位置。
可选地,第二控件区70212可以位于卡片7021区域之外,比如位于卡片7021区域之外的上部。可选地,卡片7021的外围上部设置有悬浮球,悬浮球在被触摸后,显示第二控件区70212。除了上述方式以外,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内;此处不再一一赘述。
在电子设备的桌面的当前屏上,图标层701和壁纸层703可以一直存在;而卡片层702则有时可以不存在。在之前没有卡片层的情形下,在第一输入触发下,卡片7021会被触发生成显示。卡片7021被触发生成显示,也表明卡片层702被生成显示。同时,图标层701上被卡片7021覆盖的图标会被卡片7021吸收,并缩小比例后以控件的形式显示在卡片7021上,此时图标层701包含的图标数会减少。类似地,卡片7021在第二手势触发下,会被触发转换为图标;之前被吸收且缩小比例后以控件形式显示在卡片7021上的控件会恢复至被吸收前的图标大小和位置。可选地,在有些情形下,卡片层702位于图标层701和壁纸层703之间;在有些情形下,卡片层702位于图标层701之上。
需要说明的是,第一控件区的圆形、第二控件区的跑道矩形仅用于标识第一控件区、第二控件区在卡片层的位置,并非用于限制第一控件区、第二控件区的形状。第一控件区、第二控件区的形状可以为任意形状,包括但不限于圆形、矩形、圆角矩形、跑道矩形等。卡片的圆角矩形仅为卡片形状的示意性举例;并非用于限制卡片的形状。卡片的形状可以为其他形状。所述其他形状为本领域技术人员所能想到的任意形状;包括但不限于圆角矩形、跑道矩形等。
图8为本申请实施例提供的卡片显示方法涉及的卡片层基板生成的示意图。图8a和图8b分别示出了卡片层基板生成的两种不同方式。以日历应用的图标为例。在图8a中,图标801表示日历应用的图标。在基于日历应用的图标801生成显示卡片层基板800的过程中,显示内容区802逐渐增大;图标801的大小保持不变、缩小一定比例或放大一定比例。但图标801在显示内容区802的位置逐渐靠近显示内容区802的左上角。最终,显示内容区802增大至802’时,不再增大;此时,图标801位于显示内容区802’的左上角。从而,生成了卡片层基板 800。在图8b中,图标包括两部分:数字16和显示内容区。其中811表示数字16,812表示显示内容区。数字16为日历应用的标识符,用于表示今天为16日。数字16的选取仅为举例性说明,随着时间变化,会同步变化。比如今天为16日,在明天时,日历应用的标识符会相应地由数字16变为数字17。在基于日历应用的图标生成卡片层基板的过程中,显示内容区812逐渐增大;数字16 811也逐渐增大,并逐渐靠近显示内容区812的左上角。最终,显示内容区812增大至812’时,不再增大;数字16 811增大至811’时,也不再增大;此时,数字16 811’位于显示内容区812’的左上角。从而,生成了卡片层基板810。上述卡片层基板的两种生成方式仅用于示意性举例,并非用于限制卡片层基板的生成方式。本领域技术人员所能想到的卡片层基板的任意生成方式均在本申请实施例的保护范围之内。
可选地,图8a中日历应用的图标也可以位于卡片层基板的右上角。
可选地,图8a中日历应用的图标也可以位于卡片层基板的其他位置;显示内容区也可以位于卡片层基板的另外位置。只要上述的其他位置与上述的另外位置不冲突即可。
图9为本申请实施例提供的卡片显示方法的用户界面的示意图。以备忘录应用图标为例说明。如图9a所示,在图9a所示的界面902上,用户以备忘录应用图标9021上的触摸点为起点,分别沿着图9a示出的方向移动手指,图9a所示的界面902切换至图9b所示的界面903。并在图9所示的界面903上,生成卡片9031。卡片9031在图9b上的区域为第一区域;所述第一区域在图9a的界面903上显示的图标包括备忘录、播放器、文件管理、设置、图库、脸书、云共享、推特和QQ九个应用的图标。其中,与备忘录应用图标对应的第一控件也可以不显示在卡片9031上;与第一区域在界面903上显示的其他八个应用图标对应的控件显示在卡片9031的右上角。可选地,与备忘录应用图标对应的第一控件可以显示在卡片9031的左上角。可选地,显示在卡片9031的右上角上的控件可以不对应上述八个应用图标,可以对应其他的图标,该其他的图标位于桌面上。该其他的图标可以位于桌面上的当前屏,也可以位于桌面上的其他屏。可选地,除了图9a示出的手势输入外,还可以为语音输入,如“基于备忘录图标显示卡片”。可选地,图9a示出的手势输入与显示该图标用于分享或删除的手势输入可以为相同或不同的手势输入;也就是说,本申请实施例支持两种不同的手势输入,分别用于基于图标生成显示卡片,以及显示该图标用于分享或删除的窗口;或者,本申请实施例支持一种手势输入,基于图标生成显示卡片并显示该图标用于分享或删除的窗口。可选地,上述窗口显示的“分享”和“删除”和/或对应的控件可以位于卡片上,如此就不需要再额外显示一个窗口。
卡片9031中右上角的控件的下部显示有备忘录应用的内容。如:上午9点在302室开部门工作例会;中午和老周约时间讨论T项目进度;下午3点向客户展示Demo;晚上8点给老妈打电话;晚上9点去补习班接孩子回家;晚上11点学习英语每日练。在图9b所示的界面903上,用户以手指在卡片9031上的触 摸点920为起点,沿着图9b中示出的方向移动手指,卡片9031消失,停止显示,图9b所示的界面903切换至或返回至图9a所示的界面902。
可选地,在图9a所示的界面902上,用户以备忘录应用图标9021上的触摸点为起点,还可沿着图9a示出方向以外的方向移动手指,图9a所示的界面902切换至图9b所示的界面903。同样地,在图9b所示的界面903上,用户以手指在卡片9031上的触摸点为起点,沿着图9b中示出方向以外的方向移动手指,卡片9031消失,停止显示,图9b所示的界面903返回至图9a所示的界面902。
优选地,从图9a所示界面902切换至图9b所示界面903对应的第一手势输入的滑动方向,与从图9b所示界面903返回至图9a所示界面902对应的第二手势输入的滑动方向,相反。
结合图5-图6可知,第一区域在图9a的界面902上显示的其他八个应用图标经缩小另外比例后以控件的形式显示在卡片9031的第二控件区;备忘录的内容显示在卡片9031的显示内容区。这样,在图9a的界面902上没有被第一区域显示的应用图标仍然可以通过触摸的方式或其他方式打开,且其位置没有变化,其格局没有影响。第一区域在图9a的界面902上显示的其他八个应用图标仅仅是缩小比例后显示在卡片的右上角,对当前的图标格局影响较小;并且其仍能通过触摸的方式或者其他方式打开,也没有增加用户操作的步骤。此外,卡片显示的内容为备忘录的内容,便于用户直观便利地获取,且仅需一步操作。若要查看卡片显示的更多备忘录内容,可以通过在卡片上另外方向的滑动等来查看更多的备忘录内容。因此,备忘录应用图标缩小一定比例后以控件的形式显示在卡片9031的第一控件区,即左上角,并非是必需的。因为,无需在卡片9031的第一控件区显示与备忘录应用图标对应的第一控件,用户也能获悉卡片内容显示的是备忘录应用打开后显示的内容界面或内容简化界面。
并且,本申请实施例提供的卡片显示方法,尤其适合在较长时长内一直需要查看该卡片的情形。比如,一家三口在某一天逛商场,为孩子、丈夫和妻子购买衣服、化妆品、学习用品等物品,并且在商场内吃饭、看电影,由于要频繁使用付款码,丈夫就可以在手机的桌面的当前屏上,通过一步操作生成显示支付宝卡片,该支付宝卡片显示有付款码。在使用时,直接拿出手机展示该卡片即可;在不使用时,将手机锁屏即可。如此就使得在消费者商场消费期间,无需频繁地进行付款码的打开和关闭之间的切换,方便使用。再进一步举例,若用户在一段时长内均需查看该备忘录,可以仅按照预设手势操作一次即可;待下次查看备忘录时仅需滑动至该屏,无需再次按照预设手势操作。在一段时长后,若用户想查看另外的应用的内容,或者显示另外的应用下的快捷功能,可以先关闭该卡片,之后以另外的应用图标上的触摸点为起点,按照预设手势操作,基于另外的图标生成显示卡片即可。
如此,卡片和图标可以在桌面的当前屏上共存,并且在桌面的当前屏上根据用户的手势即可生成卡片显示或者关闭卡片恢复至图标;用户可以在桌面的当前屏上直接查看卡片内容,同时用户还可以在该当前屏上卡片以外区域直接打开任 意一个图标对应的应用,用户还可以直接在卡片上打开N个控件中的每一个控件对应的应用,操作便利,用户体验较好;比如,用户可以直接触摸微信图标打开微信应用;用户还可以直接触摸卡片右上角的对应QQ应用的控件,打开QQ应用。因此,用户既能直观地获取第一卡片内容,又能直接打开N个控件中的每一个控件对应的应用,还能直接对该当前屏进行操作,兼顾了用户对三方的使用便利,实现了在三方的使用便利上的平衡。此外,在本申请实施例提供的方法中,第一区域在图9a的界面902上显示的图标与卡片9031的转化具有磁吸的视觉效果,提升用户体验。
在有些实施例中,备忘录应用图标9021可以直接以控件的形式显示在卡片9031的左上角,并不需要缩小一定比例;还可以在放大一定比例后,以控件的形式显示在卡片9031的左上角。在有些实施例中,卡片9031可以不为圆角正方形,而为其他形状。所述其他形状为本领域技术人员所能想到的任意形状;包括但不限于圆角矩形、跑道矩形等。
在图9a示出的界面902上,用户并非只能沿着图9a示出的方向移动手指,用户可以沿着其他的方向移动手指。比如,斜向上45度、水平方向等任意方向,此处不做限制。在图9a上,第一手势输入用于基于图标生成卡片。基于第一手势输入,生成显示卡片9031。第一手势输入的起点可以位于备忘录应用图标9021上或者备忘录应用图标9021周围的一定区域内。第一手势输入的滑动方向为第一方向。第一方向可以只包含一个固定的方向,也可以包含不同的方向;比如先向左,再向上。另外,第一手势输入可以为在桌面的当前屏上触摸得到的手势输入。第一手势输入还可以为与桌面的当前屏隔空滑动的手势输入。比如,第一手势输入为与桌面的当前屏隔空绘制圆形的手势输入。此时,移动终端根据第一手势输入在桌面的当前屏上的垂直投影手势输入来基于图标生成卡片。同样地,在图9b示出的界面903上,用户并非只能沿着图9b示出的方向移动手指,用户可以沿着其他的方向移动手指。在图9b上,第二手势输入用于基于卡片恢复图标。第二手势输入的起点可以位于卡片9031上或者卡片9031周围的一定区域内。第二手势输入的滑动方向为第二方向。第二方向可以只包含一个固定的方向,也可以包含不同的方向。第二手势输入的滑动方向与第一手势输入的滑动方向可以相反,也可以不相反。比如,第二手势输入的方向为图9b示出的方向,第一手势输入的方向可以为图9a上斜向上45度的方向。第一手势输入的滑动方向与第二手势输入的滑动方向的对应关系需要预先设置。优选地,第二手势输入的滑动方向与第一手势输入的滑动方向相反。
此外,第二手势输入的起点可以与第一手势输入的终点相同,也可以与第一手势输入的终点不同。第二手势输入的终点可以与第一手势输入的起点相同,也可以与第一手势输入的起点不同。
第一手势输入的起点可以位于欲转换为卡片的图标上,也可以位于欲转换为卡片的图标周围的一定区域内。其中,第一手势输入的起点位于欲转换为卡片的图标周围的一定区域内,可以为相较于所述起点与其他图标的中心之间的距离, 所述起点与欲转换为卡片的图标的中心之间的距离最短。比如,欲转换为卡片的图标为备忘录应用图标,与其他图标相比,第一手势输入的起点与备忘录应用图标的中心之间的距离最短;那么第一手势输入的起点位于备忘录应用图标周围的一定区域内。如果第一手势输入的起点位于两个图标的正中间,距离两个图标的距离相等,且相较于距离其他图标的距离都最短,则按照预先设定的规则确定要基于哪一个图标来生成卡片。比如,第一手势输入的起点位于图9a上沿着水平方向的播放器应用图标和备忘录应用图标的正中间,由于自该起点后,第一手势输入与播放器应用图标的距离变短,而与备忘录应用图标的距离变长,则确定基于播放器应用图标生成卡片。当然,预设的规则可以为其他的规则。
可选地,还可以有其他方式来确定一个第一图标。比如,预设手势为只包括一个第一图标的封闭曲线,将该封闭曲线包括的一个第一图标确定为所述一个第一图标。
可选地,第一手势输入的起点位于欲转换为卡片的图标周围的一定区域内,还可以为第一手势输入的起点位于以欲转换为卡片的图标的中心为圆心,以预设长度为半径的圆形范围内。当然,第一手势输入的起点位于欲转换为卡片的图标周围的一定区域内不限于上述实施方式,本领域技术人员所能想到的其他实施方式也在本申请实施例的保护范围之内。
第二手势输入的起点可以位于欲转换为图标的卡片上,也可以位于欲转换为图标的卡片周围的一定区域内。其中,第二手势输入的起点位于欲转换为图标的卡片周围的一定区域内,可以为第二手势输入的起点位于以卡片的中心为圆心,以预设长度为半径的圆形范围内。以电子设备的桌面的当前屏上存在两个卡片为例。如果第二手势输入的起点都位于两个卡片周围的一定区域内,则确定与哪一个卡片的中心的距离最短,以其中心距离起点最短的卡片为欲转换为图标的卡片;如果与两个卡片的中心的距离相同,则按照预设的规则确定基于哪一个卡片转换为图标。以图27c为例,第二手势输入的起点与卡片27042中心的距离和卡片27041中心的距离相等,由于卡片27042位于卡片27041的上方,则确定基于卡片27042恢复图标。当然,预设的规则可以为其他的规则。
可选地,第二手势输入的起点位于欲转换为图标的卡片周围的一定区域内,还可以为距离卡片的中心一定距离内的区域。当然,第二手势输入的起点位于欲转换为图标的卡片周围的一定区域内不限于上述实施方式,本领域技术人员所能想到的其他实施方式也在本申请实施例的保护范围之内。
第一手势输入的终点和第二手势输入的终点不做限定。第一手势输入的终点可以位于欲被卡片覆盖吸收的图标上;也可以位于欲被卡片覆盖吸收的图标周围的一定区域内。比如,第一手势输入的终点可以位于图9a上脸书应用图标的右侧。第二手势输入的终点可以位于欲转换为图标的卡片上;也可以位于欲转换为图标的卡片周围的一定区域内。比如,第二手势输入的终点可以位于图9b上卡片9031的下方。
响应于第一手势输入,基于图标生成卡片。优选地,响应于第一手势输入的 起点和滑动方向,基于图标生成卡片。优选地,响应于第一手势输入的起点、滑动方向和终点,基于图标生成卡片。优选地,所述图标通过第一手势输入的起点确定。优选地,卡片的默认大小是预先设置好的。比如,在有些实施例中,普通应用程序App提供的卡片信息预先设置卡片的默认大小为3行2列图标的圆角矩形。优选地,所述卡片的固定支点是根据所述图标的位置确定的。比如,图9b上卡片9031右下角的固定支点根据备忘录应用图标9021的位置确定。优选地,所述卡片的生成方向是根据第一手势的滑动方向确定的。比如,从图9a至图9b,卡片9031的生成方向是根据第一手势的滑动方向确定的。
响应于第二手势输入,基于卡片恢复图标。优选地,响应于第二手势输入的起点,基于卡片恢复图标。优选地,响应于第二手势输入的起点和滑动方向,基于卡片恢复图标。优选地,第二手势输入的起点位于卡片上。优选地,第二手势输入的起点位于卡片上的特定区域。优选地,第二手势输入的起点位于卡片周围的一定区域内。
需要说明的是,在图9a-9b以及后续的图中,虽然均示出了手指在电子设备的屏上移动,但手指仅用于示意性举例,并非用于限制。触控笔等各种触控设备也在本申请实施例的保护范围之内。另外,第一手势输入并非限于在电子设备的触摸屏上触摸获取的手势输入;还可以包括在电子设备的触摸屏上的落点移动获取的手势输入。
在生成显示卡片之后,卡片显示的N个控件中的每一个控件为与N个图标中的每一个图标相关的控件,用户可以通过N个控件中的每一个控件打开与对应的一个应用。以图10为例,进一步展开说明。在图10a上,以在备忘录应用图标10021上的触摸点1010为起点,沿着图10a所示的滑动方向滑动后,图10a所示的界面1002切换至图10b所示的界面1003。在界面1003上,卡片10031的右上角显示有控件。所述控件与图标相关。以控件中的图库控件为例说明。在用户触摸控件中的图库控件10032后,图库控件10032对应的图库应用会被打开;相应地,图10b所示的界面1003切换至图10c所示的界面1004。在界面1004上,用户可以进行对图库应用的正常操作。在操作完毕后,用户触摸按钮10041,则图10c所示的界面1004返回至图10b所示的界面1003。进一步地,用户还可以通过触摸图10b所示的界面1003上的卡片10031以外区域显示的图标,比如触摸界面1003上的微信图标,打开微信应用,进入微信应用打开后的界面,并在微信应用打开后的界面完成操作后,通过触摸返回按钮,仍返回至图10b所示的界面1003。用户也可以先触摸界面1003上的微信图标,打开微信信用,进入微信应用打开后的界面,并在微信应用打开后的界面完成操作后,通过触摸返回按钮,仍返回至图10b所示的界面1003;之后,用户再触摸界面1003上的卡片10031上的图库控件10032,进入图10c所示的界面1004,在操作完毕后,用户触摸按钮10041,返回至图10b所示的界面1003。
另外地,在生成显示卡片之后,卡片显示的控件还可以为与卡片覆盖图标以外图标相关的控件,用户可以通过N个控件中的每一个控件打开与对应的一个 应用。以图11为例,进一步展开说明。在图11a上,以在备忘录应用图标11021上的触摸点1110为起点,沿着图11a所示的滑动方向滑动后,图11a所示的界面1102切换至图11b所示的界面1103。在界面1103上,卡片11031的右上角显示有控件。所述控件与卡片覆盖图标以外的图标相关。以控件中的学习控件为例说明。在用户触摸控件中的学习控件11032后,学习控件11032对应的学习应用被打开;相应地,图11b所示的界面1103切换至图11c所示的界面1104。在界面1104上,用户可以对学习应用进行正常操作。在操作完毕后,用户触摸按钮11041,则图11c所示的界面1104返回至图11b所示的界面1103。第二控件区显示的控件与卡片内容存在操作上的后续联系或内容上的联系。比如,第二控件区显示控件,所述控件为诸如微信、QQ等用于分享的应用程序图标缩小另外比例后显示的控件。或者,第二控件区显示控件,所述控件与卡片内容相关联。比如,卡片内容包括“21点学习英语”,控件包括学习应用图标缩小另外比例后显示的控件。所述学习应用图标可以不显示在所述电子设备的桌面的当前屏上,比如显示在所述电子设备的桌面的其他屏上。进一步地,用户还可以通过触摸图11b所示的界面1103上的卡片11031以外区域显示的图标,比如触摸界面1103上的微信图标,打开微信应用,进入微信应用打开后的界面,并在微信应用打开后的界面完成操作后,通过触摸返回按钮,仍返回至图11b所示的界面1103。用户也可以先触摸界面1103上的微信图标,打开微信信用,进入微信应用打开后的界面,并在微信应用打开后的界面完成操作后,通过触摸返回按钮,仍返回至图11b所示的界面1103;之后,用户再触摸界面1103上的卡片11031上的图库控件11032,进入图11c所示的界面1104,在操作完毕后,用户触摸按钮11041,返回至图11b所示的界面1103。
另外地,第一手势输入除了以图9a示出的以图标上的触摸点为起点,以图9a示出的方向为滑动方向的手势输入方式之外,还可有多种方式。图12就示出了包含图9示出方式在内的四种方式。其中,图12a示出的方式与图9示出的方式相同,此处不再赘述;图12c示出了在备忘录应用图标上双点触摸并向外滑动后,也会基于备忘录应用图标,生成图12b所示的卡片。图12d示出了在长按备忘录应用图标后,也会基于备忘录应用图标,生成图12b所示的卡片。图12e示出了在以备忘录应用图标上的触摸点为起点,以图12e示出的方向为滑动方向后,也会基于备忘录应用图标,生成图12b所示的卡片。从中可以看出,图12a、12d和图12e示出了通过单点触摸,基于图标生成卡片;图12c示出了通过双点触摸,基于图标生成卡片。除了图12c示出的双点触摸方式外,还可以通过三点触摸、四点触摸等多点触摸方式,来基于图标生成卡片。此处不再展开阐述。本领域技术人员应当理解的是,用于触发基于图标生成卡片的第一手势的具体实施方式,不限于上述方式,还可以为本领域技术人员所能想到的其他任意方式。此处不再赘述。
在不同的实施例中,在第一手势输入的触发下,基于图标生成的卡片也可以有多种不同的覆盖范围。以第一手势输入的起点在备忘录应用图标上,第一手势 的方向为向上滑动为例。图13示出了基于图标生成的卡片覆盖了不同范围的三种方式。在有些实施例中,如图13a-13b所示,在手指以备忘录应用图标上的触摸点为起点,按照图13a示出的方向滑动后,生成图13b示出的卡片13031;卡片13031覆盖的图标为备忘录、文件管理和脸书。在手指以卡片13031上的触摸点为起点,按照图13b示出的方向滑动后,卡片13031恢复成图13a示出的备忘录、文件管理和脸书应用的图标,图13b所示的界面恢复成图13a所示的界面。
在有些实施例中,如图13a和13c所示,在手指以备忘录应用图标上的触摸点为起点,按照图13a示出的方向滑动后,生成图13c示出的卡片13031’;卡片13031’覆盖的图标为备忘录、播放器、文件管理、设置、脸书和推特。在手指以卡片13031’上的触摸点为起点,按照图13c示出的方向滑动后,卡片13031’恢复成图13a示出的备忘录、播放器、文件管理、设置、脸书和推特应用的图标,图13c所示的界面恢复成图13a所示的界面。
在有些实施例中,如图13a和13d所示,在手指以备忘录应用图标上的触摸点为起点,按照图13a示出的方向滑动后,生成图13d示出的卡片13031”;卡片13031”覆盖的图标为备忘录、文件管理、脸书、支付宝、游戏和商城应用的图标。在手指以卡片上的触摸点为起点,按照图13d示出的方向滑动后,卡片13031”恢复成图13a示出的备忘录、文件管理、脸书、支付宝、游戏和商城应用的图标,图13d所示的界面恢复成图13a所示的界面。
在上述不同的实施例中,响应于相同的第一手势输入的起点和方向,可以生成覆盖不同范围的卡片。图13a中的起点和方向仅为示意性举例;以其他的触摸点为起点,按照其他的方向滑动,均可以基于图标生成覆盖不同范围的卡片。比如,以备忘录应用图标上的触摸点为起点,向左横向滑动,可以基于备忘录应用图标生成覆盖备忘录、播放器、图库和邮件应用的图标,也可以基于备忘录应用图标生成覆盖备忘录、播放器和图库应用的图标等等。此处不再赘述。卡片覆盖的范围与第一手势的起点和方向之间的对应关系,需要预先设置。在设置完毕后,相同的第一手势只能生成覆盖范围相同的卡片。
除了图9b、图10b、图11b、图12b、图13b、图13c和图13d示出的不包含第一控件的卡片外,卡片还可以包含第一控件。相应地,包含第一控件的卡片可以为图14a、图14b、图14c、图14d和图14e所示。以图14a为例,进一步说明。在图14a上,第一控件区1402显示第一控件;第二控件区1401显示控件;卡片内容区1403显示卡片内容。
用于触发基于卡片恢复图标的第二手势输入,除了以图9b示出的以卡片上的触摸点为起点,以图9b示出的方向为滑动方向的手势输入的方式之外,还可有多种方式。图15就示出了其中的4种方式。其中,图15a示出了在卡片1504上双点触摸并向内滑动后,也会基于卡片1504,恢复成图15b所示的图标。图15c示出了在卡片1505上,选中卡片1505上的控件区15051,也会基于卡片1505,恢复成图15b所示的图标。图15d示出了在界面1503’上,触摸卡片1506外的区域,也会基于卡片1506,恢复成图15b所示的图标。图15e示出了在卡片1507 上,触摸卡片1507上第二控件区任意一个图标,也会基于卡片1507,恢复成图15b所示的图标。界面1503、界面1503’、界面1503”和界面1503”’在基于卡片恢复成图标后的界面为1502。在图15a、15c、15d和15e中,卡片1504、卡片1505、卡片1506和卡片1507均为相同卡片,界面1503、界面1503’、界面1503”和界面1503”’均为相同界面;只不过为了清楚说明,在不同的附图中,采用了不同的附图标记。除了图15a示出的双点触摸方式外,还可以通过三点触摸、四点触摸等多点触摸方式,来基于卡片恢复成图标。此处不再展开阐述。
另外,图16示出了触发基于卡片恢复图标的第二手势输入的其他方式。图16a所示的界面1604包含卡片16041,卡片16041包含第二控件区16042;待手指选中第二控件区16042后,图16a所示的界面1604切换为图16b所示的界面1605,此时卡片16041恢复成图标。
本领域技术人员应当理解的是,用于触发基于卡片恢复成图标的第二手势输入的具体实施方式,不限于上述方式,还可以为本领域技术人员所能想到的其他任意方式。此处不再赘述。
除了上述方式之外,还存在其他方式基于图标生成卡片以及基于卡片恢复成图标。图17就示出了另外一种基于图标生成卡片以及基于卡片恢复成图标的方式。在如图17a所示的界面1702上,以手指在备忘录应用图标上的触摸点为起点,沿着图17a所示的方向向上滑动;图17a所示的界面1702就会变成图17b所示的界面1703。同时,在界面1703上,生成卡片17031。此时,卡片17031悬浮在界面1703上。在手指触摸卡片17031上的固定按钮17032后,界面1703切换为界面1704;同时,卡片17031切换为卡片17041,卡片17031包含的固定按钮17032切换为卡片17041包含的关闭按钮17042。此时,卡片17041固定在界面1704上。在手指触摸关闭按钮17042后,界面1704返回至界面1702。这样,生成卡片后,卡片具有两种状态——悬浮状态和固定状态;当卡片处于悬浮状态,在检测到第一操作时,卡片由悬浮状态转换为固定状态;当卡片处于固定状态,在检测到第二操作时,卡片恢复成图标。可选地,当卡片处于固定状态,在检测到第三操作时,卡片由固定状态转换为悬浮状态。另外,在卡片处于悬浮状态时,可以将卡片拖动至其他位置,此时卡片的内容会随着该位置所覆盖的图标的变化而变化。
本申请实施例还提供了打开卡片上第二控件区中各控件所对应应用的多种方式。图18-图22示出了其中的几种方式。以打开推特应用为例。如图18所示,在图18a上,以备忘录应用图标18021上的触摸点为起点,按照图18a示出的方向向上滑动后,生成卡片18031,此时的界面为图18b示出的界面1803。其中,第二控件区18032位于卡片18031的上部。以在界面1803上打开推特应用为例。将手指位于第二控件区18032中的推特应用控件的上方,则推特应用控件18043放大;此时图18b示出的界面1803切换为图18c示出的界面1804,相应地,卡片18031切换为卡片18041;之后在垂直于桌面的当前屏的方向上远离推特应用控件18043,则推特应用被打开。
如图19所示,在图19a上,以备忘录应用图标19021上的触摸点为起点,按照图19a示出的方向向上滑动后,生成卡片19031,此时的界面为图19b示出的界面1903。其中,悬浮球19032位于卡片19031的上部。以打开推特应用为例。将手指触摸悬浮球19032或位于悬浮球19032的上方,则悬浮球19032会展开显示第二控件区19042;将手指置于第二控件区19042中的推特应用控件的上方,则推特应用控件19043放大;之后在垂直于桌面的当前屏的方向上远离推特应用控件19043,则推特应用被打开。
如图20所示,在垂直于桌面的当前屏的方向上,将手指位于第二控件区中的推特应用控件20022的上方,则推特应用控件放大;之后在垂直于桌面的当前屏的方向上远离放大后的推特应用控件,则推特应用被打开。
如图21所示,在垂直于桌面的当前屏的方向上,将手指位于第二控件区21032中任意控件的上方,则在第二控件区21032的上方会显示放大后的第二控件区。在垂直于桌面的当前屏的方向上,若手指不位于第二控件区21032中任意控件的上方,则在第二控件区21032的上方不会显示放大后的第二控件区。将手指触摸上述放大后的第二控件区21042中推特应用控件,则推特应用被打开。
如图22所示,在垂直于桌面的当前屏的方向上,将手指位于第二控件区22032中推特应用控件的上方,则在第二控件区22032中推特应用控件的上方会显示放大后的推特应用控件。在垂直于桌面的当前屏的方向上,若手指不位于第二控件区22032中推特应用控件的上方,则在第二控件区21032中推特应用控件的上方不会显示放大后的推特应用控件。将手指触摸上述放大后的推特应用控件,则推特应用被打开。
另外,手指也可以直接触摸界面第二控件区所包括的推特应用控件。推特应用被打开。
有关打开卡片上第二控件区各控件对应应用的方式,除了上述方式以外,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内;此处不再一一赘述。
若要打开卡片上第一控件区中第一控件对应的应用,可以直接触摸第一控件区中的第一控件;还可以采用在垂直于桌面的当前屏的方向上,先将手指位于第一控件区中第一控件的上方再远离来打开的方式等。同样地,有关打开卡片上第一控件区中第一控件对应应用的方式,除了上述方式以外,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内;此处不再一一赘述。
在有些实施例中,还可以快捷地将卡片第二控件区的控件迅速地在桌面的当前屏上恢复成图标。如图23a所示,界面2303的下部存在多余空间;选中卡片23031上的第二控件区23032,并朝界面2303的下部拖动;在拖至图23b所示的界面2304的下部后,第二控件区23032切换为第二控件区23042,释放选中的第二控件区23042;此时,第二控件区23042上的控件恢复成原始图标大小,并按照与桌面图标相同的排列方式排列在图23c所示的界面2305的下部。这样,就能快捷地将卡片第二控件区的控件迅速地在当前屏上恢复成图标;便于用户操 作。
另外,一个图标并非只能对应着一张卡片。一个应用图标可以对应着多张卡片。以日历应用图标对应着两张卡片为例。如图24所示,在手指以界面2402上日历应用图标24021上的触摸点为起点,沿着图24a所示的方向向上滑动后,生成卡片24031,此时的界面为图24b所示的界面2403;之后,手指在卡片24031上,沿着图24b示出的方向向左滑动,此时卡片24031转换为卡片24041,此时的界面为图24c所示的界面2404;其中,卡片24031与卡片24041在显示的风格、内容与形式上不同;手指还可以在卡片24041上向右滑动,将卡片24041切换回卡片24031。也就是说,一个应用图标可以对应着多张卡片;在生成卡片之后,可以通过操作,实现所述多张卡片之间的切换。需要说明的是,一个应用图标对应着几张卡片,需要提前设置。
此外,也可以基于文件夹图标生成卡片。其中,文件夹图标为桌面上的图标合并成文件夹,并以图标的形式显示的图标。如图25所示,在手指以界面2502上文件夹图标25021上的触摸点为起点,沿着图25a所示的方向向上滑动后,生成卡片25031,此时的界面为图25b所示的界面2503;之后,手指在卡片25031上,沿着图25b示出的方向向左滑动,此时卡片25031转换为卡片25041,此时的界面为图25c所示的界面2504;手指在卡片25041上,沿着图25c示出的方向向左滑动,此时卡片25041转换为卡片25051,此时的界面为图25d所示的界面2505。手指还可以在卡片25051上向右滑动,此时卡片25051转换为卡片25041;手指继续在卡片25041上向右滑动,此时卡片25041转换为卡片25031。其中,卡片25031对应着基于文件夹图标中的支付宝应用图标生成的卡片;卡片25041对应着基于文件夹图标中的备忘录应用图标生成的卡片;卡片25051对应着基于文件夹图标中的天气应用图标生成的卡片。也就是说,一个文件夹图标可以对应着多张卡片。在生成卡片之后,可以通过操作,实现所述文件夹图标包括的多个图标分别对应的多张卡片之间的切换。
在有些情形下,需要在电子设备的当前屏上显示至少一张卡片。此时,就需要处理好多张卡片的显示问题。本申请实施例提供了多张卡片在当前屏上显示的几种实施方式。如图26a所示,在手指以界面2602上备忘录应用图标26021上的触摸点为起点,沿着图26a所示的方向向上滑动后,生成卡片26031,此时的界面为图26b所示的界面2603;之后,在手指以界面2603上支付宝应用图标26032上的触摸点为起点,沿着图26b所示的方向向上滑动后,生成卡片26041,此时卡片26031恢复成之前被其覆盖的图标,此时的界面为图26c所示的界面2604。也就是说,在图26所示的实施方式中,在同一时刻只能存在最多一张卡片。
如图27所示,在手指以界面2702上备忘录应用图标27021上的触摸点为起点,沿着图27a所示的方向向上滑动后,生成卡片27031,此时的界面为图27b所示的界面2703;之后,在手指以界面2703上支付宝应用图标27032上的触摸点为起点,沿着图27b所示的方向向上滑动后,生成卡片27041,此时卡片27031 保持不变,此时的界面为图27c所示的界面2704。也就是说,在图27所示的实施方式中,在同一时刻可以存在多张卡片;只是多张卡片之间没有重叠区域。图27作为示例,说明在本实施例中多张卡片共存要满足的规则。虽然在图27中仅示出了两张卡片,但该两张卡片并不用于限制本申请实施例的范围,三张、四张、五张及更多张卡片均在本申请实施的范围内。后续有关多张卡片的示例也如此,并不限制本申请实施例中的卡片数量,仅为示意性举例。
如图28所示,在手指以界面2802上备忘录应用图标28021上的触摸点为起点,沿着图28a所示的方向向上滑动后,生成卡片28031,此时的界面为图28b所示的界面2803;之后,在手指以界面2803上支付宝应用图标28032上的触摸点为起点,沿着图28b所示的方向向上滑动后,生成卡片28041,此时卡片28031保持不变,此时的界面为图28c所示的界面2804。之后,在手指以界面2804上以天气应用图标28042上的触摸点为起点,沿着图28c所示的方向向上滑动后,生成卡片28051,此时卡片28031、卡片28041均恢复成之前被各自覆盖的图标,此时的界面为图28d所示的界面2805。也就是说,在图28所示的实施方式中,在卡片之间没有重叠区域时,多张卡片可以共存在当前屏上;在卡片之间存在重叠区域时,仅显示最新生成的卡片,与最新生成的卡片存在重叠区域的卡片则会恢复成之前被其覆盖的图标。
除了多张卡片在当前屏上显示的上述实施方式以外,还存在诸多实施方式,此处不再一一赘述。需要强调的是,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内。
另外,在用户通过操作将最新生成的卡片不显示后,比如恢复成图标后,次新生成的卡片如何显示也需要明确。为此,本申请实施例也提供了几种实施方式。如图29所示,在手指以界面2902上备忘录应用图标29021上的触摸点为起点,沿着图29a所示的方向向上滑动后,生成卡片29031,此时的界面为图29b所示的界面2903;之后,在手指以界面2903上天气应用图标29032上的触摸点为起点,沿着图29b所示的方向向上滑动后,生成卡片29041,此时卡片29031消失,此时的界面为图29c所示的界面2904;之后,在手指以卡片29041上的触摸点为起点,沿着图29c所示的方向向下滑动后,卡片29041消失,之前生成的卡片29031再次显示,此时的界面又恢复为界面2903。也就是说,在图29所示的实施方式中,在最新生成的卡片不显示后,次新生成的卡片显示在当前屏上。
如图30所示,在手指以界面3002上备忘录应用图标30021上的触摸点为起点,沿着图30a所示的方向向上滑动后,生成卡片30031,此时的界面为图30b所示的界面3003;之后,在手指以界面3003上天气应用图标30032上的触摸点为起点,沿着图30b所示的方向向上滑动后,生成卡片30041,此时卡片30031消失,此时的界面为图30c所示的界面3004;之后,在手指以卡片30041上的触摸点为起点,沿着图30c所示的方向向下滑动后,卡片30041恢复成被其覆盖的图标,之前生成的卡片30031也不显示,此时的界面又恢复为界面3002。也就是说,在图30所示的实施方式中,在最新生成的卡片不显示后,次新生成的 卡片也不显示在当前屏上。
有关最新生成的卡片不显示后,次新生成的卡片如何显示的方式,除了上述实施方式以外,本领域技术人员所能想到的其他方式都在本申请实施例的保护范围之内;此处不再一一赘述。
另外,在基于图标生成卡片之后,还可以拖动卡片。图31示出了在拖动卡片至不同位置后,卡片如何变化。如图31所示,在手指以界面3102上备忘录应用图标31021上的触摸点为起点,沿着图31a所示的方向向上滑动后,生成卡片31031,此时的界面为图31b所示的界面3103;之后,手指选中卡片31031并向上拖动;在将卡片31031拖动至图31c所示的位置时,此时界面为图31c所示的界面3104;手指松开卡片31031,此时卡片31031转换为卡片31051,此时界面为图31d所示的界面3105;从中可以看出,卡片31051的内容发生了变化,将此时卡片31051的内容记为卡片内容一;此外,在界面3102上,以支付宝应用图标上的触摸点为起点,按照向上滑动方向滑动,生成卡片,卡片覆盖的图标为支付宝、股票、游戏、地图、时钟、商城、华为运动、淘宝和音乐应用的图标,此时卡片的内容记为卡片内容二;则卡片内容一与卡片内容二相同。也就是说,在图31所示的实施方式中,在拖动基于图标生成的卡片至其他位置并释放后,此时卡片的内容可以变化。
在当前屏上共存有卡片和图标时,还可以对卡片覆盖的图标进行拖动、删除、合并等操作;在上述操作之后,卡片和图标如何显示需要明确。为此,图32-图38示出了几种具体的实施方式。其中,图32-图33示出了将卡片外的图标拖动至被卡片覆盖的图标生成文件夹图标后,卡片和图标在电子设备的当前屏上显示的两种实施方式。
如图32所示,卡片32021和卡片32021以外的图标共存在图32a所示的界面3202上,卡片32021右上角的第二控件区包含QQ控件;在手指长按备忘录应用图标32022后,桌面进入编辑状态,此时的界面转换为界面3203,卡片32021也转换为透明状态或半透明状态的卡片32031;同时被卡片32031覆盖的图标显示在界面3203上;手指拖动备忘录应用图标32032朝向卡片32031覆盖的QQ应用图标移动;待手指将备忘录应用图标32032置于QQ应用图标的上方,此时的界面转换为界面3204;待手指释放备忘录应用图标32032后,QQ应用图标和备忘录应用图标32032会合并为文件夹图标32052,此时的界面转换为界面3205,此时透明状态或半透明状态的卡片32031转换为透明状态或半透明状态的卡片32051;之后,卡片32051会转换为卡片32061,卡片32061不再透明,此时的界面转换为界面3206;卡片32061与卡片32021相比,两者的不同在于:卡片32061右上角的第二控件区包含了文件夹控件32062,不再包含QQ控件32022。也就是说,在图32所示的实施方式中,在桌面进入编辑状态后,拖动卡片外的图标至被卡片覆盖的图标生成文件夹图标,之后生成的卡片与原卡片相比,仅在第二控件区包含的控件有所不同,其余均相同。
如图33所示,卡片33021和卡片33021以外的图标共存在图33a所示的界 面3302上,卡片33021右上角的第二控件区包含QQ控件;在手指长按备忘录应用图标33032后,桌面进入编辑状态,此时的界面转换为界面3303,此时卡片33021转换为透明状态或半透明状态的卡片33031;同时被卡片33031覆盖的图标显示在界面3303上;手指拖动备忘录应用图标33032朝向卡片33031覆盖的QQ应用图标移动;待手指将备忘录应用图标33032置于QQ应用图标的上方,此时的界面转换为界面3304;待手指释放备忘录应用图标33032后,QQ应用图标和备忘录应用图标33032会合并为文件夹图标33052,此时卡片33031转换为透明状态或半透明状态的卡片33051,此时的界面转换为界面3305;之后,卡片33051消失,此时的界面转换为界面3306。也就是说,在图33所示的实施方式中,在桌面进入编辑状态后,拖动卡片外的图标至被卡片覆盖的图标生成文件夹图标,之后不再显示卡片。
除了将卡片外的图标拖动至被卡片覆盖的图标生成文件夹图标外,还可以将卡片覆盖的文件夹图标下的具体应用图标往卡片外拖动。图34示出了将卡片覆盖的文件夹图标下的具体应用图标往卡片外拖动,卡片和图标在电子设备的当前屏上显示的实施方式。如图34所示,卡片34021和卡片34021以外的图标共存在图34a所示的界面3402上,卡片34021右上角的第二控件区包含文件夹控件34022;在手指长按空白处后,桌面进入编辑状态,此时卡片34021转换为透明状态或半透明状态的卡片34031;此时的界面转换为界面3403,同时被卡片34031覆盖的图标显示在界面3403上;手指触摸文件夹图标34032,此时的界面转换为界面3404,文件夹图标34032放大显示为文件夹图标34041,手指选中并往外拖动备忘录应用图标34042;待手指将备忘录应用图标34042拖动至图34e所示的位置并释放后,备忘录应用图标34042缩小显示为备忘录应用图标34052,此时卡片34031转换为透明状态或半透明状态的卡片34051,此时的界面转换为界面3405;之后,卡片34051转换为卡片34061,卡片34061不再透明,界面3405转换为界面3406;卡片34061与卡片34021相比,两者的不同在于:卡片34061右上角的第二控件区包含了QQ控件34062,不再包含文件夹控件34022。也就是说,在图34所示的实施方式中,在桌面进入编辑状态后,拖动被卡片覆盖的文件夹图标下的具体应用图标至卡片外,之后生成的卡片与原卡片相比,仅在第二控件区包含的控件有所不同,其余均相同。
除了将卡片覆盖的文件夹图标下的具体应用图标往卡片外拖动外,还可以直接将卡片覆盖下的应用图标往卡片外拖动。其中,图35和图36示出了直接将卡片覆盖下的应用图标往卡片外拖动后,卡片和图标在电子设备的当前屏上显示的两种实施方式。如图35所示,卡片35021和卡片35021以外的图标共存在图35a所示的界面3502上,卡片35021右上角的第二控件区35022包含微信、支付宝、QQ、日历、设置、时钟、推特和股票应用的图标;在手指长按空白处后,桌面进入编辑状态,此时卡片35021转换为透明状态或半透明状态的卡片35031;此时的界面转换为界面3503,同时被卡片35031覆盖的图标显示在界面3503上;手指选中并往外拖动QQ应用图标35032;待手指将QQ应用图标35032拖动至 图35d所示的位置并释放时,此时卡片35031转换为透明状态或半透明状态的卡片35041,此时的界面转换为界面3504,在界面3504上,QQ应用图标被拖动空出来的位置,没有导致其他应用图标的顺次填补;之后,卡片35041转换为卡片35051,卡片35051不再透明,界面3504转换为界面3505,卡片35051右上角的第二控件区35052包含微信、支付宝、日历、设置、时钟、推特和股票应用的图标;卡片35051与卡片35021相比,两者的不同在于:卡片35051的第二控件区35052不包含QQ控件,卡片35021的第二控件区35022包含QQ控件。也就是说,在图31所示的实施方式中,在桌面进入编辑状态后,拖动被卡片覆盖的应用图标至卡片外,之后生成的卡片与原卡片相比,仅在第二控件区包含的控件有所不同,其余均相同。
如图36所示,卡片36021和卡片36021以外的图标共存在图36a所示的界面3602上,卡片36021右上角的第二控件区36022包含微信、支付宝、QQ、日历、设置、时钟、推特和股票应用的图标;在手指长按空白处后,桌面进入编辑状态,此时卡片36021转换为透明状态或半透明状态的卡片36031;此时的界面转换为界面3603,同时被卡片36031覆盖的图标显示在界面3603上;手指选中并往外拖动QQ应用图标36032,在QQ应用图标36032拖离其原始位置时,推特、脸书、天气、支付宝和文件管理等后续的应用图标会顺次填补,此时卡片36031转换为透明状态或半透明状态的卡片36041;待手指将QQ应用图标36032拖动至图36d所示的位置并释放时,此时的界面转换为界面3604;之后,卡片36041转换为卡片36051,卡片36051不再透明,界面3604转换为界面3605,卡片36051右上角的第二控件区36052包含微信、设置、推特、日历、文件管理、时钟、脸书和股票应用的图标;卡片36051与卡片36021相比,两者的不同在于:卡片36051的卡片内容区、第一控件区和第二控件区的内容分别与卡片36021的卡片内容区、第一控件区和第二控件区的内容不同。也就是说,在图36所示的实施方式中,在桌面进入编辑状态后,拖动被卡片覆盖的应用图标至卡片外,之后生成的卡片与原卡片相比,卡片的卡片内容区、第一控件区和第二控件区中的内容会发生变化。
另外,在电子设备的当前屏上存在多张卡片时,可以将卡片外的图标拖动至被其中一张卡片覆盖的图标生成文件夹。其中,图37-图38示出了将卡片外的图标拖动至被其中一张卡片覆盖的图标生成文件夹后,卡片和图标在电子设备的当前屏上显示的实施方式。以两张卡片为例。如图37所示,在图37a示出的界面3701上存在卡片37011和卡片37012;在手指长按邮件应用图标37023后,桌面进入编辑状态,此时卡片37011和卡片37012分别转换为透明状态或半透明状态的卡片37021和透明状态或半透明状态的卡片37022;此时的界面转换为界面3702,同时被卡片37021和卡片37022覆盖的图标显示在界面3702上;手指拖动邮件应用图标37023朝向卡片37022覆盖的设置应用图标37024移动;待手指将邮件应用图标37023置于设置应用图标37024的上方,此时的界面转换为界面3703;待手指释放邮件应用图标37023后,设置应用图标37024和邮件应用图标 37023会合并为文件夹图标37042,此时卡片37021转换为卡片37041,卡片37041不再透明,卡片37022消失,此时的界面转换为界面3704,被卡片37022覆盖的图标显示在界面3704上。也就是说,在图37所示的实施方式中,在当前屏上显示多张卡片且桌面进入编辑状态后,只要其中有卡片被编辑,则该被编辑的卡片不再显示。
如图38所示,在图38a示出的界面3801上存在卡片38011和卡片38012;在手指长按邮件应用图标38023后,桌面进入编辑状态,此时卡片38011和卡片38012分别转换为透明状态或半透明状态的卡片38021和透明状态或半透明状态的卡片38022;此时的界面转换为界面3802,同时被卡片38021和卡片38022覆盖的图标显示在界面3802上;手指拖动邮件应用图标38023朝向卡片38022覆盖的设置应用图标38024移动;待手指将邮件应用图标38023置于设置应用图标38024的上方,此时的界面转换为界面3803;待手指释放邮件应用图标38023后,设置应用图标38024和邮件应用图标38023会合并为文件夹图标38042,此时卡片38021转换为卡片38011,卡片38011不再透明,卡片38022转换为卡片38041,此时的界面转换为界面3804,被卡片38041覆盖的图标显示在界面3804上;之后,卡片38041转换为卡片38051,卡片38051不再透明,界面3804转换为界面3805,卡片38011保持不变;卡片38051与卡片38012相比,两者的不同为:卡片38051的第二控件区包含的控件与卡片38012的第二控件区包含的控件不同。也就是说,在图38所示的实施方式中,在当前屏上显示多张卡片且桌面进入编辑状态后,即使其中有卡片被编辑,则该被编辑的卡片仍然保留,只是显示的内容有所不同。
在有些情形下,电子设备的桌面的当前屏上的图标并不是都能用于生成卡片。比如,电子设备安装了第三方应用,且该第三方应用没有按照设置要求提供卡片信息。因此,有必要对桌面的当前屏上的图标进行区分,以方便用户使用。图39示出了通过图标的不同区分生成卡片的图标和不能生成卡片的图标的用户界面示意图。如图39a所示,用于生成卡片的图标下方的文字处均显示有横线;不能用于生成卡片的图标下方的文字处均不显示横线。这样,用户就能通过桌面的当前屏上的图标有无上述标记,识别区分出用于生成卡片的图标。比如,用户识别出图39a示出的备忘录应用图标下方显示有横线,用于生成卡片。对于文件夹图标而言,只要该文件夹图标包含的图标中有一个以上的图标能用于生成卡片,则该文件夹图标也会包含上述标记。所述标记的方式还可以为在所述用于生成卡片的图标下方的文字与所述图标之间显示横线,在所述用于生成卡片的图标的外围显示包裹所述图标的方框,在所述用于生成卡片的图标外的右上角等特定位置显示诸如星形等特殊标记等。还可以采用动画显示的方式区分识别出用于生成卡片的图标。比如,在一定的时长周期内,用于生成卡片的图标会显示特定的动画;而不生成卡片的图标则不显示。上述有关标记方式的举例仅为示意性举例,并不用于限制本申请实施例的范围。本领域技术人员所能想到的其他区分方式均在本申请实施例的范围内。在图39a和图39b上的基于备忘录应用图标生成卡片,以 及基于卡片恢复成图标的内容与上述图9a和图9b的相关内容一致,此处不再赘述。
为了实现在同一卡片内,第一控件下的若干功能之间的切换。本申请实施例还提供了图40-图41所示的实施例。如图40所示,在图40a示出的界面4001上显示卡片40010。第一控件40011显示在卡片40010的左上角,第一控件40011的周边显示有第一子控件40012、40013和40014。以第一子控件40012为例。在图40a所示的界面4001上,能够直接使用支付宝的付款码功能。在用户触摸第一子控件40012后,图40a所示的界面4001切换为图40b所示的界面4002。相应地,第一子控件40012会切换为第一子控件40022;同时,卡片40010的卡片内容显示的付款码界面也切换为卡片40020的卡片内容显示的扫一扫界面。这样,在图40b所示的界面40020上,就能够直接使用支付宝的扫一扫功能。在用户需要调用更多的功能时,可以直接触摸点击第一控件40011,就可以打开支付宝应用,从而进一步调用更多的功能;或者,直接触摸点击第一子控件40014,也能够调用更多的功能。
如图41所示,在图41a示出的界面4101上显示卡片41010。卡片41010上显示有卡片内容41011。卡片内容41011的上方显示有二维码以及容纳所述二维码的指示框,下方显示有“扫一扫”、“付款码”和“公交码”。此时指示框的指示箭头指向下方显示的“付款码”。在用户触摸点击“扫一扫”后,图41a所示的界面4101切换为图41b所示的界面4102。在界面4102上,卡片内容41021上方显示有扫一扫的功能界面以及容纳所述功能界面的指示框,下方显示有“扫一扫”、“付款码”和“公交码”。此时指示框的指示箭头指向下方显示的“扫一扫”。这样,在图41a所示的界面4101上,能够直接使用支付宝的扫一扫功能。同时,还能触摸卡片内容包含的同一应用下的不同子功能切换按钮或文字,实现卡片内容对应的同一应用下的不同子功能的切换显示。
为了卡片内第一控件与卡片内的其他控件之间的切换以及对应的卡片切换显示。本申请实施例还提供了图42所示的实施例。如图42所示,在图42a示出的界面4201上显示卡片42010。第一控件显示在卡片42010的左上角。第一控件的周边显示有三个第一子控件。若干个控件显示在卡片42010的右上角。以控件42011为例。在图42a所示的界面4201上,能够直接使用支付宝的付款码功能。在用户触摸控件42011后,图42a所示的界面4201切换为图42b所示的界面4202。控件42011为日历应用图标缩小比例后显示的控件。相应地,控件42011会切换为第一控件,并显示在卡片42020的左上角;同时,卡片42010的卡片内容显示的付款码界面也切换为卡片42020的卡片内容显示的日历界面。这样,在图42b所示的界面42020上,就能够直接查看日历的内容界面。也就是说,在检测到用户的上述输入后,第一控件可以与卡片上的其他控件互换;同时,卡片内容也会随着第一控件的更新同步更新。
本申请提供的上述各个实施例的全部或部分可以相互结合使用。
本申请实施例提供的方法适用于以下的电子设备。
图43所示为本申请提供的一种电子设备4300。示例的,电子设备4300包括至少一个处理器4310、存储器4320和显示屏4330。其中,处理器4310与存储器4320和触摸屏4330耦合,本申请实施例中的耦合可以是通信连接,可以是电性,或其它的形式。具体的,存储器4320用于存储程序指令。触摸屏4330用于显示用户界面。处理器4310用于调用存储器4020中存储的程序指令,使得电子设备4300执行本申请实施例提供的卡片的显示方法中由电子设备所执行的步骤。应理解,该电子设备4300可以用于实现本申请实施例提供的卡片显示的方法,相关特征可以参照上文,此处不再赘述。
在一些实施例中,在显示屏具有触摸功能时,显示屏又称为触摸显示屏。在触摸显示屏上的操作可以通过虚拟按键实现。在显示屏不具有触摸功能时,显示屏又称为非触摸显示屏。在非触摸显示屏上的操作可以通过物理按键实现。
本申请提供一种包含指令的计算机程序产品,当所述计算机程序产品在电子设备上运行时,使得所述电子设备执行本申请实施例提供的卡片显示的方法中由电子设备所执行的步骤。
本申请提供一种计算机可读存储介质,包括指令,当所述指令在电子设备上运行时,使得所述电子设备执行本申请实施例提供的卡片显示的方法中由电子设备所执行的步骤。
所属领域的技术人员可以清楚地了解到本申请实施例可以用硬件实现,或硬件与软件的方式实现。当使用硬件与软件实现,可以将上述功能存储在计算机可读介质中。基于这样的理解,本申请实施例的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)或处理器执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:快闪存储器、移动硬盘、只读存储器、随机存取存储器、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述,仅为本申请实施例的具体实施方式,但本申请实施例的保护范围并不局限于此,任何在本申请实施例揭露的技术范围内的变化或替换,都应涵盖在本申请实施例的保护范围之内。因此,本申请实施例的保护范围应以所述权利要求的保护范围为准。

Claims (26)

  1. 一种电子设备,包括:
    显示屏;
    一个或多个处理器;
    存储器;
    以及一个或多个计算机程序,其中所述一个或多个计算机程序存储在所述存储器上,当所述计算机程序被所述一个或多个处理器执行时,使得所述电子设备执行以下步骤:
    显示桌面的当前屏,所述当前屏显示若干个图标;
    检测到对所述若干个图标中一个第一图标的第一用户输入;
    响应于所述第一用户输入,所述当前屏显示第一卡片,所述第一卡片未占满所述当前屏;
    所述第一图标为第一文件夹图标,所述第一文件夹图标至少包括第一应用图标,所述第一应用图标对应第一应用;或者,所述第一图标为第一应用图标,所述第一应用图标对应第一应用;
    所述第一卡片至少包括:
    第一卡片内容,所述第一卡片内容包括所述第一应用打开后的第M层界面包含的部分内容,M为大于等于1的正整数;
    N个控件,所述N个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第一卡片之前所述桌面上相应的图标,N为大于等于1的正整数;
    所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分。
  2. 根据权利要求1所述的电子设备,其特征在于,
    所述第一用户输入通过一步操作输入;
    所述第一卡片内容在所述第一卡片上的面积占比最大;
    所述第一卡片内容的面积大于等于所述第一图标的面积;
    所述第一卡片在所述当前屏上的区域为第一区域;
    所述当前屏还显示背景;
    在显示所述第一卡片之前,所述N个控件对应N个图标,所述N个图标显示在所述第一区域上,所述第一区域只包括所述背景的第一部分、所述第一图标和所述N个图标,所述第一区域包括的图标的个数等于N加1。
  3. 根据权利要求1或2所述的电子设备,其特征在于,所述电子设备还执行以下步骤:
    检测到对所述N个控件中的一个控件的第二用户输入;
    响应于所述第二用户输入,显示所述N个控件中的一个控件对应的应用打开后的第S层界面;S为大于等于1的正整数;
    检测到一个返回操作;
    响应于所述返回操作,显示所述当前屏;所述当前屏显示的内容为响应所述第二用户输入之前所述当前屏显示的内容。
  4. 根据权利要求1-3中任意一项所述的电子设备,其特征在于,所述电子设备还执行以下步骤:
    检测到对所述当前屏上所述第一卡片的第三用户输入;
    响应于所述第三用户输入,所述第一区域显示的内容为响应所述第一用户输入之前所述第一区域显示的内容。
  5. 根据权利要求1-4中任意一项所述的电子设备,其特征在于,所述电子设备还执行以下步骤:
    所述当前屏上第一区域以外的区域还显示L个图标,L为大于等于1的正整数;
    检测到对所述L个图标中的一个图标的第四用户输入;
    响应于所述第四用户输入,显示所述L个图标中的一个图标对应的应用打开后的界面;
    检测到一个返回操作;
    响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第四用户输入之前所述当前屏显示的内容。
  6. 根据权利要求1-5中任意一项所述的电子设备,其特征在于,
    所述第一卡片还包括:
    第一控件,所述第一控件用于打开所述第一应用;所述第一控件为所述第一图标缩小第一比例后显示的控件;
    所述N个控件为N个图标缩小第二比例后显示的控件;
    所述第一控件的面积大于所述N个控件中任意一个控件的面积;
    所述第一控件、所述N个控件、所述第一卡片内容分别显示在所述第一卡片的左上角、右上角和中下部;
    所述第一用户输入为第一语音输入或第一手势输入;所述第一手势输入为起点位于所述第一图标上,滑动方向为向上滑动的手势输入;所述第一卡片随着所述第一手势输入而变化;
    所述第二用户输入和所述第四用户输入分别为:第二语音输入和第四语音输入,或者,第二手势输入和第四手势输入;
    所述第二手势输入和所述第四手势输入为触摸输入;
    所述第三手势输入通过一步操作输入;
    所述第三手势输入为起点位于所述第一卡片上,滑动方向与所述第一手势输入的滑动方向相反的手势输入。
  7. 根据权利要求1-6中任意一项所述的电子设备,其特征在于,所述电子设备还执行以下步骤:
    检测到对所述若干个图标中一个第二图标的第五用户输入;
    响应于所述第五用户输入,所述当前屏显示第二卡片,所述第二卡片未占满 所述当前屏;
    所述第二图标为第二文件夹图标,所述第二文件夹图标至少包括第二应用图标,所述第二应用图标对应第二应用;或者,所述第二图标为第二应用图标,所述第二应用图标对应第二应用;
    所述第二卡片至少包括:
    第二卡片内容,所述第二卡片内容与所述第二应用相对应,所述第二卡片内容包括所述第二应用打开后的第P层界面包含的部分内容,P为大于等于1的正整数;
    K个控件,所述K个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第二卡片之前所述桌面上相应的图标,K为大于等于1的正整数;
    所述第二卡片不同于所述第二应用打开后的第P层界面的全部和任意部分;
    所述第二卡片内容的面积大于所述第二图标的面积;
    所述第二卡片在所述当前屏上的区域为第二区域;
    所述第二区域与所述第一区域不交叉,所述当前屏还显示所述第一卡片;
    或者,
    所述第二区域与所述第一区域交叉,所述当前屏停止显示所述第一卡片。
  8. 根据权利要求7所述的电子设备,其特征在于,
    所述第五用户输入通过一步操作输入;
    所述第二卡片内容在所述第二卡片上的面积占比最大;
    所述第二卡片内容的面积大于等于所述第二图标的面积;
    在显示所述第二卡片之前,所述K个控件对应K个图标,所述K个图标显示在所述第二区域上,所述第二区域只包括所述背景的第二部分、所述第二图标和所述K个图标,所述第二区域包括的图标的个数等于K加1。
  9. 根据权利要求1-8中任意一项所述的电子设备,其特征在于,
    所述第一文件夹图标包括E个第一应用图标,E为大于等于2的正整数;
    检测到第一切换用户输入;
    响应于所述第一切换用户输入,所述第一卡片的第一卡片内容切换为另一第一卡片内容,所述第一卡片内容、所述另一第一卡片内容分别与所述E个第一应用图标中的两个第一应用图标相对应;
    和/或,
    所述第二文件夹图标包括F个第二应用图标,F为大于等于2的正整数;
    检测到第二切换用户输入;
    响应于所述第二切换用户输入,所述第二卡片的第二卡片内容切换为另一第二卡片内容,所述第二卡片内容、所述另一第二卡片内容分别与所述F个第二应用图标中的两个第二应用图标相对应。
  10. 根据权利要求1-9中任意一项所述的电子设备,其特征在于,
    所述第一卡片悬浮在所述当前屏上;所述第一卡片还包括固定按钮;在触摸 所述固定按钮后,所述第一卡片固定在所述当前屏上;
    和/或,
    所述第二卡片悬浮在所述当前屏上;所述第二卡片还包括固定按钮;在触摸所述固定按钮后,所述第二卡片固定在所述当前屏上。
  11. 根据权利要求10所述的电子设备,其特征在于,
    在所述第一卡片固定在所述当前屏上之后,所述第一卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片;或者,所述第一卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片;
    和/或,
    在所述第二卡片固定在所述当前屏上之后,所述第二卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片;或者,所述第二卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片。
  12. 根据权利要求1-11中任意一项所述的电子设备,其特征在于,
    所述第一图标为第一应用图标,所述第一应用图标对应多张第一卡片;
    检测到第五切换用户输入;
    响应于所述第五切换用户输入,所述多张第一卡片切换。
  13. 卡片显示方法,所述方法应用于包含显示屏的电子设备,其特征在于,所述方法包括:
    所述显示屏显示桌面的当前屏,所述当前屏显示若干个图标;
    检测到对所述若干个图标中一个第一图标的第一用户输入;
    响应于所述第一用户输入,所述当前屏显示第一卡片,所述第一卡片未占满所述当前屏;
    所述第一图标为第一文件夹图标,所述第一文件夹图标至少包括第一应用图标,所述第一应用图标对应第一应用;或者,所述第一图标为第一应用图标,所述第一应用图标对应第一应用;
    所述第一卡片至少包括:
    第一卡片内容,所述第一卡片内容包括所述第一应用打开后的第M层界面包含的部分内容,M为大于等于1的正整数;
    N个控件,所述N个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第一卡片之前所述桌面上相应的图标,N为大于等于1的正整数;
    所述第一卡片不同于所述第一应用打开后的第M层界面的全部和任意部分。
  14. 根据权利要求13所述的方法,其特征在于,所述方法包括:
    所述第一用户输入通过一步操作输入;
    所述第一卡片内容在所述第一卡片上的面积占比最大;
    所述第一卡片内容的面积大于所述第一图标的面积;
    所述第一卡片在所述当前屏上的区域为第一区域;
    所述当前屏还显示背景;
    在显示所述第一卡片之前,所述N个控件对应N个图标,所述N个图标显 示在所述第一区域上,所述第一区域只包括所述背景的第一部分、所述第一图标和所述N个图标,所述第一区域包括的图标的个数等于N加1。
  15. 根据权利要求13或14所述的方法,其特征在于,所述方法包括:
    检测到对所述N个控件中的一个控件的第二用户输入;
    响应于所述第二用户输入,显示所述N个控件中的一个控件对应的应用打开后的第S层界面;S为大于等于1的正整数;
    检测到一个返回操作;
    响应于所述返回操作,显示所述当前屏;所述当前屏显示的内容为响应所述第二用户输入之前所述当前屏显示的内容。
  16. 根据权利要求13-15中任意一项所述的方法,其特征在于,所述方法包括:
    检测到对所述当前屏上所述第一卡片的第三用户输入;
    响应于所述第三用户输入,所述第一区域显示的内容为响应所述第一用户输入之前所述第一区域显示的内容。
  17. 根据权利要求13-15中任意一项所述的方法,其特征在于,所述方法包括:
    所述当前屏上第一区域以外的区域还显示L个图标,L为大于等于1的正整数;
    检测到对所述L个图标中的一个图标的第四用户输入;
    响应于所述第四用户输入,显示所述L个图标中的一个图标对应的应用打开后的界面;
    检测到一个返回操作;
    响应于所述返回操作,显示所述当前屏,所述当前屏显示的内容为响应所述第四用户输入之前所述当前屏显示的内容。
  18. 根据权利要求13-17中任意一项所述的方法,其特征在于,所述方法包括:
    所述第一卡片还包括:
    第一控件,所述第一控件用于打开所述第一应用;所述第一控件为所述第一图标缩小第一比例后显示的控件;
    所述N个控件为N个图标缩小第二比例后显示的控件;
    所述第一控件的面积大于所述N个控件中任意一个控件的面积;
    所述第一控件、所述N个控件、所述第一卡片内容分别显示在所述第一卡片的左上角、右上角和中下部;
    所述第一用户输入为第一语音输入或第一手势输入;所述第一手势输入为起点位于所述第一图标上,滑动方向为向上滑动的手势输入;所述第一卡片随着所述第一手势输入而变化;
    所述第二用户输入和所述第四用户输入分别为:第二语音输入和第四语音输入,或者,第二手势输入和第四手势输入;
    所述第二手势输入和所述第四手势输入为触摸输入;
    所述第三手势输入通过一步操作输入;
    所述第三手势输入为起点位于所述第一卡片上,滑动方向与所述第一手势输 入的滑动方向相反的手势输入。
  19. 根据权利要求13-18中任意一项所述的方法,其特征在于,所述方法还包括:
    检测到对所述若干个图标中一个第二图标的第五用户输入;
    响应于所述第五用户输入,所述当前屏显示第二卡片,所述第二卡片未占满所述当前屏;
    所述第二图标为第二文件夹图标,所述第二文件夹图标至少包括第二应用图标,所述第二应用图标对应第二应用;或者,所述第二图标为第二应用图标,所述第二应用图标对应第二应用;
    所述第二卡片至少包括:
    第二卡片内容,所述第二卡片内容与所述第二应用相对应,所述第二卡片内容包括所述第二应用打开后的第P层界面包含的部分内容,P为大于等于1的正整数;
    K个控件,所述K个控件中的每一个控件用于打开对应的应用,所述应用对应于在显示所述第二卡片之前所述桌面上相应的图标,K为大于等于1的正整数;
    所述第二卡片不同于所述第二应用打开后的第P层界面的全部和任意部分;
    所述第二卡片内容的面积大于所述第二图标的面积;
    所述第二卡片在所述当前屏上的区域为第二区域;
    所述第二区域与所述第一区域不交叉,所述当前屏还显示所述第一卡片;
    或者,
    所述第二区域与所述第一区域交叉,所述当前屏停止显示所述第一卡片。
  20. 根据权利要求19所述的方法,其特征在于,
    所述第五用户输入通过一步操作输入;
    所述第二卡片内容在所述第二卡片上的面积占比最大;
    所述第二卡片内容的面积大于等于所述第二图标的面积;
    在显示所述第二卡片之前,所述K个控件对应K个图标,所述K个图标显示在所述第二区域上,所述第二区域只包括所述背景的第二部分、所述第二图标和所述K个图标,所述第二区域包括的图标的个数等于K加1。
  21. 根据权利要求1-20中任意一项所述的方法,其特征在于,所述方法包括:
    所述第一文件夹图标包括E个第一应用图标,E为大于等于2的正整数;
    检测到第一切换用户输入;
    响应于所述第一切换用户输入,所述第一卡片的第一卡片内容切换为另一第一卡片内容,所述第一卡片内容、所述另一第一卡片内容分别与所述E个第一应用图标中的两个第一应用图标相对应;
    和/或,
    所述第二文件夹图标包括F个第二应用图标,F为大于等于2的正整数;
    检测到第二切换用户输入;
    响应于所述第二切换用户输入,所述第二卡片的第二卡片内容切换为另一第二卡片内容,所述第二卡片内容、所述另一第二卡片内容分别与所述F个第二应用图标中的两个第二应用图标相对应。
  22. 根据权利要求13-21中任意一项所述的电子设备,其特征在于,所述方法包括:
    所述第一卡片悬浮在所述当前屏上;所述第一卡片还包括固定按钮;在触摸所述固定按钮后,所述第一卡片固定在所述当前屏上;
    和/或,
    所述第二卡片悬浮在所述当前屏上;所述第二卡片还包括固定按钮;在触摸所述固定按钮后,所述第二卡片固定在所述当前屏上。
  23. 根据权利要求22所述的电子设备,其特征在于,所述方法包括:
    在所述第一卡片固定在所述当前屏上之后,所述第一卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片;或者,所述第一卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第一卡片;
    和/或,
    在所述第二卡片固定在所述当前屏上之后,所述第二卡片的固定按钮转换为关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片;或者,所述第二卡片还包括关闭按钮;在触摸所述关闭按钮后,停止显示所述第二卡片。
  24. 根据权利要求13-23中任意一项所述的电子设备,其特征在于,所述方法包括:
    所述第一图标为第一应用图标,所述第一应用图标对应多张第一卡片;检测到第五切换用户输入;响应于所述第五切换用户输入,所述多张第一卡片切换。
  25. 一种计算机可读存储介质,包括指令,其特征在于,当所述指令在电子设备上运行时,使得所述电子设备执行如权利要求13-24中任意一项所述的卡片显示方法。
  26. 一种电子设备上的图形用户界面系统,其特征在于,所述电子设备具有显示屏、存储器、以及一个或多个处理器,所述一个或多个处理器用于执行存储在所述存储器中的一个或多个计算机程序,其特征在于,所述图形用户界面包括所述电子设备执行如权利要求13-24中任意一项所述的方法时显示的图形用户界面。
PCT/CN2021/072592 2020-02-11 2021-01-19 卡片显示方法、电子设备及计算机可读存储介质 WO2021159922A1 (zh)

Priority Applications (8)

Application Number Priority Date Filing Date Title
JP2022546526A JP2023513063A (ja) 2020-02-11 2021-01-19 カード表示方法、電子機器、およびコンピュータ可読記憶媒体
AU2021220808A AU2021220808B2 (en) 2020-02-11 2021-01-19 Card display method, electronic device, and computer readable storage medium
EP21754479.0A EP4068065A4 (en) 2020-02-11 2021-01-19 MAP DISPLAY METHOD, ELECTRONIC DEVICE AND COMPUTER READABLE STORAGE MEDIUM
CN202180002184.3A CN113508360B (zh) 2020-02-11 2021-01-19 卡片显示方法、电子设备及计算机可读存储介质
US17/793,480 US20230077467A1 (en) 2020-02-11 2021-01-19 Card Display Method, Electronic Device, and Computer Readable Storage Medium
KR1020227024343A KR20220110314A (ko) 2020-02-11 2021-01-19 카드 디스플레이 방법, 전자 디바이스 및 컴퓨터 판독 가능 저장 매체
CN202210389179.9A CN114911380B (zh) 2020-02-11 2021-01-19 卡片显示方法、电子设备及计算机可读存储介质
AU2024200478A AU2024200478A1 (en) 2020-02-11 2024-01-25 Card display method, electronic device, and computer readable storage medium

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202010094030.9 2020-02-11
CN202010094030.9A CN111966251B (zh) 2020-02-11 2020-02-11 卡片显示方法、电子设备及计算机可读存储介质

Publications (1)

Publication Number Publication Date
WO2021159922A1 true WO2021159922A1 (zh) 2021-08-19

Family

ID=73358327

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2021/072592 WO2021159922A1 (zh) 2020-02-11 2021-01-19 卡片显示方法、电子设备及计算机可读存储介质

Country Status (8)

Country Link
US (1) US20230077467A1 (zh)
EP (1) EP4068065A4 (zh)
JP (1) JP2023513063A (zh)
KR (1) KR20220110314A (zh)
CN (4) CN111966251B (zh)
AU (2) AU2021220808B2 (zh)
DE (1) DE202021004106U1 (zh)
WO (1) WO2021159922A1 (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114327195A (zh) * 2022-02-15 2022-04-12 荣耀终端有限公司 卡片管理方法、设备及存储介质

Families Citing this family (15)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111966251B (zh) * 2020-02-11 2021-08-13 荣耀终端有限公司 卡片显示方法、电子设备及计算机可读存储介质
CN115061607A (zh) * 2021-02-27 2022-09-16 华为技术有限公司 功能页面显示方法及电子设备
CN115033140A (zh) * 2021-03-05 2022-09-09 华为技术有限公司 一种卡片组件的显示方法、图形用户界面及相关装置
CN113805765B (zh) * 2021-08-12 2022-08-02 荣耀终端有限公司 一种卡片显示方法及电子设备
CN113824842B (zh) * 2021-08-12 2022-08-12 荣耀终端有限公司 通知消息的展示方法及电子设备、计算机可读存储介质
CN115016867B (zh) * 2021-09-15 2023-07-14 荣耀终端有限公司 一种卡片管理方法和终端设备
CN113891160B (zh) * 2021-09-22 2024-02-13 百果园技术(新加坡)有限公司 内容卡片的滑动切换方法、装置、终端及存储介质
CN114138139B (zh) * 2021-10-28 2022-11-01 荣耀终端有限公司 应用程序卡片的管理方法、电子设备及介质
CN114721761B (zh) * 2022-04-15 2023-09-19 青岛海信移动通信技术有限公司 一种终端设备、应用图标管理方法和存储介质
CN117008788A (zh) * 2022-04-29 2023-11-07 荣耀终端有限公司 一种替换应用卡片的方法及终端设备
CN116088724A (zh) * 2022-05-19 2023-05-09 荣耀终端有限公司 卡片显示方法和电子设备
CN116820320A (zh) * 2022-07-20 2023-09-29 深圳市星卡软件技术开发有限公司 汽车诊断设备手势智能监听方法、装置、设备及介质
CN114968018B (zh) * 2022-07-26 2022-12-16 荣耀终端有限公司 卡片显示方法、终端设备
CN116521039B (zh) * 2023-04-28 2024-04-02 重庆赛力斯凤凰智创科技有限公司 被覆盖视图的移动方法、装置、电子设备及可读存储介质
CN116627293A (zh) * 2023-07-26 2023-08-22 荣耀终端有限公司 一种桌面内容整理方法及装置

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103558958A (zh) * 2013-10-29 2014-02-05 宇龙计算机通信科技(深圳)有限公司 应用程序的功能调用方法及终端
US20140068518A1 (en) * 2011-10-28 2014-03-06 Tencent Technology (Shenzhen) Company Limited Method and device for switching application program of touch screen terminal
CN105677183A (zh) * 2016-01-08 2016-06-15 努比亚技术有限公司 一种实现信息查看的方法及终端
CN106775192A (zh) * 2016-11-18 2017-05-31 上海传英信息技术有限公司 移动终端及其单手操作方法
CN106775814A (zh) * 2016-11-18 2017-05-31 上海传英信息技术有限公司 移动终端及其操作方法
CN111966251A (zh) * 2020-02-11 2020-11-20 华为技术有限公司 卡片显示方法、电子设备及计算机可读存储介质

Family Cites Families (31)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9032325B2 (en) * 2001-06-08 2015-05-12 Real Enterprise Solutions Development B.V. Management of local applications in local and remote desktops in a server-based computing environment
US7426697B2 (en) * 2005-01-18 2008-09-16 Microsoft Corporation Multi-application tabbing system
JP4653561B2 (ja) * 2005-05-31 2011-03-16 株式会社東芝 情報処理装置および表示制御方法
KR20080073868A (ko) * 2007-02-07 2008-08-12 엘지전자 주식회사 단말기 및 메뉴표시방법
US9026938B2 (en) * 2007-07-26 2015-05-05 Noregin Assets N.V., L.L.C. Dynamic detail-in-context user interface for application access and content access on electronic displays
CN102193719A (zh) * 2010-03-15 2011-09-21 联想(北京)有限公司 显示方法及显示终端
US20120084644A1 (en) * 2010-09-30 2012-04-05 Julien Robert Content preview
KR101729523B1 (ko) * 2010-12-21 2017-04-24 엘지전자 주식회사 휴대 단말기 및 그 동작 제어방법
KR20130052753A (ko) * 2011-08-16 2013-05-23 삼성전자주식회사 터치스크린을 이용한 어플리케이션 실행 방법 및 이를 지원하는 단말기
TWI475470B (zh) * 2011-09-07 2015-03-01 Acer Inc 電子裝置及應用程式操作方法
CN102722588A (zh) * 2012-06-14 2012-10-10 北京小米科技有限责任公司 一种文件浏览的方法、装置及电子终端
US20150058796A1 (en) * 2013-08-23 2015-02-26 General Electric Company Navigation control for a tabletop computer system
US9798443B1 (en) * 2013-09-10 2017-10-24 Amazon Technologies, Inc. Approaches for seamlessly launching applications
CN105468612A (zh) * 2014-09-01 2016-04-06 深圳富泰宏精密工业有限公司 辅助浏览系统及方法
CN104598109A (zh) * 2015-01-08 2015-05-06 天津三星通信技术研究有限公司 在便携式终端预览应用程序的方法和设备
CN105808095A (zh) * 2015-07-08 2016-07-27 维沃移动通信有限公司 一种终端的应用界面的显示方法及终端
US9880735B2 (en) * 2015-08-10 2018-01-30 Apple Inc. Devices, methods, and graphical user interfaces for manipulating user interface objects with visual and/or haptic feedback
US10540435B2 (en) * 2015-11-02 2020-01-21 Microsoft Technology Licensing, Llc Decks, cards, and mobile UI
CN106227404A (zh) * 2016-07-15 2016-12-14 乐视控股(北京)有限公司 一种显示方法和装置
CN106598394A (zh) * 2016-12-13 2017-04-26 努比亚技术有限公司 移动终端及应用信息显示方法
KR101925691B1 (ko) * 2016-12-23 2018-12-05 김경혜 어플리케이션 삭제에 대한 보호 기능을 활성화하는 방법 및 디바이스
WO2018184154A1 (en) * 2017-04-05 2018-10-11 Microsoft Technology Licensing, Llc Desktop launcher
CN107665162B (zh) * 2017-10-18 2021-05-28 维沃移动通信有限公司 一种应用程序处理方法及移动终端
CN108089786B (zh) * 2017-12-14 2019-12-31 Oppo广东移动通信有限公司 用户界面显示方法、装置、设备及存储介质
CN114153356A (zh) * 2018-12-24 2022-03-08 华为终端有限公司 消息处理方法及电子设备
CN109814972B (zh) * 2019-01-28 2021-04-09 维沃移动通信有限公司 界面显示方法及终端
CN110032307A (zh) * 2019-02-26 2019-07-19 华为技术有限公司 一种应用图标的移动方法及电子设备
CN110262877B (zh) * 2019-04-30 2022-05-13 华为技术有限公司 一种卡片处理方法及设备
CN110333814A (zh) * 2019-05-31 2019-10-15 华为技术有限公司 一种分享内容的方法及电子设备
CN116723266A (zh) * 2019-07-31 2023-09-08 华为技术有限公司 一种悬浮窗口的管理方法及相关装置
CN110647274A (zh) * 2019-08-15 2020-01-03 华为技术有限公司 一种界面显示方法及设备

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20140068518A1 (en) * 2011-10-28 2014-03-06 Tencent Technology (Shenzhen) Company Limited Method and device for switching application program of touch screen terminal
CN103558958A (zh) * 2013-10-29 2014-02-05 宇龙计算机通信科技(深圳)有限公司 应用程序的功能调用方法及终端
CN105677183A (zh) * 2016-01-08 2016-06-15 努比亚技术有限公司 一种实现信息查看的方法及终端
CN106775192A (zh) * 2016-11-18 2017-05-31 上海传英信息技术有限公司 移动终端及其单手操作方法
CN106775814A (zh) * 2016-11-18 2017-05-31 上海传英信息技术有限公司 移动终端及其操作方法
CN111966251A (zh) * 2020-02-11 2020-11-20 华为技术有限公司 卡片显示方法、电子设备及计算机可读存储介质

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114327195A (zh) * 2022-02-15 2022-04-12 荣耀终端有限公司 卡片管理方法、设备及存储介质

Also Published As

Publication number Publication date
CN111966251A (zh) 2020-11-20
CN114911380B (zh) 2024-04-09
DE202021004106U1 (de) 2022-11-17
CN111966251B (zh) 2021-08-13
CN114911380A (zh) 2022-08-16
US20230077467A1 (en) 2023-03-16
AU2021220808A1 (en) 2022-07-14
CN113508360B (zh) 2022-04-19
EP4068065A1 (en) 2022-10-05
JP2023513063A (ja) 2023-03-30
CN113849090A (zh) 2021-12-28
CN113508360A (zh) 2021-10-15
EP4068065A4 (en) 2023-01-25
KR20220110314A (ko) 2022-08-05
AU2021220808B2 (en) 2023-10-26
CN113849090B (zh) 2022-10-25
AU2024200478A1 (en) 2024-02-15

Similar Documents

Publication Publication Date Title
WO2021159922A1 (zh) 卡片显示方法、电子设备及计算机可读存储介质
WO2021164313A1 (zh) 界面布局方法、装置及系统
US10502580B2 (en) Method and apparatus for providing augmented reality function in electronic device
US11687235B2 (en) Split-screen method and electronic device
WO2021000881A1 (zh) 一种分屏方法及电子设备
CN111176506A (zh) 一种屏幕显示方法及电子设备
WO2022062898A1 (zh) 一种窗口显示方法及设备
EP3964937A1 (en) Method for generating user profile photo, and electronic device
WO2021063098A1 (zh) 一种触摸屏的响应方法及电子设备
EP4099669A1 (en) Method for creating application shortcuts, electronic device, and system
EP4280058A1 (en) Information display method and electronic device
US20230110015A1 (en) Application Information Display Method and Related Device
US20240077987A1 (en) Widget display method and electronic device
WO2023051511A1 (zh) 一种图标移动方法、相关图形界面及电子设备
WO2022213831A1 (zh) 一种控件显示方法及相关设备
US20240137438A1 (en) Information display method and electronic device
WO2023040775A1 (zh) 一种预览方法、电子设备及系统
WO2023160455A1 (zh) 删除对象的方法及电子设备
WO2022037408A1 (zh) 一种显示方法及电子设备
WO2023226922A1 (zh) 卡片管理方法、电子设备及计算机可读存储介质
WO2024067122A1 (zh) 一种窗口显示方法及电子设备
EP4270911A1 (en) Suspended ball processing method in multi-tasking scenario, and electronic device
CN116820288A (zh) 窗口控制方法、电子设备及计算机可读存储介质
CN117519564A (zh) 一种弹幕消息发布方法及装置
CN117631920A (zh) 一种数据选中方法及相关装置

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 21754479

Country of ref document: EP

Kind code of ref document: A1

ENP Entry into the national phase

Ref document number: 2021754479

Country of ref document: EP

Effective date: 20220628

ENP Entry into the national phase

Ref document number: 20227024343

Country of ref document: KR

Kind code of ref document: A

Ref document number: 2021220808

Country of ref document: AU

Date of ref document: 20210119

Kind code of ref document: A

ENP Entry into the national phase

Ref document number: 2022546526

Country of ref document: JP

Kind code of ref document: A

NENP Non-entry into the national phase

Ref country code: DE