WO2023236491A1 - 界面元素的显示方法、装置、电子设备及存储介质 - Google Patents

界面元素的显示方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
WO2023236491A1
WO2023236491A1 PCT/CN2022/139531 CN2022139531W WO2023236491A1 WO 2023236491 A1 WO2023236491 A1 WO 2023236491A1 CN 2022139531 W CN2022139531 W CN 2022139531W WO 2023236491 A1 WO2023236491 A1 WO 2023236491A1
Authority
WO
WIPO (PCT)
Prior art keywords
interface
folder
interface element
size
elements
Prior art date
Application number
PCT/CN2022/139531
Other languages
English (en)
French (fr)
Inventor
付琪
Original Assignee
Oppo广东移动通信有限公司
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 Oppo广东移动通信有限公司 filed Critical Oppo广东移动通信有限公司
Publication of WO2023236491A1 publication Critical patent/WO2023236491A1/zh

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/10File systems; File servers
    • G06F16/16File or folder operations, e.g. details of user interfaces specifically adapted to file systems
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/10File systems; File servers
    • G06F16/16File or folder operations, e.g. details of user interfaces specifically adapted to file systems
    • G06F16/168Details of user interfaces specifically adapted to file systems, e.g. browsing and visualisation, 2d or 3d GUIs
    • 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
    • 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
    • G06F3/0486Drag-and-drop
    • 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

Definitions

  • the present application relates to the technical field of electronic equipment, and in particular to a display method, device, electronic equipment and storage medium for interface elements.
  • interface elements such as widgets, application icons, etc.
  • Embodiments of the present application provide a display method, device, electronic device, and storage medium for interface elements, which can realize flexible addition of interface elements and meet user needs.
  • the first aspect of the embodiment of the present application provides a method for displaying interface elements, including:
  • the size of the second interface element of the element folder after the addition of the first interface element changes, so that the size of the element folder before the addition of the first interface element is different from the size of the second interface element after the addition of the first interface element.
  • the sizes behind an interface element are the same and are filled with interface elements.
  • the second interface element is part or all of the interface elements in the folder before adding the first interface element.
  • the second aspect of the embodiment of the present application provides a display device for interface elements, including:
  • a display unit configured to add the first interface element to the element folder in response to an adding operation for the first interface element
  • the size of the second interface element of the element folder after the addition of the first interface element changes, so that the size of the element folder before the addition of the first interface element is different from the size of the second interface element after the addition of the first interface element.
  • the sizes behind an interface element are the same and are filled with interface elements.
  • the second interface element is part or all of the interface elements in the folder before adding the first interface element.
  • the third aspect of the embodiment of the present application provides an electronic device, including:
  • Memory that stores executable program code
  • the processor calls the executable program code stored in the memory.
  • the processor implements the method described in the first aspect of the embodiment of the present application. .
  • the fourth aspect of the embodiment of the present application provides a computer-readable storage medium on which executable program code is stored.
  • executable program code When the executable program code is executed by a processor, the method described in the first aspect of the embodiment of the present application is implemented. .
  • the fifth aspect of the embodiment of the present application discloses a computer program product.
  • the computer program product When the computer program product is run on a computer, it causes the computer to execute any of the methods disclosed in the first aspect of the embodiment of the present application.
  • the sixth aspect of the embodiment of the present application discloses an application publishing platform.
  • the application publishing platform is used to publish computer program products.
  • the computer program product is run on a computer, the computer is caused to execute the disclosure of the first aspect of the embodiment of the present application. any of the above methods.
  • the first interface element in response to the adding operation of the first interface element, the first interface element is added to the element folder; wherein the size of the second interface element of the element folder after the first interface element is added changes. Change so that the size of the element folder before adding the first interface element is the same as the size after adding the first interface element, and both are filled with interface elements.
  • the second interface element is in the folder before adding the first interface element.
  • the first interface element can be successfully added to the element folder without changing the size of the element folder, and it can also ensure that the element folder is always filled with interface elements. .
  • the flexibility of adding interface elements is improved, the desktop layout is optimized, and user needs are further satisfied.
  • Figure 1 is a schematic diagram of a scene disclosed in the embodiment of the present application.
  • Figure 2A is a schematic flowchart of a method for displaying interface elements disclosed in an embodiment of the present application
  • Figure 2B is an illustration of adding interface elements disclosed in the embodiment of the present application.
  • Figure 3 is a schematic flowchart of a method for displaying interface elements disclosed in an embodiment of the present application
  • Figure 4A is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • Figure 4B is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • Figure 4C is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • Figure 4D is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • Figure 5A is a diagram of an element folder disclosed in an embodiment of the present application.
  • Figure 5B is another diagram of the element folder disclosed in the embodiment of the present application.
  • Figure 5C is another diagram of the element folder disclosed in the embodiment of the present application.
  • Figure 5D is a diagram after performing an exchange operation on the element folder shown in Figure 5C;
  • Figure 5E is another diagram after performing the exchange operation on the element folder shown in Figure 5C;
  • Figure 5F is an illustration of performing a move operation on an element folder
  • Figure 6 is a schematic flowchart of another method for displaying interface elements disclosed in the embodiment of the present application.
  • Figure 7A is an illustration of removal of interface elements disclosed in the embodiment of the present application.
  • Figure 7B is another illustration of the removal of interface elements disclosed in the embodiment of the present application.
  • Figure 7C is another illustration of the removal of interface elements disclosed in the embodiment of the present application.
  • Figure 7D is another diagram showing the removal of interface elements disclosed in the embodiment of the present application.
  • Figure 8 is a schematic structural diagram of a display device for interface elements disclosed in an embodiment of the present application.
  • Figure 9 is a structural block diagram of the electronic device disclosed in the embodiment of the application.
  • Embodiments of the present application provide a display method, device, electronic device, and storage medium for interface elements, which can realize flexible addition of interface elements to meet user needs.
  • the electronic devices involved in the embodiments of the present application may include general handheld screen electronic devices, such as mobile phones, smart phones, portable terminals, terminals, personal digital assistants (Personal Digital Assistant, PDA), portable multimedia Player (Personal Media Player, PMP) device, notebook computer, notebook (Note Pad), wireless broadband (Wireless Broadband, Wibro) terminal, tablet computer (Personal Computer, PC), smart PC, point of sales terminal (Point of Sales, POS ) and vehicle-mounted computers, etc.
  • PDA Personal Digital Assistant
  • PMP portable multimedia Player
  • PMP Portable Multi Player
  • notebook computer notebook (Note Pad)
  • wireless broadband Wireless Broadband, Wibro
  • tablet computer Personal Computer
  • smart PC point of sales terminal
  • Point of Sales Point of Sales, POS
  • vehicle-mounted computers etc.
  • Electronic devices may also include wearable devices.
  • a wearable device can be worn directly on the user, or it can be a portable electronic device integrated into the user's clothing or accessories.
  • Wearable devices are not just hardware devices. They can also achieve powerful intelligent functions through software support, data interaction, and cloud server interaction, such as computing functions, positioning functions, and alarm functions. They can also be connected to mobile phones and various terminals.
  • Wearable devices may include, but are not limited to, watches supported by the wrist (such as watches, wrist products, etc.), shoes supported by the feet (such as shoes, socks, or other products worn on the legs), and devices supported by the head. Glass (such as glasses, helmets, headbands, etc.) and various non-mainstream product forms such as smart clothing, school bags, crutches, and accessories.
  • Widget refers to a widget that can execute code on any Web (World Wide Web) page based on HTLM (HyperText Markup Language).
  • Widgets usually exist attached to corresponding applications, and the functions carried by widgets are closely related to the functions of the corresponding application.
  • widgets can be presented in card style.
  • FIG. 1 is a schematic diagram of a scenario disclosed in an embodiment of the present application.
  • the scene diagram shown in FIG. 1 includes an electronic device 10 that adapts the size of a second interface element in an element folder on the desktop of the electronic device 10 in response to an adding operation for a first interface element. Adjustment can add the first interface element to the element folder without changing the size of the element folder. It can also ensure that the element folder is always filled with interface elements, which improves the flexibility of adding interface elements and optimizes the desktop layout. , to further meet user needs.
  • FIG. 2A is a schematic flowchart of a method for displaying interface elements disclosed in an embodiment of the present application.
  • the method of displaying interface elements as shown in Figure 2A may include the following steps:
  • the first interface element In response to the adding operation of the first interface element, add the first interface element to the element folder; wherein the size of the second interface element of the element folder after the first interface element is added changes, so that the element
  • the size of the folder before adding the first interface element is the same as the size after adding the first interface element, and both are filled with interface elements.
  • the second interface element is part or all of the interface in the folder before adding the first interface element. element.
  • Interface elements refer to a series of elements included in the system interface that meet user interaction requirements. Interface elements may include but are not limited to one or more of widgets, application icons, etc.
  • the first interface element can be any interface element on the desktop of the electronic device, and the adding operation for the first interface element can be triggered by a voice operation, a gesture operation, a touch operation, etc., which are not limited in the embodiments of this application.
  • the adding operation for the first interface element may be to move the first interface element to the display position of other interface elements.
  • the above element folder may be automatically generated by the electronic device in response to an adding operation for the first interface element.
  • FIG. 2B is an illustration of adding interface elements disclosed in the embodiment of the present application.
  • the left picture in FIG. 2B shows the desktop 11 of the electronic device before responding to the adding operation of the first interface element.
  • the desktop 11 includes a 4 ⁇ 2 interface element 2 and a 4 ⁇ 2 interface element 1.
  • the right picture in Figure 2B shows the desktop 11 of the electronic device after responding to the adding operation for the first interface element.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and a 2 ⁇ 2 element folder 12. interface element 2 and 2 ⁇ 2 interface element 1.
  • the above-mentioned element folder can be any one of the element folders currently displayed on the desktop of the electronic device, and the above-mentioned element folder can be selected by the user from among the element folders currently displayed on the desktop of the electronic device, and further The electronic device can automatically select from the element folder currently displayed on the desktop of the electronic device, which is not limited by the embodiment of the present application.
  • the user's operation of autonomously selecting the above element folder may include but is not limited to voice operation, or a selection operation for any element folder displayed on the desktop of the electronic device, etc.
  • Example 1 After the user long-presses the first interface element, the first interface element is in the dragging state.
  • the element folder corresponding to the position when the first interface element stops dragging is the element to be added to the first interface element. folder.
  • Example 2 After the user long-presses the first interface element, a folder list pops up.
  • the folder list can display the folder identifiers of the element folders to which the first interface element can be added. The user then determines by clicking on any folder identifier.
  • the folder identifier can include any of the following: numbers, letters, and special characters.
  • the first interface element is added to the element folder, which may include : In response to the adding operation of the first interface element, determine the element folder corresponding to the first interface element, and add the first interface element to the element folder.
  • determining the element folder corresponding to the first interface element may include: determining the application category corresponding to the first interface element, and using the element folder associated with the application category as the element file corresponding to the first interface element. folder.
  • the application category corresponding to the first interface element refers to the application category of the application program associated with the first interface element. If the first interface element is an application icon, the application category corresponding to the first interface element refers to the application category of the application program corresponding to the application icon.
  • the user only needs to trigger the adding operation for the first interface element, and the electronic device can automatically determine the element folder corresponding to the first interface element, The first interface element is added to the determined element folder, and the element folder in which the first interface element is added is displayed, which greatly improves the convenience of adding interface elements.
  • the size of the first interface element in the element folder may be the same as or different from the size outside the element folder, which is not limited in the embodiments of this application.
  • the first interface element can be successfully added to the element folder without changing the size of the element folder, and it can also ensure that the element folder is always Filled with interface elements, it improves the flexibility of adding interface elements, optimizes the desktop layout, and further meets user needs.
  • Figure 3 is a schematic flowchart of a method for displaying interface elements disclosed in an embodiment of the present application.
  • the method for displaying interface elements shown in Figure 3 may include the following steps:
  • the first display parameter includes the size of the element folder and the number of first elements.
  • the first number of elements is the number of elements contained in the element folder. The sum of the number of interface elements and the first interface element.
  • the electronic device can associate and store the size of the element folder and the number of interface elements it contains with the folder identifier of the element folder. Among them, the number of interface elements contained in the element folder can be updated in real time.
  • the electronic device can obtain the size of the element folder and the number of interface elements it contains based on the folder identification of the element folder.
  • the second interface element in the element folder determines the second interface element in the element folder and the first adjustment size corresponding to each second interface element.
  • each second interface element is displayed according to the corresponding first adjustment size.
  • each second interface element corresponds to its own first adjustment size.
  • determining the second interface element in the element folder and the first adjustment size corresponding to each second interface element according to the first display parameter may include: determining to add the first interface according to the first display parameter.
  • the electronic device may be preset with multiple layout style sets. Different layout style sets correspond to element folders of different sizes, and different layout styles in each layout style set correspond to different numbers of interface elements.
  • determining the first layout style of the element folder after adding the first interface element according to the first display parameter may include: determining a target layout style set that matches the size of the element folder from multiple layout style sets. , and use the layout style in the target layout style collection that matches the number of the first elements of the element folder as the first layout style of the element folder after adding the first interface element.
  • both interface elements are 2 ⁇ 2;
  • FIG. 4A is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 4A shows the desktop 11 before adding interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, 2 ⁇ 2 interface elements 2 and 2 ⁇ 2 in the element folder 12. interface element 3, and interface element 1 outside element folder 12.
  • the right picture in Figure 4A shows the desktop 11 after adding the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 2 interface element 2 and a 2 ⁇ 1 element folder 12. Interface element 3 and 2 ⁇ 1 interface element 1.
  • FIG. 4B is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 4B shows the desktop 11 before adding interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 2 interface element 2 and a 2 ⁇ 1 element folder 12. Interface element 3 and 2 ⁇ 1 interface element 4.
  • the right picture in Figure 4B shows the desktop 11 after adding the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 2 interface element 2 and a 2 ⁇ 1 element folder 12.
  • Figure 4C is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 4C shows the desktop 11 before adding interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 2 interface element 2 and a 2 ⁇ 1 element folder 12.
  • the right picture in Figure 4C shows the desktop 11 after adding the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 2 interface element 2 and a 1 ⁇ 1 element folder 12.
  • the element folder when the number of interface elements contained in the element folder is greater than or equal to the quantity threshold, the element folder may include a first area and a second area.
  • the quantity threshold can be set independently by the user or automatically set by the electronic device, which is not limited in the embodiments of this application.
  • the corresponding quantity threshold for a 4 ⁇ 2 element folder is 2.
  • the first display parameter may also include the size of the first area, and the total number of interface elements and first interface elements contained in the first area.
  • determining the second interface element in the element folder and the first adjustment size corresponding to each second interface element according to the first display parameter may include: determining the first area of the element folder according to the first display parameter. The second interface element in and the first resize corresponding to each second interface element.
  • the number of layout styles in the target layout style set that matches the number of first elements in the element folder may be multiple, and the size and/or size of the first area corresponding to different layout styles The number of interface elements within is different.
  • determining the second interface element in the first area of the element folder and the first adjustment size corresponding to each second interface element according to the first display parameter may include: according to the size of the element folder, and the element file The sum of the number of interface elements and first interface elements contained in the folder is used to obtain multiple layout styles that match the number of first elements in the element folder; according to the size of the first area, the interface elements of the first area and the first interface The sum of the number of elements, from the multiple layout styles that match the number of first elements in the element folder, determines the second layout style of the element folder after adding the first interface element; according to the second layout style and adding the first interface The layout style of the element folder before the element determines the second interface element in the first area of the element folder and the first adjustment size corresponding to each second interface element.
  • the size of the first region may be greater than or equal to the size of the second region.
  • the layout style of the 4 ⁇ 2 element folder is 2 ⁇ 2
  • the two interface elements are in the first area and the second area respectively;
  • one 2 ⁇ 2 interface element is in the second area, and two 2 ⁇ 1 interface elements are in the first area;
  • one 2 ⁇ 2 interface element is in the second area, one 2 ⁇ 1 interface element and two 1 ⁇ 1 interface elements are in the first area;
  • Figure 4D is another diagram of adding interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 4D shows the desktop 11 before adding the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and a 2 ⁇ 2 interface element 3 located in the first area 121 of the element folder 12. , the 2 ⁇ 2 interface element 2 located in the second area 122 of the element folder 12 , and the interface element 1 located outside the element folder 12 .
  • the right picture in Figure 4D shows the desktop 11 after adding the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, a 2 ⁇ 1 interface element 3 in the first area 121, and a 2 ⁇ 1 interface element 3 in the first area 121.
  • the element folder may include a display area and an operable area.
  • the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions.
  • the operable area includes interactive interfaces. element. It should be noted that interface elements without interactive functions refer to interface elements without interactive controls, and interface elements with disabled interactive functions refer to interface elements whose interactive controls are prohibited from operating.
  • the size of the interface elements in the display area is smaller than or equal to the size of the interface elements in the operable area, which helps the user to accurately operate the interface elements in the operable area and helps reduce the risk of users accidentally touching the micro-touch screen. probability of occurrence.
  • the first area may be a display area and the second area may be an operable area.
  • interface elements within an element folder may include widgets.
  • FIG. 5A is a diagram of an element folder disclosed in an embodiment of the present application.
  • the element folder shown in FIG. 5A includes a first area 121 and a second area 122.
  • the first area 121 is a display area
  • the second area 122 is an operable area.
  • the second area 122 includes a 2 ⁇ 2 widget 1
  • the first area 121 includes a 1 ⁇ 1 widget 2, a 1 ⁇ 1 widget 3, a 1 ⁇ 1 widget 4, and a 1 ⁇ 1 widget 5.
  • FIG. 5B is another diagram of an element folder disclosed in an embodiment of the present application.
  • the element folder shown in FIG. 5B includes a first area 121 and a second area 122.
  • the first area 121 is a display area
  • the second area 122 is an operable area.
  • the second area 122 includes 2 ⁇ 2 widgets 1
  • the first area 121 includes 2 ⁇ 2 widgets 2.
  • FIG. 5C is another diagram of an element folder disclosed in an embodiment of the present application.
  • the element folder shown in FIG. 5B includes a first area 121 and a second area 122.
  • the first area 121 is a display area
  • the second area 122 is an operable area.
  • the second area 122 includes a 2 ⁇ 2 widget 1
  • the first area 121 includes a 2 ⁇ 1 widget 2, a 1 ⁇ 1 widget 3, and a 1 ⁇ 1 widget 4.
  • the third interface element in response to the exchange operation of the third interface element and the fourth interface element in the element folder, the third interface element is switched from the first position to the second position for display, and the fourth interface element is Switch the display from the second position to the first position.
  • the third interface element and the fourth interface element are any two interface elements in the element folder.
  • the sizes of the third interface element and the fourth interface element may be the same or different, which are not limited in the embodiments of this application.
  • the sizes of the third interface element and the fourth interface element may or may not change. Changes are not limited by the embodiments of this application.
  • the third interface element is switched from the first position to the second position for display
  • the fourth interface element is switched from the second position to the first position for display.
  • the display may include: switching the third interface element from the first position to the second position for display according to the first size, and switching the fourth interface element from the second position to the first position for display according to the second size; wherein, the The first size is the size of the fourth interface element when it is displayed in the second position, and the second size is the size of the third interface element when it is displayed in the first position.
  • the exchange operation for the third interface element and the fourth interface element in the element folder may include but is not limited to voice operation or touch operation.
  • the exchange operation may include the user clicking the third interface element and the fourth interface element successively, or the user dragging the third interface element to the location of the fourth interface element.
  • the situation in the area where the first position and the second position are located may include: both the first position and the second position are in The operable area; the first position and the second position are both in the display area; the first position and the second position are in the operable area and the display area respectively.
  • the first size when the interface element is a widget, when both the first position and the second position are in the display area, or when both the first position and the second position are in the operable area, the first size can be the same as that of the widget.
  • the second size is different.
  • the same widget of different sizes can present different amounts of information. The larger the size, the greater the amount of information that can be presented.
  • the third interface element is widget 2 in Figure 5C and the fourth interface element is widget 3 in Figure 5C, then in response to the element folder after the exchange operation for widget 2 and widget 3 As shown in Figure 5D.
  • the user may also respond to the request for the third interface element.
  • the interactive operation of three interface elements outputs the functional information corresponding to the third interface element.
  • the user can exchange the interface element originally in the display area to the operable area by triggering the exchange operation of any two interface elements in different areas, so that the interface element can be changed from prohibited interaction to interactive.
  • the third interface element is widget 2 in Figure 5A
  • the fourth interface element is widget 1 in Figure 5C.
  • the element folder after responding to the exchange operation for widget 1 and widget 2 is as shown in the figure As shown in 5E.
  • the element folder in response to a move operation for the element folder, may be moved from a current location on the desktop to a third location indicated by the move operation. It should be noted that the size of the element folder remains unchanged during the movement of the element folder.
  • the move operation for the element folder may be a drag operation for the element folder, and the third position indicated by the move operation refers to the position where the drag of the element folder stops.
  • Figure 5F is a moving diagram of the element folder disclosed in the embodiment of the present application.
  • the first adjustment size corresponding to the second interface element in the element folder is determined according to the first display parameter of the element folder, and in the process of adding the first interface element to the element folder, the first adjustment size is determined according to the corresponding third interface element. Adjust the size to adjust the size of the second interface element, which can realize flexible adjustment of the size of the second interface element in the element folder.
  • FIG. 6 is a schematic flowchart of another method for displaying interface elements disclosed in an embodiment of the present application.
  • the display method of interface elements as shown in Figure 6 may include the following steps:
  • the size of the sixth interface element of the element folder after the fifth interface element is removed Change so that the size of the element folder before removing the fifth interface element is the same as the size after removing the fifth interface element, and both are filled with interface elements.
  • the sixth interface element is the same as the size after removing the fifth interface element.
  • the second adjustment size corresponding to the sixth interface element can be obtained according to the second display parameter of the element folder after adding the first interface element.
  • the second display parameter includes the size of the element folder and the size of the element folder after adding the first interface element. The total number of interface elements in the element folder after an interface element except the fifth interface element.
  • FIG. 7A is an illustration of the removal of interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 7A shows the desktop 11 before interface element 1 is removed.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, and 2 ⁇ 2 interface elements 1 and 2 ⁇ located in the element folder 12. 2 interface elements 2.
  • the right picture in FIG. 7A shows the desktop 11 after removing the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 interface element 2 and a 4 ⁇ 2 interface element 1.
  • FIG. 7B is another diagram showing the removal of interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 7B shows the desktop 11 before interface element 1 is removed.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and 2 ⁇ 1 interface elements 1 and 2 ⁇ in the element folder 12. Interface element 2 for 1 and interface element 3 for 2 ⁇ 2.
  • the right picture in Figure 7B shows the desktop 11 after removing the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, 2 ⁇ 2 interface elements 2 and 2 ⁇ 2 located in the element folder 12. interface element 3, and interface element 1 outside element folder 12.
  • FIG. 7C is another diagram showing the removal of interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 7C shows the desktop 11 before interface element 1 is removed.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and 1 ⁇ 1 interface elements 1 and 1 ⁇ in the element folder 12.
  • Interface element 2 for 1, interface element 3 for 2 ⁇ 1, and interface element 4 for 2 ⁇ 2.
  • the right picture in Figure 7C shows the desktop 11 after removing the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and 2 ⁇ 1 interface elements 2 and 2 ⁇ 1 in the element folder 12.
  • the interface element 3 and the 2 ⁇ 2 interface element 4 and the interface element 1 outside the element folder 12.
  • FIG. 7D is another illustration of the removal of interface elements disclosed in the embodiment of the present application.
  • the left picture in Figure 7D shows the desktop 11 before interface element 1 is removed.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12 and 1 ⁇ 1 interface elements 1 and 1 ⁇ in the element folder 12.
  • the right picture in Figure 7D shows the desktop 11 after removing the interface element 1.
  • the desktop 11 includes a 4 ⁇ 2 element folder 12, and 2 ⁇ 2 interface elements 5 and 2 ⁇ 1 located in the element folder 12.
  • the first interface element when adding the first interface element, by adaptively adjusting the size of the second interface element of the element folder, the first interface element can be successfully added to the element folder without changing the size of the element folder. , it can also ensure that the element folder is always filled with interface elements, improves the flexibility of adding interface elements, optimizes the desktop layout, and further meets user needs.
  • the size of the sixth interface element in the element folder can be adaptively adjusted to ensure that the element folder after removing the fifth interface element not only remains unchanged in size, but also can It is still filled with interface elements, further optimizing the desktop layout.
  • FIG. 8 is a schematic structural diagram of a display device for interface elements disclosed in an embodiment of the present application.
  • the device shown in FIG. 8 includes a display unit 801.
  • the display unit 801 is configured to add the first interface element to the element folder in response to the adding operation of the first interface element; wherein the size of the second interface element of the element folder changes after the first interface element is added. , so that the size of the element folder before adding the first interface element is the same as the size after adding the first interface element, and both are filled with interface elements.
  • the second interface element is the part inside the folder before adding the first interface element. or all interface elements.
  • the display unit 801 is also configured to generate an element folder in response to an adding operation for the first interface element.
  • the display unit 801 is also used to obtain the first display parameter of the element folder.
  • the first display parameter includes the size of the element folder and the first number of elements.
  • the first number of elements is the number of elements contained in the element folder. The sum of the numbers of interface elements and first interface elements; and, according to the first display parameter, determine the second interface element in the element folder and the first adjustment size corresponding to each second interface element;
  • each second interface element is displayed according to the corresponding first adjustment size.
  • the element folder includes a first area and a second area
  • the first display parameter also includes the size of the first area, and the total number of interface elements and first interface elements contained in the first area
  • the display unit 801 is configured to determine the second interface element in the element folder and the first adjustment method corresponding to each second interface element according to the first display parameter. Specifically, the display unit 801 is configured to determine the second interface element in the element folder and the first adjustment method corresponding to each second interface element according to the first display parameter. Parameters that determine the second interface elements in the first area of the element folder and the first adjustment size corresponding to each second interface element.
  • the element folder includes a display area and an operable area.
  • the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions; and the operable area includes interactive interface elements.
  • the size of the interface elements in the display area is smaller than or equal to the size of the interface elements in the operable area.
  • interface elements within the element folder include widgets.
  • the display unit 801 is also configured to switch the third interface element from the first position to the second position for display in response to the exchange operation of the third interface element and the fourth interface element in the element folder,
  • the fourth interface element is switched from the second position to the first position for display; the third interface element and the fourth interface element are any two interface elements in the element folder.
  • the display unit 801 is used to switch the third interface element from the first position to the second position for display.
  • the method of switching the fourth interface element from the second position to the first position for display may specifically include: The display unit 801 is used to switch the third interface element from the first position to the second position according to the first size for display, and switch the fourth interface element from the second position to the first position according to the second size for display; wherein, The first size is the size of the fourth interface element when it is displayed at the second position, and the second size is the size of the third interface element when it is displayed at the first position.
  • the element folder includes a display area and an operable area; the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions; and the operable area includes interactive interface elements.
  • the first position is in the display area, and the second position is in the operable area.
  • the display unit 801 is also configured to, after switching the third interface element from the first position to the second position for display according to the first size, in response to the interactive operation on the third interface element, output the corresponding information of the third interface element. Functional information.
  • the element folder includes a display area and an operable area; the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions; and the operable area includes interactive interface elements. Both the first position and the second position are in the display area.
  • the display unit 801 is also configured to display the fifth interface element outside the element folder in response to the removal operation of the fifth interface element in the element folder; wherein, after the fifth interface element is removed
  • the size of the sixth interface element of the element folder is changed, so that the size of the element folder before removing the fifth interface element is the same as the size after removing the fifth interface element, and both are filled with interface elements.
  • the sixth interface element is part or all of the interface elements in the folder before the fifth interface element is removed.
  • FIG. 9 is a structural block diagram of an electronic device disclosed in an embodiment of the application.
  • the electronic device shown in FIG. 9 can have a processor 901 and a memory 902 coupled to the processor 901, where the memory 902 can store one or more computer programs.
  • Processor 901 may include one or more processing cores.
  • the processor 901 uses various interfaces and lines to connect various parts of the entire electronic device, and executes electronic devices by running or executing instructions, programs, code sets or instruction sets stored in the memory 902, and calling data stored in the memory 902.
  • Various functions of the device and processing data can use at least one of digital signal processing (Digital Signal Processing, DSP), field-programmable gate array (Field-Programmable Gate Array, FPGA), and programmable logic array (Programmable Logic Array, PLA).
  • DSP Digital Signal Processing
  • FPGA field-programmable Gate Array
  • PLA programmable logic array
  • the processor 901 may integrate one or a combination of a central processing unit (Central Processing Unit, CPU), a graphics processor (Graphics Processing Unit, GPU), a modem, etc.
  • CPU Central Processing Unit
  • GPU Graphics Processing Unit
  • modem etc.
  • the CPU mainly handles the operating system, user interface, and applications; the GPU is responsible for rendering and drawing the display content; and the modem is used to handle wireless communications. It can be understood that the above-mentioned modem may not be integrated into the processor 901 and may be implemented solely through a communication chip.
  • the memory 902 may include random access memory (RAM) or read-only memory (Read-Only Memory, ROM). Memory 902 may be used to store instructions, programs, codes, sets of codes, or sets of instructions.
  • the memory 902 may include a program storage area and a data storage area, where the program storage area may store instructions for implementing an operating system and instructions for implementing at least one function (such as a touch function, a sound playback function, an image playback function, etc.) , instructions for implementing each of the above method embodiments, etc.
  • the storage data area can also store data created during use of the electronic device, etc.
  • the processor 901 also has the following functions:
  • the first interface element is added to the element folder; wherein the size of the second interface element of the element folder after the first interface element is added changes, so that the element folder
  • the size before adding the first interface element is the same as the size after adding the first interface element, and both are filled with interface elements.
  • the second interface element is part or all of the interface elements in the folder before the first interface element is added.
  • the processor 901 also has the following functions:
  • an element folder is generated.
  • the processor 901 also has the following functions:
  • the first display parameter includes the size of the element folder and the number of first elements.
  • the number of first elements is the sum of the number of interface elements and first interface elements contained in the element folder; and, According to the first display parameter, determine the second interface element in the element folder and the first adjustment size corresponding to each second interface element; wherein, in the element folder after adding the first interface element, each second interface element The element is displayed according to the corresponding first resize.
  • the element folder includes a first area and a second area
  • the first display parameter also includes the size of the first area, and the total number of interface elements and first interface elements contained in the first area
  • Processor 901 also has the following functions:
  • the second interface element in the first area of the element folder and the first adjustment size corresponding to each second interface element are determined.
  • the element folder includes a display area and an operable area.
  • the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions;
  • the operable area includes interactive interface elements. .
  • the size of the interface elements in the display area is smaller than or equal to the size of the interface elements in the operable area.
  • the interface elements in the element folder include widgets.
  • the processor 901 also has the following functions:
  • the third interface element is switched from the first position to the second position for display, and the fourth interface element is switched from the second position to the first position.
  • the third interface element and the fourth interface element are any two interface elements in the element folder.
  • the processor 901 also has the following functions:
  • the third interface element is switched from the first position to the second position according to the first size for display, and the fourth interface element is switched from the second position to the first position according to the second size for display; wherein the first size is the fourth The size of the interface element when it is displayed in the second position, and the second size is the size of the third interface element when it is displayed in the first position.
  • the element folder includes a display area and an operable area;
  • the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions;
  • the operable area includes interactive interface elements.
  • the first position is in the display area, and the second position is in the operable area;
  • the processor 901 also has the following function: in response to the interactive operation on the third interface element, output the function information corresponding to the third interface element.
  • the element folder includes a display area and an operable area; the display area includes interface elements without interactive functions and/or interface elements with disabled interactive functions; and the operable area includes interactive interface elements.
  • the first position and the second position are both in the display area.
  • Processor 901 also has the following functions:
  • the fifth interface element In response to the removal operation of the fifth interface element in the element folder, the fifth interface element is displayed outside the element folder; wherein the size of the sixth interface element of the element folder changes after the fifth interface element is removed. , so that the size of the element folder before removing the fifth interface element is the same as the size after removing the fifth interface element, and both are filled with interface elements.
  • the sixth interface element is the file before the fifth interface element is removed.
  • Embodiments of the present application disclose a computer-readable storage medium that stores a computer program.
  • the computer program When executed by a processor, it causes the processor to implement some or all of the steps executed by the electronic device in the above embodiments.
  • the embodiment of the present application discloses a computer program product.
  • the computer program product When the computer program product is run on a computer, it causes the computer to execute some or all of the steps executed by the electronic device in the above embodiment.
  • Embodiments of the present application disclose an application publishing platform.
  • the application publishing platform is used to publish computer program products.
  • the computer program product is run on a computer, the computer is caused to execute some or all of the steps executed by the electronic device in the above embodiments.
  • a computer program product includes one or more computer instructions. When computer program instructions are loaded and executed on a computer, processes or functions according to embodiments of the present application are generated in whole or in part.
  • the computer may be a general purpose computer, a special purpose computer, a computer network, or other programmable device.
  • Computer instructions may be stored in or transmitted from one computer-readable storage medium to another computer-readable storage medium, e.g., computer instructions may be transmitted from a website, computer, server or data center via a wired link (e.g. Coaxial cable, optical fiber, digital subscriber line (DSL)) or wireless (such as infrared, wireless, microwave, etc.) means to transmit to another website site, computer, server or data center.
  • a wired link e.g. Coaxial cable, optical fiber, digital subscriber line (DSL)
  • wireless such as infrared, wireless, microwave, etc.
  • Computer-readable storage media can be any available media that a computer can store, or a data storage device such as a server or data center integrated with one or more available media.
  • Available media may be magnetic media (eg, floppy disk, magnetic disk, tape), optical media (eg, DVD), or semiconductor media (eg, Solid State Disk (SSD)), etc.
  • the disclosed systems, devices and methods can be implemented in other ways.
  • the device embodiments described above are only illustrative.
  • the division of units is only a logical function division. In actual implementation, there may be other division methods.
  • multiple units or components may be combined or integrated. to another system, or some features can be ignored, or not implemented.
  • the coupling or direct coupling or communication connection between each other shown or discussed may be through some interfaces, and the indirect coupling or communication connection of the devices or units may be in electrical, mechanical or other forms.
  • a unit described as a separate component may or may not be physically separate.
  • a component shown as a unit may or may not be a physical unit, that is, it may be located in one place, or it may be distributed to multiple network units. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of this embodiment.
  • each functional unit in each embodiment of the present application can be integrated into one processing unit, each unit can exist physically alone, or two or more units can be integrated into one unit.
  • the above integrated units can be implemented in the form of hardware or software functional units.
  • Integrated units may be stored in a computer-readable storage medium if they are implemented in the form of software functional units and sold or used as independent products.
  • the technical solution of the present application is essentially or contributes to the existing technology, or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a storage medium , including several instructions to cause a computer device (which may be a personal computer, a server, or a network device, etc.) to execute all or part of the steps of the methods of various embodiments of the present application.
  • the aforementioned storage media include: U disk, removable disk, read-only memory (ROM), random access memory (Random Access Memory, RAM), magnetic disk or optical disk and other media that can store program code. .

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Databases & Information Systems (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请实施例公开了一种界面元素的显示方法、装置、电子设备及存储介质,该方法包括:响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。通过实施该方法,可以实现界面元素的灵活添加,以满足用户需求。

Description

界面元素的显示方法、装置、电子设备及存储介质
本申请要求于2022年06月09日提交、申请号为202210658984.7、发明名称为“界面元素的显示方法、装置、电子设备及存储介质”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本申请涉及电子设备技术领域,尤其涉及一种界面元素的显示方法、装置、电子设备及存储介质。
背景技术
为节省电子设备(如手机、平板等)的桌面空间,多数电子设备大都支持界面元素(如微件、应用程序图标等)的集合,即将多个界面元素在一个元素文件夹中进行显示。
但在实践中发现,受限于元素文件夹的尺寸,通常存在界面元素无法成功添加到元素文件夹中的情况。可见,现有的界面元素的集合方法不够灵活,不能满足用户需求。
发明内容
本申请实施例提供了一种界面元素的显示方法、装置、电子设备及存储介质,可实现界面元素的灵活添加,满足用户需求。
本申请实施例第一方面提供了一种界面元素的显示方法,包括:
响应于针对第一界面元素的添加操作,将所述第一界面元素添加到元素文件夹中;
其中,添加所述第一界面元素后的所述元素文件夹的第二界面元素的尺寸发生变化,以使所述元素文件夹在添加所述第一界面元素前的尺寸,与添加所述第一界面元素后的尺寸相同,且均被界面元素填充满,所述第二界面元素为添加所述第一界面元素前所述文件夹内部分或全部的界面元素。
本申请实施例第二方面提供了一种界面元素的显示装置,包括:
显示单元,用于响应于针对第一界面元素的添加操作,将所述第一界面元素添加到元素文件夹中;
其中,添加所述第一界面元素后的所述元素文件夹的第二界面元素的尺寸发生变化,以使所述元素文件夹在添加所述第一界面元素前的尺寸,与添加所述第一界面元素后的尺寸相同,且均被界面元素填充满,所述第二界面元素为添加所述第一界面元素前所述文件夹内部分或全部的界面元素。
本申请实施例第三方面提供了一种电子设备,包括:
存储有可执行程序代码的存储器;
以及所述存储器耦合的处理器;
所述处理器调用所述存储器中存储的所述可执行程序代码,所述可执行程序代码被所述处理器执行时,使得所述处理器实现如本申请实施例第一方面所述的方法。
本申请实施例第四方面提供一种计算机可读存储介质,其上存储有可执行程序代码,所述可执行程序代码被处理器执行时,实现如本申请实施例第一方面所述的方法。
本申请实施例第五方面公开一种计算机程序产品,当该计算机程序产品在计算机上运行时,使得该计算机执行本申请实施例第一方面公开的任意一种所述的方法。
本申请实施例第六方面公开一种应用发布平台,该应用发布平台用于发布计算机程序产品,其中,当该计算机程序产品在计算机上运行时,使得该计算机执行本申请实施例第一方面公开的任意一种所述的方法。
从以上技术方案可以看出,本申请实施例具有以下优点:
在本申请实施例中,响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。
通过自适应调整元素文件夹的第二界面元素的尺寸,可以在不改变元素文件夹尺寸的同时,将第一界面元素成功添加至元素文件夹,还可以保证元素文件夹始终被界面元素填充满。通过实施该方法,提高了添加界面元素的灵活性,优化了桌面布局,进一步满足了用户需求。
附图说明
为了更清楚地说明本申请实施例技术方案,下面将对实施例和现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,还可以根据这些附图获得其它的附图。
图1是本申请实施例公开的一种场景示意图;
图2A是本申请实施例公开的一种界面元素的显示方法的流程示意图;
图2B是本申请实施例公开的界面元素添加的一种图示;
图3是本申请实施例公开的一种界面元素的显示方法的流程示意图;
图4A是本申请实施例公开的界面元素添加的另一种图示;
图4B是本申请实施例公开的界面元素添加的又一种图示;
图4C是本申请实施例公开的界面元素添加的又一种图示;
图4D是本申请实施例公开的界面元素添加的又一种图示;
图5A是本申请实施例公开的元素文件夹的一种图示;
图5B是本申请实施例公开的元素文件夹的另一种图示;
图5C是本申请实施例公开的元素文件夹的另一种图示;
图5D是对图5C所示的元素文件夹执行交换操作后的一种图示;
图5E是对图5C所示的元素文件夹执行交换操作后的另一种图示;
图5F是对元素文件夹执行移动操作的一种图示;
图6是本申请实施例公开的另一种界面元素的显示方法的流程示意图;
图7A是本申请实施例公开的界面元素移除的一种图示;
图7B是本申请实施例公开的界面元素移除的另一种图示;
图7C是本申请实施例公开的界面元素移除的另一种图示;
图7D是本申请实施例公开的界面元素移除的另一种图示;
图8是本申请实施例公开的界面元素的显示装置的一种结构示意图;
图9是申请实施例公开的电子设备的一种结构框图。
具体实施方式
本申请实施例提供了一种界面元素的显示方法、装置、电子设备及存储介质,能够实现界面元素的灵活添加,以满足用户需求。
为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行描述,显然,所描述的实施例仅仅是本申请一部分的实施例,而不是全部的实施例。基于本申请中的实施例,都应当属于本申请保护的范围。
可以理解的是,本申请实施例中所涉及的电子设备可以包括一般的手持有屏电子电子设备,诸如手机、智能电话、便携式终端、终端、个人数字助理(Personal Digital Assistant,PDA)、便携式多媒体播放器(Personal Media Player,PMP)装置、笔记本电脑、笔记本(Note Pad)、无线宽带(Wireless Broadband,Wibro)终端、平板电脑(Personal Computer,PC)、智能PC、销售终端(Point of Sales,POS)和车载电脑等。
电子设备也可以包括可穿戴设备。可穿戴设备可以直接穿戴在用户身上,或是整合到用户的衣服或配件的一种便携式电子设备。可穿戴设备不仅仅是一种硬件设备,更可以通过软件支持以及数据交互、云服务器交互来实现强大的智能功能,比如:计算功能、定位功能、报警功能,同时还可以连接手机及各类终端。可穿戴设备可以包括但不限于以手腕为支撑的watch类(比如手表、手腕等产品),以脚为支撑的shoes类(比如鞋、袜子或者其他腿上佩戴产品),以头部为支撑的Glass类(比如眼镜、头盔、头带等)以及智能服装,书包、拐杖、配饰等各类非主流产品形态。
下面对本申请实施例涉及到的专有名词进行说明:
微件(Web widget,widget):指的是可以在任一个基于HTLM(超文本标记语音,HyperText Markup Language)的Web(万维网,World Wide Web)页面上执行代码的小部件。
微件通常依附于对应的应用程序而存在,微件所承载的功能与该对应应用程序的功能紧密相关。可选的,微件可以以卡片样式呈现。
请参阅图1,图1是本申请实施例公开的一种场景示意图。如图1所示的场景示意图包括电子设备10,该电子设备10响应于针对第一界面元素的添加操作,对该电子设备10桌面上的元素文件夹内的第 二界面元素的尺寸进行自适应调整,可以在不改变元素文件夹尺寸的同时,将第一界面元素添加至元素文件夹,还可以保证元素文件夹始终被界面元素填充满,提高了添加界面元素的灵活性,优化了桌面布局,进一步满足了用户需求。
请参阅图2A,图2A是本申请实施例公开的一种界面元素的显示方法的流程示意图。如图2A所示的界面元素的显示方法可以包括以下步骤:
201、响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。
界面元素指的是系统界面所包含的满足用户交互要求的一系列元素,界面元素可包括但不限于微件、应用图标等中的一种或多种。
其中,第一界面元素可以是电子设备桌面上的任一界面元素,针对第一界面元素的添加操作可以由语音操作、手势操作或触摸操作等触发,本申请实施例不做限定。示例性的,针对第一界面元素的添加操作可以是将第一界面元素移动至其他界面元素的显示位置。
在一些实施例中,上述元素文件夹可以是电子设备在响应针对该第一界面元素的添加操作时自动生成的。
示例性的,请参阅图2B,图2B是本申请实施例公开的界面元素添加的一种图示。其中,图2B中的左图表示的是响应针对第一界面元素的添加操作之前电子设备的桌面11,该桌面11中包括4×2的界面元素2和4×2的界面元素1。图2B中的右图表示的是响应针对第一界面元素的添加操作之后电子设备的桌面11,该桌面11中包括包括4×2的元素文件夹12、处于元素文件夹12中的2×2的界面元素2及2×2的界面元素1。
在一些实施例中,上述元素文件夹可以电子设备桌面上当前显示的元素文件夹中的任一个,上述元素文件夹可以由用户从电子设备桌面上当前显示的元素文件夹中自主选定,还可以由电子设备从该电子设备桌面上当前显示的元素文件夹中自动选定,本申请实施例不做限定。
其中,用户自主选定上述元素文件夹的操作可以包括但不限于语音操作、或针对电子设备桌面上显示的任一元素文件夹的选中操作等。
下面通过举例方式,对用户自主选定元素文件夹的方式进行说明:
示例性1,用户长按第一界面元素后第一界面元素处于拖动状态,该第一界面元素停止拖动时的位置对应的元素文件夹,即为该第一界面元素所要添加进的元素文件夹。
示例性2,用户长按第一界面元素后弹出文件夹列表,该文件夹列表可显示可添加第一界面元素的元素文件夹的文件夹标识,用户进而通过点击任一文件夹标识的方式确定第一界面元素所要添加进的元素文件夹。其中,文件夹标识可以包括以下任一种:数字、字母及特殊字符。
若上述元素文件夹是电子设备在响应针对该第一界面元素的添加操作时自主确定的,则响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中,可以包括:响应于针对第一界面元素的添加操作,确定第一界面元素对应的元素文件夹,将第一界面元素添加到该元素文件夹中。
在一些实施例中,确定第一界面元素对应的元素文件夹,可以包括:确定第一界面元素对应的应用类别,并将与该应用类别关联的元素文件夹作为第一界面元素对应的元素文件夹。
示例性的,若第一界面元素为微件,则第一界面元素对应的应用类别指的是与该第一界面元素关联的应用程序的应用类别。若第一界面元素为应用程序图标,则第一界面元素对应的应用类别指的是应用程序图标对应的应用程序的应用类别。
通过实施该方法,在将第一界面元素添加到元素文件夹的过程中,用户只需触发针对第一界面元素的添加操作即可,电子设备可以自动确定第一界面元素对应的元素文件夹,并将第一界面元素添加到确定出的元素文件夹中,以及显示添加第一界面元素的元素文件夹,极大提高了界面元素添加的便捷性。
在一些实施例中,第一界面元素在元素文件夹中的尺寸,与在元素文件夹外的尺寸可以相同也可不同,本申请实施例不做限定。
通过实施该方法,通过自适应调整元素文件夹的第二界面元素的尺寸,可以在不改变元素文件夹尺寸的同时,将第一界面元素成功添加至元素文件夹,还可以保证元素文件夹始终被界面元素填充满,提高了添加界面元素的灵活性,优化了桌面布局,进一步满足了用户需求。
请参阅3,图3是本申请实施例公开的一种界面元素的显示方法的流程示意图,如图3所示的界面元素的显示方法可以包括以下步骤:
301、响应于针对第一界面元素的添加操作,获取元素文件夹的第一显示参数,第一显示参数包括元素文件夹的尺寸和第一元素数量,第一元素数量为元素文件夹内包含的界面元素与第一界面元素的数量总和。
其中,关于添加操作及元素文件夹的确定,请参照针对步骤201的介绍,此处不再赘述。
在一些实施例中,元素文件夹创建后,电子设备可以将该元素文件夹的尺寸及包含的界面元素的数量,与该元素文件夹的文件夹标识进行关联存储。其中,元素文件夹包含的界面元素的数量可以是实时更新的。
进一步的,电子设备可以根据元素文件夹的文件夹标识,获取到元素文件夹的尺寸及包含的界面元素的数量。
302、根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸。
其中,在添加第一界面元素后的元素文件夹中,每个第二界面元素按照对应的第一调整尺寸进行显示。在第二界面元素为多个时,各个第二界面元素分别对应各自的第一调整尺寸。
在一些实施例中,根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸,可以包括:根据第一显示参数,确定添加第一界面元素后的元素文件夹的第一布局样式;根第一布局样式和添加第一界面元素前的元素文件夹的布局样式,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸。
在一些实施例中,电子设备可以预先设定有多个布局样式集合,不同布局样式集合对应不同尺寸的元素文件夹,且每一布局样式集合中的不同布局样式所对应的界面元素数量不同。
进一步的,根据第一显示参数,确定添加第一界面元素后的元素文件夹的第一布局样式,可以包括:从多个布局样式集合中,确定与元素文件夹的尺寸匹配的目标布局样式集合,并将目标布局样式集合中与元素文件夹的第一元素数量匹配的布局样式,作为添加第一界面元素后的元素文件夹的第一布局样式。
303、将第一界面元素添加到元素文件夹中;其中,在添加第一界面元素后的元素文件夹中,每个第二界面元素按照对应的第一调整尺寸进行显示。
示例性的,下面以4×2的元素文件夹为例,对元素文件夹的布局样式进行说明:
显示2个界面元素时,这2个界面元素均为2×2;
显示3个显示元素时,1个2×2的界面元素,1个2×1的界面元素及1和2×1的界面元素;
显示4个界面元素时,1个2×2的界面元素,1个2×1的界面元素、2个1×1的界面元素;
显示5个界面元素时,1个2×2的界面元素,4个1×1的界面元素。
下面结合上述4×2的元素文件夹的布局样式,对界面元素的添加过程进行说明:
请参阅图4A,图4A是本申请实施例公开的界面元素添加的另一种图示。图4A中的左图表示的是添加界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12、处于元素文件夹12内的2×2的界面元素2和2×2的界面元素3,及处于元素文件夹12外的界面元素1。图4A中的右图表示的是添加界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2、2×1的界面元素3及2×1的界面元素1。
请参阅图4B,图4B是本申请实施例公开的界面元素添加的又一种图示。图4B中的左图表示的是添加界面元素1前的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2、2×1的界面元素3及2×1的界面元素4。图4B中的右图表示的是添加界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2、2×1的界面元素3、1×1的界面元素4、1×1的界面元素1。
请参阅图4C,图4C是本申请实施例公开的界面元素添加的又一种图示。图4C中的左图表示的是添加界面元素1前的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2、2×1的界面元素3、1×1的界面元素4、1×1的界面元素5。图4C中的右图表示的是添加界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2、1×1的界面元素3、1×1的界面元素4、1×1的界面元素5及1×1的界面元素1。
在一些实施例中,在元素文件夹中包含的界面元素的个数大于或等于数量阈值时,元素文件夹可以包括第一区域和第二区域。其中,数量阈值可以用户自主设定,或者由电子设备自动设定,本申请实施例不做限定。示例性的,4×2的元素文件夹对应的数量阈值为2。
在一些实施例中,第一显示参数还可以包括第一区域的尺寸,及第一区域内包含的界面元素与第一 界面元素的数量总和。
进一步的,根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸,可以包括:根据第一显示参数,确定元素文件夹的第一区域中的第二界面元素和每个第二界面元素对应的第一调整尺寸。
在一些实施例中,目标布局样式集合中与元素文件夹的第一元素数量匹配的布局样式的个数可以为多个,且不同布局样式所对应的第一区域的尺寸和/或第一区域内的界面元素的个数不同。
进一步的,根据第一显示参数,确定元素文件夹的第一区域中的第二界面元素和每个第二界面元素对应的第一调整尺寸,可以包括:根据元素文件夹的尺寸,及元素文件夹内包含的界面元素和第一界面元素的数量总和,得到与元素文件夹的第一元素数量匹配的多个布局样式;根据第一区域的尺寸,及第一区域的界面元素和第一界面元素的数量总和,从与元素文件夹的第一元素数量匹配的多个布局样式中,确定添加第一界面元素后的元素文件夹的第二布局样式;根据第二布局样式和添加第一界面元素前的元素文件夹的布局样式,确定元素文件夹的第一区域中的第二界面元素和每个第二界面元素对应的第一调整尺寸。
在一些实施例中,第一区域的尺寸可以大于或等于第二区域的尺寸。
示例性的,第一区域为2×2时,4×2的元素文件夹的布局样式:
显示2个界面元素时,这两个界面元素分别处于第一区域和第二区域;
显示3个显示元素时,1个2×2的界面元素处于第二区域,2个2×1的界面元素处于第一区域;
显示4个界面元素时,1个2×2的界面元素处于第二区域,1个2×1的界面元素和2个1×1的界面元素处于第一区域;
显示5个界面元素时,1个2×2的界面元素处于第二区域,4个1×1的界面元素处于第一区域。
下面结合第一区域为2×2时,4×2的元素文件夹的布局样式,对界面元素的添加过程进行说明:
请参阅图4D,图4D是本申请实施例公开的界面元素添加的又一种图示。图4D中的左图表示的是添加界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12、处于元素文件夹12的第一区域121的2×2的界面元素3、处于元素文件夹12的第二区域122的2×2的界面元素2,及处于元素文件夹12外的界面元素1。图4D中的右图表示的是添加界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于第一区域121的2×1的界面元素3、处于第一区域121内的2×1的界面元素1,以及处于第二区域122内的2×2的界面元素2。
在一些实施例中,元素文件夹可包括展示区域和可操作区域,该展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素,可操作区域内包括可交互的界面元素。需要说明的是,不具备交互功能的界面元素指的是无交互控件的界面元素,交互功能被禁止的界面元素指的是交互控件被禁止操作的界面元素。
在一些实施例中,展示区域内的界面元素的尺寸小于或等于可操作区域内的界面元素的尺寸,有助于用户准确操作处于可操作区域内的界面元素,有利于降低了用户误触微件的概率。
在一些实施例中,第一区域可为展示区域,第二区域可为可操作区域。
在一些实施例中,元素文件夹内的界面元素可包括微件。
示例性的,下面结合图示对包含微件的元素文件夹进行说明:
请参阅图5A,图5A是本申请实施例公开的元素文件夹的一种图示。如图5A所示的元素文件夹包括第一区域121和第二区域122。其中,第一区域121为展示区域,第二区域122为可操作区域。第二区域122包括2×2的微件1,第一区域121包括1×1的微件2、1×1的微件3、1×1的微件4及1×1的微件5。
请参阅图5B,图5B是本申请实施例公开的元素文件夹的另一种图示。如图5B所示的元素文件夹包括第一区域121和第二区域122。其中,第一区域121为展示区域,第二区域122为可操作区域。第二区域122包括2×2的微件1,第一区域121包括2×2的微件2。
请参阅图5C,图5C是本申请实施例公开的元素文件夹的另一种图示。如图5B所示的元素文件夹包括第一区域121和第二区域122。其中,第一区域121为展示区域,第二区域122为可操作区域。第二区域122包括2×2的微件1,第一区域121包括2×1的微件2、1×1的微件3及1×1的微件4。
在一些实施例中,还可以响应于针对元素文件夹中第三界面元素和第四界面元素的交换操作,将第三界面元素从第一位置切换至第二位置进行显示,将第四界面元素从第二位置切换至第一位置进行显示。其中,第三界面元素和第四界面元素为元素文件夹内的任意两个界面元素。
在一些实施例中,第三界面元素和第四界面元素的尺寸可以相同,也可不同,本申请实施例不做限 定。
在第三界面元素和第四界面元素的尺寸不同的情况下,第三界面元素和第四界面元素在交换位置时,第三界面元素和第四界面元素的尺寸可以发生变化,也可以不发生变化,本申请实施例不做限定。
在第三界面元素和第四界面元素的尺寸发生变化的情况下,将第三界面元素从第一位置切换至第二位置进行显示,将第四界面元素从第二位置切换至第一位置进行显示,可以包括:将第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示,将第四界面元素按照第二尺寸从第二位置切换至第一位置进行显示;其中,第一尺寸为第四界面元素在第二位置显示时的尺寸,第二尺寸为第三界面元素在第一位置显示时的尺寸。
通过实施该方法,用户可以根据自身喜好灵活调整元素文件夹内的界面元素的位置,进一步提升用户的使用体验感。
其中,针对元素文件夹中第三界面元素和第四界面元素的交换操作可以包括但不限于语音操作或触摸操作。示例性的,该交换操作可以包括用户先后点击第三界面元素和第四界面元素,或者用户将第三界面元素拖动至第四界面元素所在位置。
进一步的,若元素文件夹内的界面元素包括微件、元素文件夹包括展示区域和可操作区域,则第一位置和第二位置所在区域的情况可包括:第一位置和第二位置均处于可操作区域;第一位置和第二位置均处于展示区域;第一位置和第二位置分别处于可操作区域和展示区域。
在一些实施例中,在界面元素为微件的情况下,在第一位置和第二位置均处于展示区域,或者,第一位置和第二位置均处于可操作区域时,第一尺寸可与第二尺寸不同。其中,不同尺寸的同一微件所能呈现的信息量可不同,尺寸越大,所能呈现的信息量越大。通过触发针对同一区域且不同尺寸的任意两个界面元素的交换操作,可方便用户根据自身需求改变微件尺寸。
示例性的,若第三界面元素为图5C中的微件2,第四界面元素为图5C中的微件3,则响应于针对微件2和微件3的交换操作之后的元素文件夹如图5D所示。
在一些实施例中,若第一位置处于展示区域,第二位置处于可操作区域,将第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示之后,还可以响应于针对第三界面元素的交互操作,输出第三界面元素对应的功能信息。通过实施该方法,用户可以通过触发针对不同区域的任意两个界面元素的交换操作,将原本处于展示区域的界面元素交换到可操作区域,使得该界面元素可以由禁止交互变为可交互。示例性的,第三界面元素为图5A中的微件2,第四界面元素为图5C中的微件1,响应于针对微件1和微件2的交换操作之后的元素文件夹如图5E所示。
在一些实施例中,还可以响应于针对元素文件夹的移动操作,将元素文件夹从桌面的当前位置移动至移动操作指示的第三位置。需要说明的是,元素文件夹在移动过程中,元素文件夹的尺寸保持不变。
在一些实施例中,针对元素文件夹的移动操作可以是针对元素文件夹的拖曳操作,该移动操作指示的第三位置指的是元素文件夹停止拖曳的位置。
示例性的,请参阅图5F,图5F是本申请实施例公开的元素文件夹的一种移动图示。
通过实施上述方法,根据元素文件夹的第一显示参数,确定该元素文件夹内第二界面元素对应的第一调整尺寸,以及在元素文件夹添加第一界面元素的过程中,根据对应的第一调整尺寸调整第二界面元素的尺寸,可以实现元素文件夹内第二界面元素尺寸的灵活调整。
请参阅图6,图6是本申请实施例公开的另一种界面元素的显示方法的流程示意图。如图6所示的界面元素的显示方法可以包括以下步骤:
601、响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。
602、响应于针对元素文件夹中第五界面元素的移除操作,将第五界面元素在元素文件夹外显示;其中,移除第五界面元素后的元素文件夹的第六界面元素的尺寸发生变化,以使元素文件夹在移除第五界面元素前的尺寸,与移除第五界面元素后的尺寸相同,且均被界面元素填充满,第六界面元素为移除第五界面元素前文件夹内部分或全部的界面元素。
在一些实施例中,第六界面元素对应的第二调整尺寸,可以根据添加第一界面元素后的元素文件夹的第二显示参数得到,该第二显示参数包括元素文件夹的尺寸和添加第一界面元素后的元素文件夹内除第五界面元素之外的界面元素的数量总和。
其中,需要说明的是,关于第六界面元素对应的第二调整尺寸的确定方式,可以参见上述第二界面 元素对应的第一调整尺寸的确定方式,此处不再赘述。
示例性的,下面结合4×2的元素文件夹的布局样式,对界面元素的移除进行说明:
请参阅图7A,图7A是本申请实施例公开的界面元素移除的一种图示。图7A中的左图表示的是移除界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素1和2×2的界面元素2。图7A中的右图表示的是移除界面元素1后的桌面11,该桌面11包括4×2的界面元素2,以及4×2的界面元素1。
请参阅图7B,图7B是本申请实施例公开的界面元素移除的另一种图示。
图7B中的左图表示的是移除界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12,处于元素文件夹12内的2×1的界面元素1、2×1的界面元素2及2×2的界面元素3。图7B中的右图表示的是移除界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素2及2×2的界面元素3,及处于元素文件夹12外的界面元素1。
请参阅图7C,图7C是本申请实施例公开的界面元素移除的另一种图示。
图7C中的左图表示的是移除界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12,处于元素文件夹12内的1×1的界面元素1、1×1的界面元素2、2×1的界面元素3及2×2的界面元素4。图7C中的右图表示的是移除界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×1的界面元素2、2×1的界面元素3及2×2的界面元素4,及处于元素文件夹12外的界面元素1。
请参阅图7D,图7D是本申请实施例公开的界面元素移除的另一种图示。
图7D中的左图表示的是移除界面元素1前的桌面11,该桌面11中包括4×2的元素文件夹12,处于元素文件夹12内的1×1的界面元素1、1×1的界面元素2、1×1的界面元素3、1×1的界面元素4及2×2的界面元素5。图7D中的右图表示的是移除界面元素1后的桌面11,该桌面11包括4×2的元素文件夹12,处于元素文件夹12内的2×2的界面元素5、2×1的界面元素2、1×1的界面元素3、1×1的界面元素4,及处于元素文件夹12外的界面元素1。
通过实施上述方法,在添加第一界面元素时,通过自适应调整元素文件夹的第二界面元素的尺寸,可以在不改变元素文件夹尺寸的同时,将第一界面元素成功添加至元素文件夹,还可以保证元素文件夹始终被界面元素填充满,提高了添加界面元素的灵活性,优化了桌面布局,进一步满足了用户需求。在移除元素文件夹内的第五界面元素时,可通过自适应调整元素文件夹内第六界面元素的尺寸,保证了移除第五界面元素后的元素文件夹不仅尺寸不变,还可依旧被界面元素填充满,进一步优化了桌面布局。
请参阅图8,图8是本申请实施例公开的界面元素的显示装置的一种结构示意图。如图8所示的装置包括显示单元801。
显示单元801,用于响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。
在一些实施例中,显示单元801,还用于响应于针对第一界面元素的添加操作,生成元素文件夹。
在一些实施例中,显示单元801,还用于获取元素文件夹的第一显示参数,第一显示参数包括元素文件夹的尺寸和第一元素数量,第一元素数量为元素文件夹内包含的界面元素与第一界面元素的数量总和;以及,根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸;
其中,在添加第一界面元素后的元素文件夹中,每个第二界面元素按照对应的第一调整尺寸进行显示。
一些实施例中,元素文件夹包括第一区域和第二区域,第一显示参数还包括第一区域的尺寸,及第一区域内包含的界面元素和第一界面元素的数量总和;
显示单元801用于根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸的方式具体可以包括:显示单元801,用于根据第一显示参数,确定元素文件夹的第一区域中的第二界面元素和每个第二界面元素对应的第一调整尺寸。
在一些实施例中,元素文件夹包括展示区域和可操作区域,展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素。
在一些实施例中,展示区域内的界面元素的尺寸小于或等于可操作区域内的界面元素的尺寸。
一些实施例中,元素文件夹内的界面元素包括微件。
在一些实施例中,显示单元801,还用于响应于针对元素文件夹中第三界面元素和第四界面元素的交换操作,将第三界面元素从第一位置切换至第二位置进行显示,将第四界面元素从第二位置切换至第一位置进行显示;其中,第三界面元素和第四界面元素为元素文件夹内的任意两个界面元素。
在一些实施例中,显示单元801用于将第三界面元素从第一位置切换至第二位置进行显示,将第四界面元素从第二位置切换至第一位置进行显示的方式具体可以包括:显示单元801,用于将第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示,将第四界面元素按照第二尺寸从第二位置切换至第一位置进行显示;其中,第一尺寸为第四界面元素在第二位置显示时的尺寸,第二尺寸为第三界面元素在第一位置显示时的尺寸。
在一些实施例中,元素文件夹包括展示区域和可操作区域;展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素,第一位置处于展示区域,第二位置处于可操作区域。
进一步的,显示单元801,还用于将第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示之后,响应于针对第三界面元素的交互操作,输出第三界面元素对应的功能信息。
在一些实施例中,元素文件夹包括展示区域和可操作区域;展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素,第一位置和第二位置均处于展示区域。
在一些实施例中,显示单元801,还用于响应于针对元素文件夹中第五界面元素的移除操作,将第五界面元素在元素文件夹外显示;其中,移除第五界面元素后的元素文件夹的第六界面元素的尺寸发生变化,以使元素文件夹在移除第五界面元素前的尺寸,与移除第五界面元素后的尺寸相同,且均被界面元素填充满,第六界面元素为移除第五界面元素前文件夹内部分或全部的界面元素。
请参阅图9,图9是申请实施例公开的电子设备的一种结构框图。如图9所示的电子设备可以处理器901、与处理器901耦合的存储器902,其中存储器902可存储有一个或多个计算机程序。
处理器901可以包括一个或者多个处理核。处理器901利用各种接口和线路连接整个电子设备内的各个部分,通过运行或执行存储在存储器902内的指令、程序、代码集或指令集,以及调用存储在存储器902内的数据,执行电子设备的各种功能和处理数据。可选地,处理器901可以采用数字信号处理(Digital Signal Processing,DSP)、现场可编程门阵列(Field-Programmable Gate Array,FPGA)、可编程逻辑阵列(Programmable Logic Array,PLA)中的至少一种硬件形式来实现。处理器901可集成中央处理器(Central Processing Unit,CPU)、图像处理器(Graphics Processing Unit,GPU)和调制解调器等中的一种或几种的组合。其中,CPU主要处理操作系统、用户界面和应用程序等;GPU用于负责显示内容的渲染和绘制;调制解调器用于处理无线通信。可以理解的是,上述调制解调器也可以不集成到处理器901中,单独通过一块通信芯片进行实现。
存储器902可以包括随机存储器(Random Access Memory,RAM),也可以包括只读存储器(Read-Only Memory,ROM)。存储器902可用于存储指令、程序、代码、代码集或指令集。存储器902可包括存储程序区和存储数据区,其中,存储程序区可存储用于实现操作系统的指令、用于实现至少一个功能的指令(比如触控功能、声音播放功能、图像播放功能等)、用于实现上述各个方法实施例的指令等。存储数据区还可以存储电子设备在使用中所创建的数据等。
在本申请实施例中,处理器901还具有以下功能:
响应于针对第一界面元素的添加操作,将第一界面元素添加到元素文件夹中;其中,添加第一界面元素后的元素文件夹的第二界面元素的尺寸发生变化,以使元素文件夹在添加第一界面元素前的尺寸,与添加第一界面元素后的尺寸相同,且均被界面元素填充满,第二界面元素为添加第一界面元素前文件夹内部分或全部的界面元素。
在本申请实施例中,处理器901还具有以下功能:
响应于针对第一界面元素的添加操作,生成元素文件夹。
在本申请实施例中,处理器901还具有以下功能:
获取元素文件夹的第一显示参数,第一显示参数包括元素文件夹的尺寸和第一元素数量,第一元素数量为元素文件夹内包含的界面元素与第一界面元素的数量总和;以及,根据第一显示参数,确定元素文件夹中的第二界面元素及每个第二界面元素对应的第一调整尺寸;其中,在添加第一界面元素后的元素文件夹中,每个第二界面元素按照对应的第一调整尺寸进行显示。
在本申请实施例中,元素文件夹包括第一区域和第二区域,第一显示参数还包括第一区域的尺寸,及第一区域内包含的界面元素和第一界面元素的数量总和;
处理器901还具有以下功能:
根据第一显示参数,确定元素文件夹的第一区域中的第二界面元素和每个第二界面元素对应的第一调整尺寸。
在本申请实施例中,元素文件夹包括展示区域和可操作区域,展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素。
在本申请实施例中,展示区域内的界面元素的尺寸小于或等于可操作区域内的界面元素的尺寸。
在本申请实施例中,元素文件夹内的界面元素包括微件。
在本申请实施例中,处理器901还具有以下功能:
响应于针对元素文件夹中第三界面元素和第四界面元素的交换操作,将第三界面元素从第一位置切换至第二位置进行显示,将第四界面元素从第二位置切换至第一位置进行显示;其中,第三界面元素和第四界面元素为元素文件夹内的任意两个界面元素。
在本申请实施例中,处理器901还具有以下功能:
将第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示,将第四界面元素按照第二尺寸从第二位置切换至第一位置进行显示;其中,第一尺寸为第四界面元素在第二位置显示时的尺寸,第二尺寸为第三界面元素在第一位置显示时的尺寸。
在本申请实施例中,元素文件夹包括展示区域和可操作区域;展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素,第一位置处于展示区域,第二位置处于可操作区域;
处理器901还具有以下功能:响应于针对第三界面元素的交互操作,输出第三界面元素对应的功能信息。
在本申请实施例中,元素文件夹包括展示区域和可操作区域;展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;可操作区域内包含可交互的界面元素,第一位置和第二位置均处于展示区域。
处理器901还具有以下功能:
响应于针对元素文件夹中第五界面元素的移除操作,将第五界面元素在元素文件夹外显示;其中,移除第五界面元素后的元素文件夹的第六界面元素的尺寸发生变化,以使元素文件夹在移除第五界面元素前的尺寸,与移除第五界面元素后的尺寸相同,且均被界面元素填充满,第六界面元素为移除第五界面元素前文件夹内部分或全部的界面元素。
本申请实施例公开一种计算机可读存储介质,其存储计算机程序,其中,计算机程序被处理器执行时,使得处理器实现上述实施例中电子设备执行的部分或全部步骤。
本申请实施例公开了一种计算机程序产品,当计算机程序产品在计算机上运行时,使得计算机执行上述实施例中电子设备执行的部分或全部步骤。
本申请实施例公开了一种应用发布平台,应用发布平台用于发布计算机程序产品,其中,当计算机程序产品在计算机上运行时,使得计算机执行上述实施例中电子设备执行的部分或全部步骤。
在上述实施例中,可以全部或部分地通过软件、硬件、固件或者其任意组合来实现。当使用软件实现时,可以全部或部分地以计算机程序产品的形式实现。
计算机程序产品包括一个或多个计算机指令。在计算机上加载和执行计算机程序指令时,全部或部分地产生按照本申请实施例的流程或功能。计算机可以是通用计算机、专用计算机、计算机网络、或者其他可编程装置。计算机指令可以存储在计算机可读存储介质中,或者从一个计算机可读存储介质向另一计算机可读存储介质传输,例如,计算机指令可以从一个网站站点、计算机、服务器或数据中心通过有线(例如同轴电缆、光纤、数字用户线(DSL))或无线(例如红外、无线、微波等)方式向另一个网站站点、计算机、服务器或数据中心进行传输。计算机可读存储介质可以是计算机能够存储的任何可用介质或者是包含一个或多个可用介质集成的服务器、数据中心等数据存储设备。可用介质可以是磁性介质,(例如,软盘、磁盘、磁带)、光介质(例如,DVD)、或者半导体介质(例如固态磁盘Solid State Disk(SSD))等。
所属领域的技术人员可以清楚地了解到,为描述的方便和简洁,上述描述的系统,装置和单元的具体工作过程,可以参考前述方法实施例中的对应过程,在此不再赘述。
在本申请所提供的几个实施例中,应该理解到,所揭露的系统,装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些 特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。
作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本申请各个实施例方法的全部或部分步骤。而前述的存储介质包括:U盘、移动磁盘、只读存储器(Read-Only Memory,ROM)、随机存取存储器(Random Access Memory,RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
以上,以上实施例仅用以说明本申请的技术方案,而非对其限制;尽管参照前述实施例对本申请进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本申请各实施例技术方案的精神和范围。

Claims (21)

  1. 一种界面元素的显示方法,其特征在于,包括:
    响应于针对第一界面元素的添加操作,将所述第一界面元素添加到元素文件夹中;
    其中,添加所述第一界面元素后的所述元素文件夹的第二界面元素的尺寸发生变化,以使所述元素文件夹在添加所述第一界面元素前的尺寸,与添加所述第一界面元素后的尺寸相同,且均被界面元素填充满,所述第二界面元素为添加所述第一界面元素前所述文件夹内部分或全部的界面元素。
  2. 根据权利要求1所述的方法,其特征在于,所述方法还包括:
    响应于针对第一界面元素的添加操作,生成元素文件夹。
  3. 根据权利要求2所述的方法,其特征在于,所述生成元素文件夹,包括:
    确定所述第一界面元素对应的应用类别;
    将与所述应用类别关联的元素文件夹作为所述第一界面元素对应的元素文件夹。
  4. 根据权利要求1所述的方法,其特征在于,在所述将所述第一界面元素添加到元素文件夹中之前,所述方法还包括:
    获取元素文件夹的第一显示参数,所述第一显示参数包括所述元素文件夹的尺寸和第一元素数量,所述第一元素数量为所述元素文件夹内包含的界面元素与所述第一界面元素的数量总和;
    根据所述第一显示参数,确定所述元素文件夹中的第二界面元素及每个所述第二界面元素对应的第一调整尺寸;
    其中,在添加所述第一界面元素后的所述元素文件夹中,每个所述第二界面元素按照对应的第一调整尺寸进行显示。
  5. 根据权利要求4所述的方法,其特征在于,所述根据所述第一显示参数,确定所述元素文件夹中的第二界面元素及每个所述第二界面元素对应的第一调整尺寸,包括:
    根据第一显示参数,确定添加所述第一界面元素后的元素文件夹的第一布局样式;
    根据所述第一布局样式和添加所述第一界面元素前的元素文件夹的布局样式,确定所述元素文件夹中的第二界面元素及每个所述第二界面元素对应的第一调整尺寸。
  6. 根据权利要求5所述的方法,其特征在于,所述根据第一显示参数,确定添加所述第一界面元素后的元素文件夹的第一布局样式,包括:
    从预先设定的多个布局样式集合中,确定与所述元素文件夹的尺寸匹配的目标布局样式集合;
    将所述目标布局样式集合中与所述元素文件夹的第一元素数量匹配的布局样式,作为添加所述第一界面元素后的元素文件夹的第一布局样式。
  7. 根据权利要求4所述的方法,其特征在于,所述元素文件夹包括第一区域和第二区域,所述第一显示参数还包括所述第一区域的尺寸,及所述第一区域内包含的界面元素与所述第一界面元素的数量总和;
    其中,所述根据所述第一显示参数,确定所述元素文件夹中的第二界面元素及每个所述第二界面元素对应的第一调整尺寸,包括:
    根据所述第一显示参数,确定所述元素文件夹的所述第一区域中的第二界面元素和每个所述第二界面元素对应的第一调整尺寸。
  8. 根据权利要求7所述的方法,其特征在于,所述根据所述第一显示参数,确定所述元素文件夹的所述第一区域中的第二界面元素和每个所述第二界面元素对应的第一调整尺寸,包括:
    根据所述元素文件夹的尺寸,及所述元素文件夹内包含的界面元素和第一界面元素的数量总和,得到与所述元素文件夹的第一元素数量匹配的多个布局样式;
    根据所述第一区域的尺寸,及所述第一区域的界面元素和所述第一界面元素的数量总和,从与所述元素文件夹的第一元素数量匹配的多个布局样式中,确定添加所述第一界面元素后的元素文件夹的第二布局样式;
    根据所述第二布局样式和添加所述第一界面元素前的元素文件夹的布局样式,确定所述元素文件夹的第一区域中的第二界面元素和每个所述第二界面元素对应的第一调整尺寸。
  9. 根据权利要求7所述的方法,其特征在于,所述第一区域的尺寸大于或等于所述第二区域的尺寸。
  10. 根据权利要求1-9任一项所述的方法,其特征在于,所述元素文件夹包括展示区域和可操作区域,所述展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;所述可操作区域内包含可交互的界面元素。
  11. 根据权利要求10所述的方法,其特征在于,所述展示区域内的界面元素的尺寸小于或等于所述可操作区域内的界面元素的尺寸。
  12. 根据权利要求1-9任一项所述的方法,其特征在于,所述元素文件夹内的界面元素包括微件。
  13. 根据权利要求1-9任一项所述的方法,其特征在于,所述方法还包括:
    响应于针对所述元素文件夹中第三界面元素和第四界面元素的交换操作,将所述第三界面元素从第一位置切换至第二位置进行显示,将所述第四界面元素从所述第二位置切换至所述第一位置进行显示;其中,所述第三界面元素和第四界面元素为所述元素文件夹内的任意两个界面元素。
  14. 根据权利要求13所述的方法,其特征在于,所述将所述第三界面元素从第一位置切换至第二位置进行显示,将所述第四界面元素从所述第二位置切换至所述第一位置进行显示,包括:
    将所述第三界面元素按照第一尺寸从第一位置切换至第二位置进行显示,将所述第四界面元素按照第二尺寸从所述第二位置切换至所述第一位置进行显示;其中,所述第一尺寸为所述第四界面元素在所述第二位置显示时的尺寸,所述第二尺寸为所述第三界面元素在所述第一位置显示时的尺寸。
  15. 根据权利要求13所述的方法,其特征在于,所述元素文件夹包括展示区域和可操作区域;所述展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;所述可操作区域内包含可交互的界面元素,所述第一位置处于所述展示区域,所述第二位置处于所述可操作区域;
    其中,所述将所述第三界面元素按照从第一位置切换至第二位置进行显示之后,所述方法还包括:
    响应于针对所述第三界面元素的交互操作,输出所述第三界面元素对应的功能信息。
  16. 根据权利要求14所述的方法,其特征在于,所述元素文件夹包括展示区域和可操作区域;所述展示区域内包括不具备交互功能的界面元素和/或交互功能被禁止的界面元素;所述可操作区域内包含可交互的界面元素,所述第一位置和所述第二位置均处于所述展示区域。
  17. 根据权利要求1-9任一项所述的方法,其特征在于,所述方法还包括:
    响应于针对所述元素文件夹中第五界面元素的移除操作,将所述第五界面元素在所述元素文件夹外显示;其中,移除所述第五界面元素后的所述元素文件夹的第六界面元素的尺寸发生变化,以使所述元素文件夹在移除所述第五界面元素前的尺寸,与移除所述第五界面元素后的尺寸相同,且均被界面元素填充满,所述第六界面元素为移除所述第五界面元素前所述文件夹内部分或全部的界面元素。
  18. 根据权利要求1-9任一项所述的方法,其特征在于,所述方法还包括:
    响应于针对所述元素文件夹的移动操作,将所述元素文件夹从桌面的当前位置移动至所述移动操作指示的第三位置。
  19. 一种界面元素的显示装置,其特征在于,包括:
    显示单元,用于响应于针对第一界面元素的添加操作,将所述第一界面元素添加到元素文件夹中;其中,添加所述第一界面元素后的所述元素文件夹的第二界面元素的尺寸发生变化,以使所述元素文件夹在添加所述第一界面元素前的尺寸,与添加所述第一界面元素后的尺寸相同,且均被界面元素填充满,所述第二界面元素为添加所述第一界面元素前所述文件夹内部分或全部的界面元素。
  20. 一种电子设备,其特征在于,包括:
    存储有可执行程序代码的存储器;
    以及所述存储器耦合的处理器;
    所述处理器调用所述存储器中存储的所述可执行程序代码,所述可执行程序代码被所述处理器执行时,使得所述处理器实现如权利要求1-18中任一所述的方法。
  21. 一种计算机可读存储介质,其上存储有可执行程序代码,其特征在于,所述可执行程序代码被处理器执行时,实现如权利要求1-18中任一所述的方法。
PCT/CN2022/139531 2022-06-09 2022-12-16 界面元素的显示方法、装置、电子设备及存储介质 WO2023236491A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202210658984.7A CN117251088A (zh) 2022-06-09 2022-06-09 界面元素的显示方法、装置、电子设备及存储介质
CN202210658984.7 2022-06-09

Publications (1)

Publication Number Publication Date
WO2023236491A1 true WO2023236491A1 (zh) 2023-12-14

Family

ID=89117472

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2022/139531 WO2023236491A1 (zh) 2022-06-09 2022-12-16 界面元素的显示方法、装置、电子设备及存储介质

Country Status (2)

Country Link
CN (1) CN117251088A (zh)
WO (1) WO2023236491A1 (zh)

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120084732A1 (en) * 2010-10-01 2012-04-05 Vasily Filippov Methods and apparatus for organizing applications and widgets on a mobile device interface
CN105630298A (zh) * 2016-02-29 2016-06-01 华为技术有限公司 一种文件夹的管理方法和设备
CN107247540A (zh) * 2017-06-26 2017-10-13 上海与德科技有限公司 应用图标的调整方法及装置
WO2021036553A1 (zh) * 2019-08-29 2021-03-04 维沃移动通信有限公司 图标显示方法及电子设备

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120084732A1 (en) * 2010-10-01 2012-04-05 Vasily Filippov Methods and apparatus for organizing applications and widgets on a mobile device interface
CN105630298A (zh) * 2016-02-29 2016-06-01 华为技术有限公司 一种文件夹的管理方法和设备
CN107247540A (zh) * 2017-06-26 2017-10-13 上海与德科技有限公司 应用图标的调整方法及装置
WO2021036553A1 (zh) * 2019-08-29 2021-03-04 维沃移动通信有限公司 图标显示方法及电子设备

Also Published As

Publication number Publication date
CN117251088A (zh) 2023-12-19

Similar Documents

Publication Publication Date Title
WO2020238815A1 (zh) 显示控制方法及装置、电子设备和存储介质
US10762277B2 (en) Optimization schemes for controlling user interfaces through gesture or touch
KR102108583B1 (ko) 인스턴스화가능한 제스처 객체
WO2021203821A1 (zh) 页面操控方法、装置、存储介质及终端
AU2013206367A1 (en) System, method and graphical user interface for controlling a game
US10055388B2 (en) Declarative style rules for default touch behaviors
CN105324753A (zh) 调用来自web页面或其他应用的应用
CN106445956B (zh) 一种购物数据的管理方法及装置
US9383908B2 (en) Independent hit testing
EP4268913A1 (en) Position adjustment method and apparatus for operation controls, and terminal, and storage medium
WO2022143660A1 (zh) 图标显示方法、装置及电子设备
US11243679B2 (en) Remote data input framework
CN113778270A (zh) 一种拖动图标的方法和装置
WO2023236491A1 (zh) 界面元素的显示方法、装置、电子设备及存储介质
WO2022194077A1 (zh) 应用程序图标管理方法、装置及电子设备
CN114510308B (zh) 移动终端存储应用页面的方法、装置、设备和介质
CN114629800B (zh) 工控网络靶场的可视化生成方法、装置、终端及存储介质
CN112966201B (zh) 对象处理方法、装置、电子设备以及存储介质
US10990251B1 (en) Smart augmented reality selector
AU2016225861B2 (en) System, method and graphical user interface for controlling a game
CN113162840B (zh) 显示方法、显示装置、电子设备及可读存储介质
WO2023179158A1 (zh) 界面显示方法、装置、终端设备及存储介质
CN117839209A (zh) 游戏界面交互方法、装置、可读存储介质与电子设备
AU2013263809B2 (en) System, method and graphical user interface for controlling a game
CN114082185A (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: 22945619

Country of ref document: EP

Kind code of ref document: A1