CN112433656B - Interface dynamic display method and equipment - Google Patents

Interface dynamic display method and equipment Download PDF

Info

Publication number
CN112433656B
CN112433656B CN202011172047.8A CN202011172047A CN112433656B CN 112433656 B CN112433656 B CN 112433656B CN 202011172047 A CN202011172047 A CN 202011172047A CN 112433656 B CN112433656 B CN 112433656B
Authority
CN
China
Prior art keywords
interface
icon
icons
display
menu items
Prior art date
Legal status (The legal status 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 status listed.)
Active
Application number
CN202011172047.8A
Other languages
Chinese (zh)
Other versions
CN112433656A (en
Inventor
刘新生
林鎏娟
卢廉瑾
林智雄
刘灵辉
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Fujian Star Net eVideo Information Systems Co Ltd
Original Assignee
Fujian Star Net eVideo Information Systems Co Ltd
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 Fujian Star Net eVideo Information Systems Co Ltd filed Critical Fujian Star Net eVideo Information Systems Co Ltd
Priority to CN202011172047.8A priority Critical patent/CN112433656B/en
Publication of CN112433656A publication Critical patent/CN112433656A/en
Application granted granted Critical
Publication of CN112433656B publication Critical patent/CN112433656B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction 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/0482—Interaction with lists of selectable items, e.g. menus
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction 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/04817—Interaction 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
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction 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/0485—Scrolling or panning
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction 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/0486—Drag-and-drop
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00—Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/048—Indexing scheme relating to G06F3/048
    • G06F2203/04806—Zoom, i.e. interaction techniques or interactors for controlling the zooming operation

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The invention relates to the technical field of user interface graphic display, and discloses an interface dynamic display method and equipment, wherein the interface dynamic display method comprises the following steps: the method comprises the steps that an electronic device receives and installs an interface display template sent by a cloud server, wherein the interface display template comprises menu items on an interface; inquiring whether the function corresponding to the menu item exists in a function list of the electronic equipment; if not, deleting the icons corresponding to the menu items on the interface, and adjusting the display positions of the icons corresponding to the remaining menu items on the interface according to the weight. According to the technical scheme, the menu items which cannot be used by the electronic equipment in the interface display template can be deleted, and the user is prevented from clicking icons of the menu items which cannot be normally used. And the technical scheme readjusts the deleted icons in the interface, so that the icon arrangement vacant positions formed after the icons in the interface are deleted can be automatically supplemented.

Description

Interface dynamic display method and equipment
Technical Field
The invention relates to the technical field of graphical display of user interfaces, in particular to a dynamic interface display method and device.
Background
Electronic equipment such as computers, mobile phones and song-ordering equipment generally performs man-machine interaction through display interfaces of display screens, different equipment or different application software have different display interfaces, and icons with menu items with different functions are displayed in the display interfaces for users to select. In the prior art, the icon styles of the menu items in the interface are displayed without difference, the positions of the icons in the interface are uniformly distributed, and the sizes of the icons are also the same, so that when the number of the icons is large, the user can hardly find the icon of the target menu item in the first time. In the prior art, after the menu items in the display interface need to be configured, the corresponding functions can be opened only when the icons of the menu items are clicked.
However, in some cases, the electronic device is managed by the cloud server, and the interface display template of the electronic device is completed by the cloud server and imported into the electronic device, and the interface display template of the electronic device includes a display style of the interface icon of the electronic device and an icon of the interface display. In general, the cloud server provides interface display templates for a plurality of electronic devices, software and hardware environments of each electronic device may be different, and installed applications are also different, so that the cloud server may include applications that can be installed on different electronic devices as much as possible when providing the interface display templates, and therefore the interface display templates received by the electronic devices may include software functions that the electronic devices do not have. After the electronic equipment is provided with the interface display template, menu item icons with different functions in the interface display template can be displayed in the electronic equipment display interface, but the condition that the entrance function of the icon of some menu items does not exist still exists, and when the icons are clicked, a prompt of 'the function is temporarily not activated and is respected to expect' can be displayed frequently, so that the use experience of a user is influenced.
Disclosure of Invention
Therefore, an interface dynamic display method needs to be provided, which is used for solving the technical problem that in the prior art, the use experience of a user is influenced by displaying icons of menu items which are not configured in a display interface.
In order to achieve the above object, the present invention provides a dynamic interface display method, which comprises the following steps:
the method comprises the steps that the electronic equipment receives and installs an interface display template, wherein the interface display template comprises a display style of an interface icon and a menu item corresponding to the interface display icon;
inquiring whether the function corresponding to the menu item in the interface display template exists in a function list of the electronic equipment or not;
if not, deleting the icons corresponding to the menu items on an interface display template interface, and adjusting the display positions of the remaining icons corresponding to the menu items on the interface according to the weight.
Further, the adjusting the display positions of the icons corresponding to the remaining menu items on the interface according to the weight includes the steps of:
presetting the weight of a menu item, wherein the weight is determined based on the number of times the menu item is clicked, or the weight is determined based on the number of times the menu item is expected to be clicked;
and configuring the positions of the icons on the interface according to the weights of the rest menu items, wherein the heavier the menu item is, the more the corresponding icon is centered at the arrangement position of the interface.
Further, the interface dynamic display method further comprises the following steps:
the method comprises the steps of collecting the click times of icons corresponding to interface menu items, counting the click times of the icons corresponding to the menu items according to a preset period, rearranging the display positions of the icons corresponding to the menu items on an interface according to the click times of the icons corresponding to the menu items, wherein the more the click times are, the more the positions of the icons corresponding to the menu items on the interface are.
Further, the interface dynamic display method further comprises the following steps:
when the icons corresponding to the menu items are arranged on the interface, the size of the icons arranged in the center of the interface is the largest, and other icons are gradually reduced from the center to the periphery.
Further, the interface dynamic display method further comprises the following steps:
when the interface is slid, the icons move along the sliding direction, the size of the icons sliding towards the center of the interface is gradually increased, and the size of the icons far away from the center of the interface is gradually decreased.
Further, in the sliding process of the icon, the width W of the icon at a certain time is: w = (W) n-1 -W n )*d/D+W n (ii) a A predetermined central line L n And said middle line L n-1 Said middle line L n Through the center of the icon, another center line L n-1 Through the figureTarget adjacent icon n-1 center, the midline L n And said middle line L n-1 Parallel, said median line L n And said middle line L n-1 The distance between the center point of the icon and the central line L at a certain moment in the sliding process of the icon to the adjacent icon n-1 is D n D is more than or equal to 0 and less than or equal to D, and the width of the icon is W n The width of the adjacent icon n-1 is W n-1 。
Furthermore, the interface comprises more than two rows or more than two columns of icons, the scaling values between two adjacent icons in the same row or the same column are different, and the scaling values of the icons in the same row or the same column are gradually increased along the direction from the center of the interface to the periphery.
Further, when the interface is slid, the icons in the interface synchronously move along the sliding direction; the movement of the icons configured to be topmost slows or stops when the icons configured to be bottommost are away from a top boundary of the interface or the icons configured to be bottommost are away from a bottom boundary of the interface.
Further, the method also comprises the following steps: when the icons in the interface do not slide, the icons in the interface are controlled to be gradually enlarged and reduced according to a preset period, the enlargement and reduction time for one time is different, more than one icon is enlarged and reduced at the same time, and the icon breathing display effect is achieved.
In order to solve the above technical problem, the present invention further provides another technical solution:
a device is provided with an interface for human-computer interaction, icons of more than two menu items are displayed on the interface, and the icons of the menu items are displayed by the interface dynamic display method according to any technical scheme.
Different from the prior art, the electronic equipment in the technical scheme receives and installs the interface display template, so that a user can conveniently display the interface of the electronic equipment, and after the interface display template is installed, whether the function corresponding to the menu item in the interface display template exists in the function list of the electronic equipment is inquired; if not, deleting the icons corresponding to the menu items in an interface display template, and adjusting the display positions of the icons corresponding to the remaining menu items on the interface according to the weight. Therefore, the menu items which cannot be used by the electronic equipment in the interface display template can be deleted, and the user is prevented from clicking the icons of the menu items which cannot be normally used. And the technical scheme readjusts the deleted icons in the interface, so that the icon arrangement vacant positions formed after the icons in the interface are deleted can be automatically supplemented.
Further, the above technical solution configures the position of the icon on the interface according to the weight of the preset menu item, so that the larger the weight of the menu item is, the more the center the corresponding icon is at the position arranged on the interface, and the weight is determined based on the number of times that the menu item is clicked, or the weight is determined based on the number of times that the menu item is expected to be clicked. Therefore, the positions of the corresponding icons of the menu items can be adjusted according to the click times of the menu items, and the icon of the menu item with higher click times is closer to the center of the interface, so that the user can find the icon of the target menu item conveniently at the first time.
Furthermore, the technical scheme determines the weight of the menu item by collecting the frequency of each menu item being selected, and adjusts the display style of the icon according to the weight, so that the display position and size of the icon are adjusted according to the weight, and the clicking operation of the user is facilitated.
Furthermore, in the above technical solution, the icons have different sizes, and along different arrangement directions, the sizes of the icons are linearly increased or decreased in different ways, so that the display styles of the icons are richer.
Furthermore, in the technical scheme, when the interface is slid, the icon moves along with the sliding direction, and when the icon moves to the top or the bottom of the interface, the icon moves slowly or stops, so that the movement damping effect is realized, and the linear dragging display method has a better display effect compared with the conventional linear dragging display method.
Drawings
FIG. 1 is a flowchart of a method for dynamically displaying an interface according to an embodiment;
FIG. 2 is a flow diagram of an embodiment for dynamically adjusting the display position of an icon on an interface;
FIG. 3 is a diagram illustrating the display effect of an interface according to an embodiment;
FIG. 4 is a schematic diagram of the positions and widths of the centerlines and icons in the interface according to an embodiment;
FIG. 5 is a schematic diagram of an electronic device according to an embodiment;
description of the reference symbols
500. An electronic device;
501. a human-computer interaction interface;
Detailed Description
To explain technical contents, structural features, and objects and effects of the technical solutions in detail, the following detailed description is given with reference to the accompanying drawings in conjunction with the embodiments.
Referring to fig. 1 to 4, the present embodiment provides a dynamic interface display method. The interface dynamic display method can be applied to the operating system interfaces of electronic equipment with display interfaces such as computers, mobile phones, on-demand equipment and the like or the display interfaces of application software with different functions. As shown in fig. 1, the interface dynamic display method includes the steps of:
s101, receiving an interface display template by electronic equipment, wherein the interface display template comprises a display style of an interface icon and a menu item corresponding to the interface display icon;
s102, inquiring whether a function corresponding to a menu item in the interface display template exists in a function list of the electronic equipment or not;
s103, if not, deleting the icons corresponding to the menu items in an interface display template, and adjusting the display positions of the icons corresponding to the remaining menu items on the interface according to the weight;
and S104, if so, displaying the icons of the menu items on the display interface according to the icon display style in the interface display template.
In step S101, the electronic device receives an interface display template sent by a cloud server. The electronic equipment can be connected with the cloud server through a network, and the electronic equipment is managed by the cloud server. The cloud server can simultaneously manage electronic equipment in a plurality of audio-visual places, the electronic equipment can be song ordering equipment and the like in the audio-visual places, software and hardware information of the electronic equipment can be collected through the cloud server, and functions of the electronic equipment are configured. For example, the display style of the icons of each menu item of the interface of the song requesting device in the interface comprises the icons of which menu items are displayed, the position, the size and the like of the icons in the interface. Because one cloud server needs to be configured for a plurality of electronic devices, the cloud server provides an interface display template of the electronic devices and sends the interface display template to the electronic devices, and the electronic devices receive the interface display template and install the interface display template. Meanwhile, the interface display template of the cloud server includes the menu items of the application software frequently used by the electronic device managed by the interface display template, so that the number of the menu items in the interface display template is generally greater than or equal to the number of the menu items of the application software installed in a certain electronic device. So the menu item comparison and deletion operation of step 102 is required.
In step S102, when querying whether the function of the menu item in the interface display template exists in the function list, the xml configuration files of all the menu items may be obtained, the function entry information sets at the tops of the menu items in the configuration files in the xml are collected, and then, whether the function corresponding to the menu item in the interface display template exists in the function list of the electronic device (that is, whether the electronic device has application software corresponding to the menu item) is queried one by one. If all the installed application software of the electronic device is recorded in the function list of the electronic device in step S102, and if the function corresponding to the menu item in the interface display template sent by the cloud server exists in the function list of the electronic device, it indicates that the corresponding function can be opened when the menu item in the interface display template is clicked and selected, so that it is unnecessary to delete the icon corresponding to the menu item, and it jumps to step S104, in step S104, the display position of the icon corresponding to the menu item on the interface is arranged according to the weight of the menu item, so that the icon of the menu item is displayed on the interface for the user to select.
In step S102, when the function of a certain menu item in the query interface display template does not exist in the function list, it indicates that the functional electronic device corresponding to the menu item is not installed, and it cannot jump to the corresponding functional interface when clicked, so in order to prevent the user from clicking the uninstalled menu item, it jumps to step S103, and in step S103, deletes the menu item and the corresponding icon. In order to make the interface display cleaner and more convenient for the user to use, in the embodiment, after a menu item and a corresponding icon are deleted, the display style of the icons corresponding to the remaining menu items on the interface is adjusted, so that the icons of other menu items are placed in the blank positions left on the interface.
When the display style of the icons corresponding to the remaining menu items on the interface is adjusted in step S103, the positions of the corresponding icons may be adjusted according to the weights of the menu items described in the above embodiments, and the sizes of the icons may be adjusted according to the weights of the menu items, so that the icon of the menu item with the larger weight is closer to the center of the interface, and the size of the icon is larger. Icons for a plurality of menu items are displayed in the interface, and in different embodiments the icons for the menu items may be arranged differently, in some embodiments the icons may be arranged in a row-column arrangement, and in other embodiments the icons may be arranged in a circle.
According to the embodiment, whether the function of each menu item in the interface display template exists in the function list of the electronic equipment is inquired, and when the function of the menu item in the interface display template does not exist in the function configuration list of the electronic equipment, the icon of the menu item is deleted on the interface, so that the situation that a user clicks the icon of the menu item which cannot be normally used is avoided, and the use experience of the user is improved. And the display style of the deleted icon in the interface is readjusted, so that the icon arrangement vacancy formed after the icon in the interface is deleted can be automatically supplemented.
As shown in fig. 2, in an embodiment, the interface dynamic display method further includes the steps of:
s201, presetting the weight of a menu item, wherein the weight is determined based on the number of times the menu item is clicked, or the weight is determined based on the number of times the menu item is expected to be clicked;
s202, the positions of the icons of the menu items on the interface are configured according to the weights of the rest menu items, and the larger the weight of the menu item is, the more the center the corresponding icon is arranged at the interface.
In step S201, the weight of a menu item may be based on the frequency of selecting the menu item or the frequency of expecting to select the menu item, if the menu item is selected or expectedly selected more frequently, the corresponding weight is larger, otherwise, the weight is smaller. In step S202, the ranking priority of the menu items may be determined based on the weights of the menu items, and the menu items with higher weights have higher priorities and are closer to the center of the interface when the icon is displayed, thereby facilitating the user to find the menu item.
In some embodiments, the interface dynamic display method further includes collecting click times of each menu item periodically, adjusting the weight of the corresponding menu item according to the collected click times of each menu item at regular intervals (for example, every half day, every day, or every week), wherein the higher the collected click times is, the higher the corresponding weight is, and adjusting the position of the icon corresponding to the menu item in the interface according to the adjusted weight. Therefore, in the embodiment, the weight of each menu item can be dynamically adjusted, and the position of the icon of the menu item in the interface can be automatically adjusted according to the weight change.
In another embodiment, in addition to adjusting the position of the icon of the menu item in the interface according to the weight of the menu item, the icon of the menu item with higher weight is closer to the center of the interface, and further, in this embodiment, the method further comprises the following steps: and setting the size of the corresponding icon according to the weight of the menu item, so that the icon of the menu item with the larger weight is larger, when the icon corresponding to the menu item is arranged on the interface, the size of the icon arranged in the center of the interface is the largest, and other icons are gradually reduced from the center to the periphery. Therefore, the more heavily weighted icons of the menu items are closer to the center of the interface, and the size of the icons is larger, so that the user can conveniently find the icon of the menu item with higher weight.
In this embodiment, icons of menu items of different weights may be displayed in different sizes by controlling the icon scaling. For example, an icon may be enlarged in proportion to the weight of the corresponding menu item, so that the icon corresponding to the menu item with larger weight has larger size.
In the implementation mode, the display style of the deleted icon in the interface is readjusted, so that the icon arrangement vacancy formed after the icon in the interface is deleted can be automatically supplemented. And by configuring the priority of the menu items and adjusting the display style of the icons of the menu items on the interface according to the priority, the display position (such as the middle position) of the interface in the icon arrangement of the menu item with high priority can be enabled, and the icon size of the menu item with high priority is enabled to be larger than that of the icon with low priority, so that the user can click conveniently.
In another embodiment, there are more icons corresponding to menu items in the interface, so that the icons in the interface need to be browsed through the sliding interface. Therefore, in order to browse the icons in the interface conveniently, in addition to adopting the icon size adjustment according to the weight described in the above embodiment, the icon size arranged in the center of the interface is made the largest, and the other icons are gradually reduced from the center to the periphery, and in this embodiment, further considering the situation when the interface is browsed in a sliding manner, the icon in the interface is moved in the sliding direction, and the size of the icon is gradually increased when the icon is moved toward the center of the interface during the movement, and the size of the icon is also gradually reduced when the icon is moved away from the center of the interface. The icons sliding towards the center of the interface are gradually increased in size, and the icons far away from the center of the interface are gradually decreased in size. Therefore, in the embodiment, in the interface sliding process, the size of the icon displayed in the interface is dynamically adjusted, the same icon is different in size at different positions in the interface when moving, and the size of the icon is the largest when the icon moves to the center of the interface. Therefore, in the embodiment, the icons of the menu items with high weights are distributed in the center of the interface, the icon sizes are larger, and the icons sliding to the center of the interface are enlarged and displayed during interface sliding browsing, so that the icons with high weights can be highlighted, and each icon can be easily found during interface sliding browsing.
As shown in fig. 3, the interface of a song requesting system is schematically illustrated, wherein the interface has a plurality of song requesting menu items in different modes, the icons of the menu items have a plurality of different display widths, and the display widths of the icons of the different menu items gradually change along a certain direction. The middle part of the interface of the song ordering device is provided with at least icons of song ordering menu items with a plurality of different functions, such as 'song name', 'singer', 'song order by voice', 'list', 'song kind', and the like, the icons are arranged in two rows and three columns in the interface, and the positions of the icons and the display widths of the icons (namely the sizes of the icons) are gradually changed along each row or each column. Therefore, the icons are linearly and gradually changed in dimensions in different directions, and the display styles of the icons are richer.
In the embodiment shown in fig. 3, the middle of the interface of the song ordering system includes six icons at the top of the menu, namely, "song title", "singer", "voice song order", "list", "song seed", and "CHIVAS", the six icons are arranged in three rows and two columns on the song ordering interface, and the icons in the same row or the same column are gradually increased in the reduction ratio value from the center of the interface to the periphery, so that the size of the icons is gradually reduced from the center of the interface to the periphery.
As shown in fig. 4, according to the above embodiment, the two adjacent icons have different sizes, and the icons are enlarged or reduced during the sliding process. The size of the icon in the sliding process is calculated according to the following method:
in the process that the icon slides towards the adjacent icon n-1, the width W of the icon at a certain moment is as follows: w = (W) n-1 -W n )*d/D+W n (ii) a The icons are squares, and the squares shown in fig. 4 are icons. Before the icon is not slid, the center line L n Passing through the center of the icon, another centerline L n-1 Through the center of the adjacent icon n-1 of said icon, said midline L n And said middle line L n-1 Parallel to said median line L n And said middle line L n-1 The distance between the center point of the icon and the central line L at a certain moment in the sliding process of the icon to the adjacent icon n-1 is D n D is more than or equal to 0 and less than or equal to D, and the width of the icon is W n The width of the adjacent icon n-1 is W n-1 . By this embodiment, the size of the icon during the sliding process can be clearly known.
As shown in fig. 4, a plurality of parallel middle lines (e.g., middle line 1, middle line 2, and middle line 3 in fig. 4) are disposed on the interface, where each middle line corresponds to one icon arranged on the interface, and the middle line passes through the center of the corresponding icon.
As shown in fig. 4, icons of five menu items of icons 1 to 5 exist in the interface, the icons 1 to 5 are arranged longitudinally along the interface, and the positions and sizes of the icons 1 to 5 are gradually changed. In the embodiment, a plurality of central lines 1, 2 and 3 are arranged on the interface, wherein the central lines 1, 2 and 3 are parallel to each other, the central line 1 passes through the middle of the icon 1, the central line 2 passes through the middle of the icon 2, and the central line 3 passes through the middle of the icon 3.
Assuming that a central line 2 passes through the center point of the icon, the icon (the icon is a square) is moved to the central line 1, the distance from the center point of the icon to the central line 2 is D, and the distance from the central line 1 to the central line 2 is D, then the width W of the icon is W = (W 1 -W 2 )*d/D+W 2 . W is 2 Width of the icon before the sliding, W 1 The midline 1 is the width of the adjacent icon, passing through the center point of the adjacent icon.
If it is assumed that the central line 3 passes through the center point of the icon, the icon is slid toward the central line 2, and the width W of the icon sliding process is: w is W = (W) 2 -W 3 )*d/D+W 3 . The distance between the center point of the icon and the central line 3 is D, the distance between the central line 1 and the central line 2 is D, and the width of the icon before sliding is W 3 W is as described 1 Is the width of adjacent icons is W 2 The central line 2 passes through the center point of the neighboring icon.
When browsing the interface, an input operation may be performed by a screen sliding operation (for a touch display screen) or by an input device such as a mouse or a keyboard, and an icon displayed in the interface may also be moved according to the input operation. For example, when the interface is slid in a certain direction, the icons in the interface are also moved in response to the sliding operation. In one embodiment, when the icon at the top of the interface is far away from the top boundary of the interface or the icon at the bottom of the interface is far away from the bottom boundary of the interface, the movement of the icon is slowed down or stopped, so that a movement damping effect is presented.
As shown in fig. 3, in which the icons of the menu item "singer" are located at the topmost position among all the icons, when the interface is slid down, each icon in the interface moves down, and when all the icons move down and the topmost "singer" icon has moved away from the boundary at the top of the interface (or a preset distance from the top of the interface), the rate at which each icon moves down becomes smaller or each icon no longer moves down with the sliding operation. Similarly, when the interface is slid up and the bottom-most icon has left the interface bottom boundary, the rate at which the icons move up becomes smaller or the icons no longer move up with the sliding operation. Through the above operation, the icon, during sliding, when sliding to the top, slows down the sliding speed or has the effect of springback.
Further, when the icon at the top most part of the interface is far away from the top boundary of the interface or the icon at the bottom most part of the interface is far away from the bottom boundary of the interface, the method further comprises the following steps:
and the whole icon displayed in the interface shrinks towards the sliding direction, and the icon restores the display style before shrinking after the sliding is finished.
In one embodiment, the interface dynamic display method further includes the steps of: when the icons in the interface do not slide, the icons in the interface are controlled to be gradually enlarged and reduced according to a preset period, the icons are enlarged and reduced for one time, the time for enlarging and reducing the icons is different, more than one icon is enlarged and reduced at the same time, and the icon breathing display effect is achieved. And gradually enlarging and reducing the icon in the control interface according to a preset period to realize the breathing display effect of the icon. Wherein, the frequency of the period can be 5 seconds or 6 seconds, and the scale of the icon zooming in and out can be 0.6 to 1.5; therefore, the icon in the interface can present a breathing display effect, so that the icon display is more regular. Meanwhile, the time for one enlargement and reduction of the same icon is different, for example, the time for one enlargement of one icon is 0.4s, and the time for one reduction is 0.6s. When the interface is slid, the icons in the interface stop zooming in and out; when the sliding stops, the interface icon is enlarged and reduced again according to the preset period.
In another embodiment, as shown in fig. 5, a device 500 is provided, the device having an interface 501 for human-computer interaction, the interface displaying icons of more than two menu items, the electronic device may be any one of a computer, a mobile phone, a video-on-demand device, and the like. The device is provided with a storage medium, the storage medium is stored with control instructions, and when the control instructions are executed by a processor, the interface dynamic display method display in any one of the above embodiments is executed.
It should be noted that, although the above embodiments have been described herein, the scope of the present invention is not limited thereby. Therefore, based on the innovative concepts of the present invention, the technical solutions of the present invention can be directly or indirectly applied to other related technical fields by making changes and modifications to the embodiments described herein, or by using equivalent structures or equivalent processes performed in the content of the present specification and the attached drawings, which are included in the scope of the present invention.

Claims (10)

1. A dynamic interface display method is characterized by comprising the following steps:
the method comprises the steps that the electronic equipment receives and installs an interface display template, a user can conveniently display an interface of the electronic equipment, the interface display template comprises a display style of an interface icon and menu items corresponding to the interface icon, the display template is sent to the electronic equipment by a cloud server, the cloud server configures functions of a plurality of electronic equipment, the configuration comprises the display style of the icon in the interface, the display style of the interface icon comprises the icon and the position of the icon in the interface, the icon is provided with a plurality of icons, and the number of the menu items in the interface display template is larger than that of the menu items of the electronic equipment, wherein application software is installed in the electronic equipment; when an icon corresponding to a menu item which is not in the function list is clicked, the icon cannot jump to a corresponding function interface;
inquiring whether the function corresponding to the menu item in the interface display template exists in a function list of the electronic equipment or not, wherein all the installed application software of the electronic equipment are recorded in the function list of the electronic equipment;
if not, deleting the icons corresponding to the menu items in the interface display template, and adjusting the display positions of the remaining icons corresponding to the menu items on the interface according to the weight, if so, displaying the icons of the menu items on the display interface according to the icon display style in the interface display template.
2. The dynamic interface display method according to claim 1, wherein said adjusting display positions of icons corresponding to the remaining menu items on the interface according to the weight comprises:
presetting the weight of a menu item, wherein the weight is determined based on the number of times the menu item is clicked, or the weight is determined based on the number of times the menu item is expected to be clicked;
and configuring the positions of the icons on the interface according to the weights of the rest menu items, wherein the heavier the menu item is, the more the corresponding icon is centered at the arrangement position of the interface.
3. The dynamic interface display method of claim 1, further comprising the steps of:
the method includes the steps of collecting the number of clicks of icons corresponding to menu items in an interface, counting the number of clicks of the icons corresponding to the menu items according to a preset period, rearranging the display positions of the icons corresponding to the menu items on the interface according to the number of clicks of the icons corresponding to the menu items, wherein the more the number of clicks is, the more the positions of the icons corresponding to the menu items on the interface are.
4. The interface dynamic display method according to claim 1, further comprising the steps of:
when the icons corresponding to the menu items are arranged on the interface, the size of the icons arranged in the center of the interface is the largest, and other icons are gradually reduced from the center to the periphery.
5. The interface dynamic display method according to claim 1, further comprising the steps of:
when the interface is slid, the icons move along the sliding direction, the size of the icons sliding to the center of the interface is gradually increased, and the size of the icons far away from the center of the interface is gradually decreased.
6. The dynamic interface display method according to claim 5, wherein, in the icon sliding process, the width W of the icon at a certain time is: w = (W) n-1 -W n )*d/D + W n (ii) a A predetermined central line L n And the middle line L n-1 Said middle line L n Through the center of the icon, another center line L n-1 Through the center of the adjacent icon n-1 of said icon, said midline L n And said middle line L n-1 Parallel to said median line L n And said middle line L n-1 The distance between the icons is D, and the center point of the icon is separated from the center line L at a certain moment in the process that the icon slides towards the adjacent icon n-1 n D is more than or equal to 0 and less than or equal to D, and the width of the icon is W n The width of the adjacent icon n-1 is W n-1 。
7. The dynamic interface display method according to claim 1, wherein the interface includes more than two rows or more than two columns of icons, and the icons in the same row or the same column have gradually larger reduction scale values along the direction from the center to the periphery of the interface.
8. The interface dynamic display method according to claim 1, wherein when the interface is slid, the icons in the interface are moved synchronously along the sliding direction; when the icon configured as the topmost is far away from the top boundary of the interface or the icon configured as the bottommost is far away from the bottom boundary of the interface, the movement of the icon is slowed down or stopped.
9. The interface dynamic display method according to claim 1, further comprising the steps of: when the icons in the interface do not slide, the icons in the interface are controlled to be gradually enlarged and reduced according to a preset period, the icons are enlarged and reduced for one time, the time for enlarging and reducing the icons is different, more than one icon is enlarged and reduced at the same time, and the icon breathing display effect is achieved.
10. An electronic device, said device having an interface for human-computer interaction, said interface displaying icons of more than two menu items, wherein said icons of menu items are displayed according to the interface dynamic display method of any one of claims 1-9.
CN202011172047.8A 2020-10-28 2020-10-28 Interface dynamic display method and equipment Active CN112433656B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202011172047.8A CN112433656B (en) 2020-10-28 2020-10-28 Interface dynamic display method and equipment

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202011172047.8A CN112433656B (en) 2020-10-28 2020-10-28 Interface dynamic display method and equipment

Publications (2)

Publication Number Publication Date
CN112433656A CN112433656A (en) 2021-03-02
CN112433656B true CN112433656B (en) 2023-04-18

Family

ID=74696358

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202011172047.8A Active CN112433656B (en) 2020-10-28 2020-10-28 Interface dynamic display method and equipment

Country Status (1)

Country Link
CN (1) CN112433656B (en)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN116185243B (en) * 2023-04-28 2023-07-21 苏州市世为科技有限公司 Man-machine interaction data processing, evaluating and early warning system

Family Cites Families (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110201388A1 (en) * 2010-02-15 2011-08-18 Research In Motion Limited Prominent selection cues for icons
CN102436473B (en) * 2011-09-29 2018-07-24 用友软件股份有限公司 Menu management device and menu managing method
CN102662601A (en) * 2012-05-02 2012-09-12 李凯 Graph menu display method
CN104903856A (en) * 2013-12-15 2015-09-09 宇龙计算机通信科技(深圳)有限公司 Application icon adaptive adjustment method and terminal
CN111782130B (en) * 2014-06-24 2024-03-29 苹果公司 Column interface for navigating in a user interface
CN105930020B (en) * 2015-12-29 2019-09-17 中国银联股份有限公司 A kind of method and device of the icon of management terminal application program
CN107688423A (en) * 2017-05-19 2018-02-13 平安科技（深圳）有限公司 The management method and processing equipment of menu option in a kind of system
CN107422940A (en) * 2017-07-31 2017-12-01 努比亚技术有限公司 A kind of icon display method, mobile terminal and computer-readable recording medium
CN107491248A (en) * 2017-08-24 2017-12-19 小草数语（北京）科技有限公司 Menu display method, device, terminal device and computer-readable recording medium
CN107992301B (en) * 2017-11-27 2020-02-21 腾讯科技（上海）有限公司 User interface implementation method, client and storage medium
CN110673908A (en) * 2019-09-03 2020-01-10 北京量子保科技有限公司 Interface generation method, device, medium and electronic equipment

Also Published As

Publication number Publication date
CN112433656A (en) 2021-03-02

Similar Documents

Publication Publication Date Title
US10831359B2 (en) Scroll bar control
AU2017203263B2 (en) Arranging tiles
EP3221778B1 (en) Tab sweeping and grouping
US8281252B2 (en) User interface component
US10175854B2 (en) Interaction in chain visualization
KR101031974B1 (en) Scrollable and re-sizeable formula bar
EP2851790A1 (en) Method for displaying icon ranking and terminal device
US9594432B2 (en) Electronic device, control setting method and program
US20140164960A1 (en) Method for grouping and managing web pages
CN102955671A (en) Terminal and method for executing application using touchscreen
WO2007094902A2 (en) New object search ui and dragging object results
KR20080011326A (en) Improved pocket computer and associated methods
WO2023045927A1 (en) Object moving method and electronic device
CN112433656B (en) Interface dynamic display method and equipment
CN114327105A (en) Split screen display control method and device, electronic equipment and storage medium
CN103324387A (en) System and method for displaying sub-file interfaces
US20180088785A1 (en) Navigating a set of selectable items in a user interface
US20120174030A1 (en) Navigating among higher-level and lower-level windows on a computing device
JP2000194473A (en) Display system

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant