Method for preventing collision of interface elements, method and system for providing an interface

Abstract

The present application discloses a method for preventing collision of interface elements, a method for providing an interface, and a system. Among them, the method for preventing collision of interface elements includes: determining the layout state information of a target interface element and its related dynamic elements in a user interface; determining at least a candidate output position of the dynamic element according to the layout state information of the target interface element and the dynamic element; determining a collision prevention object for performing collision prevention processing on the dynamic element and its layout state information; determining whether a collision occurs between the dynamic element and the collision prevention object when the dynamic element is located at the candidate output position according to the candidate output position and the layout state information of the collision prevention object; determining a target position among the candidate output positions where it is determined that the dynamic element does not collide with the collision prevention object as the display output position of the dynamic element. Through this method, the occlusion problem when displaying dynamic elements can be reduced or avoided, and the usability of element functions and the designed interface can be improved.

Description

Technical Field

[0001] The present invention relates to the field of computer graphics, and particularly to a method for preventing collision of interface elements, a method and a system for providing an interface. Background Art

[0002] Computer technology, which is widely used in the design field, has greatly improved the implementation efficiency and design quality of design objectives. Computer-aided design products such as computer-aided design software or online design services, etc., the realization of their functions includes providing human-computer interaction related to design operations. Good interaction logic and a smooth and easy-to-use operation interface are often indispensable for efficiently achieving the design intentions of designers. Therefore, when developing auxiliary design software or providing such services, how to improve the usability of design auxiliary products in terms of human-computer interaction is one of the key issues to be considered.

[0003] During the process of using computer-aided design products, users carry out design operations through the interaction interfaces provided by the products. The user interaction interfaces can be software interfaces or online pages according to different product forms. For example, the user interaction interface of an online design service can be implemented in the form of a page. The user interaction interfaces of computer-aided design products usually include different types of elements to achieve the function control of instance objects and reach the design objectives. In practical applications, with the enrichment of interaction functions, more and more elements are displayed in the same user interaction interface, and the element layout of the interaction interface is an important factor affecting the use efficiency of computer-aided design products. How to improve the use efficiency of computer-aided design products through more user-friendly element layout management is a technical problem that needs to be solved by those skilled in the art. Summary of the Invention

[0004] Embodiments of the present invention provide a method for preventing collision of interface elements, a method and a system for providing an interface, which can reduce or even avoid the occlusion problem between dynamic elements and related target interface elements or other interface elements when displaying dynamic elements, and improve the usability of the functions of dynamic elements and the design interface.

[0005] The present invention provides the following solutions:

[0006] A method for preventing collision of interface elements, comprising:

[0007] Determining the layout state information of target interface elements and their related dynamic elements in a user interface;

[0008] Determining at least a candidate output position of the dynamic element according to the layout state information of the target interface element and the dynamic element;

[0009] Determining a collision prevention object for performing collision prevention processing on the dynamic element and its layout state information;

[0010] Based on the candidate output position and the layout status information of the anti-collision object, determine whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is located at the candidate output position;

[0011] Determine a target position among the candidate output positions where it is determined that the dynamic element does not collide with the anti-collision object, and use it as the display output position of the dynamic element.

[0012] A method for providing an interface, including:

[0013] A reading process, a preprocessing process, and a loading and display process;

[0014] Among them,

[0015] The reading process includes: reading an interface configuration, where the interface configuration includes the layout status information of each interface element in the interface;

[0016] The preprocessing process includes: determining a target interface element with an associated dynamic element in the interface configuration, determining the layout status information of the target interface element and its associated dynamic element, determining the candidate output position of the dynamic element, determining the anti-collision object for anti-collision processing with the dynamic element and its layout status information; performing collision detection based on the candidate output position and the layout status information of the anti-collision object, and determining, among the candidate output positions where the dynamic element does not collide with the anti-collision object, the one to be used as the display output position of the dynamic element;

[0017] The loading and display process includes: loading and displaying each interface element in the interface framework according to the interface configuration, and loading the display output position of the dynamic element of the target interface element.

[0018] An interface element anti-collision method, including:

[0019] In the interface of a home design application, determine the layout status information of the instance elements of the home design and their related dynamic elements;

[0020] Determine at least the candidate output position of the dynamic element based on the layout status information of the instance element and the dynamic element;

[0021] Determine the anti-collision object for anti-collision processing with the dynamic element and its layout status information;

[0022] Based on the candidate output position and the layout status information of the anti-collision object, determine whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is located at the candidate output position;

[0023] Determine a target position among the candidate output positions where the dynamic element does not collide with the anti-collision object, and use it as the display output position of the dynamic element.

[0024] A system for providing an interface, comprising:

[0025] A layout management module for storing an interface configuration, where the interface configuration includes layout state information of each interface element in the interface;

[0026] A collision detection module for determining the layout state information of a target interface element and its associated dynamic element, determining the candidate output position of the dynamic element, determining an anti-collision object for performing anti-collision processing with the dynamic element and its layout state information; performing collision detection based on the candidate output position and the layout state information of the anti-collision object, and determining a target position among the candidate output positions where the dynamic element does not collide with the anti-collision object as the display output position of the dynamic element.

[0027] A display output module for displaying each interface element according to the layout state information of each interface element, and displaying the dynamic element according to the display output position.

[0028] An electronic device, comprising:

[0029] One or more processors; and

[0030] A memory associated with the one or more processors, where the memory is used to store program instructions, and when the program instructions are read and executed by the one or more processors, the steps of the method described in any one of the foregoing are performed.

[0031] A computer-readable storage medium, on which a computer program is stored, and when the program is executed by a processor, the steps of the method described in any one of the foregoing are implemented.

[0032] According to the specific embodiments provided in this application, the following technical effects are disclosed in this application:

[0033] Through the method for preventing collision of interface elements provided by this application, the layout state information of target interface elements and their related dynamic elements in the user interface can be determined. The candidate output positions of the dynamic elements can be determined according to the layout state information of the target interface elements and the dynamic elements. The anti-collision objects for performing anti-collision processing with the dynamic elements and their layout state information can be determined. Collision detection is performed on the candidate output positions and the anti-collision objects according to the candidate output positions and the layout state information of the anti-collision objects. The target position is determined from the candidate output positions where it is determined that the dynamic elements do not collide with the anti-collision objects, and is used as the display output position of the dynamic elements. Through this method, before the dynamic elements of the target interface elements are displayed, the candidate output positions can be determined at the relevant positions of the target interface elements, and the collision situation between the dynamic elements and the anti-collision objects when the dynamic elements appear at the candidate output positions can be predicted. The positions where no collision occurs are determined as the output positions of the dynamic elements, thereby effectively reducing or even avoiding the problem of occlusion with the relevant target interface elements or other interface elements when the dynamic elements are displayed, avoiding the unavailability of the functions provided by the dynamic elements due to occlusion, ensuring the effectiveness of the functions of the dynamic elements and the usability of the designed interface, and improving the use efficiency of computer-aided design products.

[0034] Of course, it is not necessary for any product implementing this application to achieve all the above-mentioned advantages simultaneously. BRIEF DESCRIPTION OF THE DRAWINGS

[0035] In order to more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the following will briefly introduce the drawings required to be used in the embodiments. Obviously, the drawings in the following description are only some embodiments of the present invention. For those of ordinary skill in the art, other drawings can be obtained based on these drawings without creative efforts.

[0036] Figure 1 is a schematic diagram of element collision in the user interface provided by an embodiment of this application;

[0037] Figure 2 is a flowchart of the first method provided by an embodiment of this application;

[0038] Figure 3 is a schematic diagram of a dynamic element, its reference position point, and candidate output positions provided by an embodiment of this application;

[0039] Figure 4 is a schematic diagram of determining candidate output positions provided by an embodiment of this application;

[0040] Figure 5 is a schematic diagram of the distance between the reference position point and the click position provided by an embodiment of this application;

[0041] Figure 6It is a schematic diagram of graphic collision detection provided by an embodiment of the present application;

[0042] Figure 7 It is a flowchart of the second method provided by an embodiment of the present application;

[0043] Figure 8 It is a flowchart of the third method provided by an embodiment of the present application;

[0044] Figure 9 It is a schematic diagram of the system provided by an embodiment of the present application;

[0045] Figure 10 It is a schematic diagram of the first device provided by an embodiment of the present application;

[0046] Figure 11 It is a schematic diagram of the second device provided by an embodiment of the present application;

[0047] Figure 12 It is a schematic diagram of the third device provided by an embodiment of the present application;

[0048] Figure 13 It is a schematic diagram of the electronic device provided by an embodiment of the present application. Detailed implementation manners

[0049] Next, the technical solutions in the embodiments of the present invention will be clearly and completely described in conjunction with the accompanying drawings in the embodiments of the present invention. Obviously, the described embodiments are only a part of the embodiments of the present invention, rather than all the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those of ordinary skill in the art shall fall within the protection scope of the present invention.

[0050] In the process of using computer-aided design products, the designer directly faces the user interface of the product. The user interface may include various types and functions of interface elements. For example, it may include mold elements, user-defined instance elements, control tool elements, information display elements, etc. In the following content, for the convenience of narration, various types of elements displayed in the user interface are all referred to as interface elements, and some of these interface elements may have the need to display related dynamic elements. Regarding the dynamic elements related to interface elements, for example, to facilitate the use of some elements in the interface, an auxiliary function element is provided in the product. The auxiliary function element usually includes function options for operating the corresponding element to achieve quick operations on the corresponding element. This kind of auxiliary function element is usually presented dynamically and can be displayed dynamically when a specific operation signal or event occurs. For example, when the mouse pointer is above a certain instance element or the instance element is clicked, an auxiliary function element including the quick operation options of the instance element can be displayed at a certain position. When the mouse moves away or another element is clicked, the auxiliary function element will not be displayed. Compared with the elements presented fixedly, the elements with dynamics in display can be regarded as dynamic elements. The above-mentioned auxiliary function element is a kind of dynamic element.

[0051] Dynamic elements facilitate the use of designed products, but in the prior art, the processing method for displaying dynamic elements is relatively single, and the problem of "element collision" that may be brought about is not considered. That is to say, when displaying dynamic elements, there may be an occlusion phenomenon between them and other interface elements. As Figure 1 shown, it is a schematic diagram of element collision in the user interface. The figure includes a part of the user interface of a home design product. Among them, element 1101 is a user-defined instance element "sofa". When a mouse click occurs and the operation focus is on this element, the dynamic element 1102 associated with the "sofa" is displayed. Some function options for operating the "sofa" are included in the dynamic element 1102. When the dynamic element 1102 is displayed at the position shown in the figure, it collides with element 1201, resulting in a part of the dynamic element 1102 being occluded by element 1201, and some of the function options it contains cannot be directly used. In this case, to use the auxiliary function of the dynamic element 1102 that is occluded, only by moving element 1201 away or moving element 1101, the usability of the auxiliary function of the dynamic element becomes worse.

[0052] Embodiment 1

[0053] Regarding the collision problem between dynamic elements and other interface elements in the above interface, Embodiment 1 of the present application provides an anti-collision method for interface elements, which can be applied to auxiliary design products such as home design tools. This method can determine the candidate output positions of dynamic elements at the edge positions of the target interface elements before the dynamic elements associated with the target interface elements are displayed, and predict the collision situation with anti-collision objects when the dynamic elements are to be output at each candidate output position, so as to screen out the candidate output positions without collision with anti-collision objects for displaying and outputting dynamic elements, achieving determining a suitable collision-avoiding position to display dynamic elements before displaying the dynamic elements of the target interface element, avoiding the inability to use the functions of dynamic elements caused by the collision between dynamic elements and anti-collision objects, and improving the usability of computer-aided design products from the perspective of avoiding collisions.

[0054] As Figure 2 shown, it is a flowchart of the anti-collision method for interface elements provided by Embodiment 1 of the present application. This method may include the following steps:

[0055] S210: Determine the layout state information of the target interface element and its related dynamic elements in the user interface.

[0056] The user interface may have different interface forms according to different product forms. It may be an interface of auxiliary design software or may include an online page provided by an online design service. The method provided in Embodiment 1 of the present application can be used for anti-collision output of dynamic elements and other elements in a variety of different interface forms. In this method, first, the target interface element and its layout state information in the user interface can be determined, and the layout state information of the dynamic elements related to the target interface element can be determined. The target interface element may be the element focused by the user, the element operated on, or the element to be pre-operated in the current interface. Specifically, when determining the target interface element, the interface element targeted by a specific signal or event can be determined as the target interface element. For example, when the mouse pointer is above a certain interface element, this interface element can be determined as the target interface element; or when a click event occurs for a certain interface element, the clicked interface element can be determined as the target interface element; or according to the hierarchical relationship of elements, the interface element located in the upper layer with related dynamic elements can be determined as the target interface element. The target interface element is correlated with the dynamic element. For example, the dynamic element may be the aforementioned auxiliary function element, and the auxiliary function element is associated with the target interface element, which may include shortcut function options related to the target interface element to implement shortcut operations on the target interface element, or prompt information for the next design item of the target interface element, etc.

[0057] The layout state information of interface elements may include: the size, position, layer, attributes, etc. of interface elements. Some elements may include sub-interface elements, and each sub-interface element also has corresponding layout state information. The types of layout state information of sub-interfaces are similar to those of the above-mentioned interface elements and will not be elaborated here. The layout state information of interface elements can be saved in a configuration file, and the layout state information of target interface elements and their related dynamic elements in the user interface can be determined by reading the configuration file. In some systems provided with a layout management module, the layout management module has the function of storing the layout information of each element in the user interface. In such a system, the layout state information of target interface elements and the layout state information of related dynamic elements can be obtained through the layout management module. The layout state information of target interface elements usually refers to the current effective layout state information. When the layout state of a target interface element changes to another state due to an operation, the updated layout state of the target interface element can be used as the effective layout state.

[0058] S220: Determine the candidate output positions of the dynamic elements based on at least the layout state information of the target interface elements and the dynamic elements;

[0059] After determining the layout state information of the target interface elements and their related dynamic elements in the user interface, the candidate output positions of the dynamic elements related to the target interface elements can be determined. The candidate output positions are the candidate positions that can be used to output the dynamic elements related to the target interface elements, and they are the candidate positions that have not undergone collision detection. The candidate output positions can be further subjected to collision detection to determine whether there is a display occlusion phenomenon with the target interface elements or other interface elements. Based on the correlation between the target interface elements and the dynamic elements, the determined candidate positions can generally be determined around the target interface elements. For example, they can be on the edges or near the boundaries of the target interface elements, etc., to meet the requirements of their correlation and operation habits.

[0060] The candidate output positions of the dynamic elements related to the target interface element can be determined according to the layout state information of the target interface element and the related dynamic elements. For example, based on the layout state information of the target interface element and the related dynamic elements, the candidate output positions of the dynamic elements can be determined at positions such as the vertices, edges, or boundaries of the target interface element. The layout state information of the target interface element can include information reflecting the layout state of the target interface element, such as shape, position, display level, etc. Therefore, according to the layout state information of the target interface element, a specific position in the related area of the target interface element can be determined as the candidate output position of the dynamic element. It should be noted that the types of layout state information listed above are only examples of the types of layout state information, and can be flexibly selected or increased or decreased according to needs in actual applications. The above examples should not be construed as a limitation on the embodiments of the present application.

[0061] When specifically determining the candidate output positions of the dynamic elements according to the layout state information of the target interface element and the related dynamic elements, the reference position points can be determined at least according to the layout state information of the target interface element. Furthermore, the candidate output positions corresponding to each reference position point can be determined according to the positions of the reference position points and the layout state information of the dynamic elements. The reference position points can be points at positions such as on the edge or near the boundary of the target interface element. Determining the reference position points according to the layout state information of the target interface element can include, but is not limited to, any one of the following reference position points:

[0062] The polygon vertices determined by the layout state information of the target interface element;

[0063] The midpoints of the polygon edges determined by the layout state information of the target interface element;

[0064] In addition, in addition to according to the layout state of the target interface element, the click position can also be referred to simultaneously to determine the reference position points. In specific implementation, the reference position points can include the feet of the perpendiculars from the click point when the target interface element is clicked to each side of the polygon determined by the layout state information of the target interface element.

[0065] In actual applications, any one of the above can be used as the reference position point. Of course, a combination of any several of them can also be used, or other types of reference position points can be determined at positions such as on the edge or near the boundary of the target interface element to make the output of the dynamic element more flexible and meet more different usage habits. In the following content, the reference position points of the type of polygon vertices of the target interface element will be mainly introduced. When other types of reference position points are used, similar implementations can be referred to the disclosed content. The determination of the reference position points and the determination of the corresponding candidate output positions will be introduced in detail below with reference to the drawings.

[0066] SeeFigure 3 , is a schematic diagram of dynamic elements, their reference position points, and candidate output positions, as Figure 3 shown. Among them, when using the polygon vertices of the target interface element as the reference position points of the target object 4, the determined reference position points include:

[0067] {P 1 , P 2 , P 3 , P 4 , P 5}

[0068] The coordinates of each point among them are respectively:

[0069] (x 1 , y 1 ), (x 2 , y 2 ), (x 3 , y 3 ), (x 4 , y 4 ), (x 5 , y 5 )

[0070] The area formed by connecting these points in counterclockwise order identifies the area of the target object 4:

[0071] S t [P 1 , P 2 , P 3 , P 4 , P 5

[0072] Similarly, for the convenience of subsequent description, the areas of interface element a, interface element b, interface element c, interface element d, and interface element e can be respectively represented as:

[0073] S a [P a1 , P a2 , P a3 , P a4

[0074] S b [P b1 , P b2 , P b3 , P b4

[0075] S 2 [P c1 , P c2 , P c3 , P c4

[0076] S​​​​d [P d1 ,P d2 ,P d3 ,P d4

[0077] S e [P e1 ,P e2 ,P e3 ,P e4

[0078] The area of the dynamic element related to the target interface element is represented as:

[0079] S o [P o1 ,P o2 ,P o3 ,P o4

[0080] S o Before being given actual position data, it can be used as an expression form of the area of the dynamic element and also as an expression form of the candidate output position of the dynamic element.

[0081] When the graph of the target interface element is an irregular graph, for the convenience of processing, it can be determined whether the graph of the target interface element is an irregular graph according to the local state information of the target interface element. If the graph of the target interface element is an irregular graph, the graph of the target interface element is processed by fitting into a regular graph, and the candidate output position of the relevant dynamic element is determined according to the processed regular graph. In the method provided in the first example of this application, the irregular graph can include a graph with a side line containing an arc, a concave polygon, etc. As Figure 3 shown, when Object 1 or Object 3, etc. is used as the target interface element, it can be used as an irregular graph because its side line contains an arc. When processing such a target interface element, first, the graph of the target interface element can be obtained by fitting into a regular graph. For example, it can be fitted into an upright rectangle, and then the reference position point and the candidate output position are determined according to the fitted regular graph. In some cases, if the layout shape of the dynamic element is also the above irregular graph, the shape of the dynamic element can also be processed by fitting, and then position determination and output, etc. are processed according to the fitted regular graph.

[0082] ​​​After determining each reference position point, the corresponding candidate output positions of each reference position point can be determined according to the position of the reference position point and the layout state information of the dynamic element. The layout state information of the dynamic element may include the size of the dynamic element, such as length, width, etc.; or it may be other information indicating the size of the dynamic element, such as the number of auxiliary tools it contains; in addition, it may also include the display hierarchy information of the dynamic element, which can be used to determine the display hierarchy of the dynamic element or compare it with the display hierarchy of other elements. Specifically, when determining the candidate output position, several candidate output positions of the size of the dynamic element can be determined around the reference position point. Refer to Figure 4 FIG. Figure 4 As shown in 1 , taking the reference position point P Figure 4 as an example, FIGS. (a) and (b) respectively show two ways of determining the corresponding candidate output positions according to the reference position point. 1 The implementation method in (a) is to determine four candidate output positions in the four quadrants of the two-dimensional coordinate system with the reference position point P Figure 4 as the origin. Each output position is adjacent to each other, and the calculation is relatively simple when applying this implementation method; 1 The implementation method in (b) is to determine four candidate output positions in the four quadrants of the two-dimensional coordinate system with the reference position point P 1 as the origin. Each of the determined candidate output positions has an offset of a preset distance from the two axes of the two-dimensional coordinate system. As shown in the figure, the offsets d 2 and d 1 . In practical applications, the values of d 2 and d 1 can be equal. For the sake of brief description, the following introduces the case where the offsets on the two axes are equal. Let the offsets on both axes be d. At this time, four candidate output positions can be determined in four directions based on the reference position point P 1 . Specifically, taking the reference position point P 11 as the origin, four points P 12 , P 13 , P 14 are obtained by offsetting on the two axes respectively. Among them,

[0083] the coordinates of P 11 are (x 1 + d, y 1 + d), the coordinates of P 12 are (x 1 - d, y 1 + d), the coordinates of P 13 are (x 1 - d, y 1-d), P 14 has coordinates (x 1 +d, y 1 -d). Based on the layout status information of the dynamic element and the coordinate information of the four points P 11 , P 12 , P 13 , P 14 , the candidate output positions corresponding to these four points can be determined respectively. For example, when the length value length and width value width of the dynamic element are determined according to the layout status information of the dynamic element, for the candidate output position at point P 11 :

[0084] S 11 [P o1 , P o2 , P o3 , P o4

[0085] where the values of each point in S 11 can be determined based on the coordinates of P 11 and the length value and width. The values of each point in S 11 are as follows:

[0086]

[0087] Similarly, the candidate output positions S 12 , P 13 , P 14 can be determined, and S 12 , S 13 and S 14 are respectively:

[0088] S 12 = [(x 1 -d, y 1 +d + width), (x 1 -d - length, y 1 +d + width), (x 1 -d - length, y 1 +d), (x 1 -d, y 1 +d)]

[0089] S 13 = [(x 1 -d, y 1 -d), (x 1 -d - length, y 1 -d), (x 1 -d - length, y 1 -d - width), (x​1 -d, y 1 -d - width]]

[0090] S 14 = [(x 1 + d + length, y 1 - d), (x 1 + d, y 1 - d), (x 1 - d, y 1 - d - width), (x 1 + d + length, y 1 - d - width)]

[0091] Similarly, for other reference position points P 2 to P 5 , the corresponding candidate output positions can be determined in the four directions of each reference position point in the same way. The determined candidate output positions are as shown in Figure 3 S 11 -5 14 , S 21 -S 24 , S 31 -S 34 , S 41 -5 44 , and S 51 -S 54 , etc. A total of 20 candidate output positions are determined. Determining the candidate output positions of each reference position point in the way of Figure 4 (b) in it can reduce the coincidence of the candidate output positions with the points or lines of the target interface element and improve the effectiveness of anti - collision detection. The candidate output positions related to each reference position point can be denoted as:

[0092] P 2 : [S 21 , S 22 , S 23 , S 24

[0093] P 5 : [S 51 , S 52 , S 53 , S 54

[0094] P 3 : [S 31 , S 32 , S 33 , S 34

[0095] P 4 : [S​​​41 ,S 42 ,S 43 ,S 44

[0096] After determining each candidate output position, a preliminary screening can be performed on the candidate output positions to determine whether there is an overlapping part between each candidate output position and the target interface element, and filter out the candidate output positions with overlap. This method is essentially equivalent to using the target interface element as an anti-collision object to perform collision detection with the candidate output positions, and the amount of calculation and calculation method are also equivalent.

[0097] S230: Determine the anti-collision object for performing anti-collision processing with the dynamic element and its layout state information;

[0098] The anti-collision object includes the interface element object for performing anti-collision processing with the dynamic element. Before performing collision detection, it can be first determined which interface elements are used as anti-collision objects to perform anti-collision processing with the dynamic element. The anti-collision object can include the target interface element itself associated with the dynamic element, or other interface elements in the user interface except the target interface element. Of course, both can also be determined as anti-collision objects to perform anti-collision processing with the dynamic element. For example, Figure 3 in it, the object 4 as the target interface element can be determined as the anti-collision object, or other elements such as element a to element e can be determined as the anti-collision object.

[0099] In practical applications, all elements in the interface can be used as anti-collision objects for performing anti-collision processing with the dynamic element, or the interface elements can be classified at a certain angle and screened to determine a part of them as anti-collision objects to participate in collision detection to improve the efficiency of collision detection. In one implementation, it can be determined according to whether the interface element is a variable layout element. The variable layout element includes interface elements with variable layout states such as position and shape. Such elements may often change their layout states due to user operations (such as dragging, stretching of elements, etc.), and are more likely to occlude the dynamic element compared to interface elements with unchanging layouts. Therefore, the variable layout element can be used as the anti-collision object.

[0100] ​In another implementation, it is also possible to determine which interface elements are anti-collision objects based on the distance between the interface element and the target interface element. Generally, the width and height of dynamic elements are limited. If the distance between an interface element and the target interface element is significantly greater than the width and height of the dynamic element, then when the dynamic element is displayed at the edge of the target interface element, it will not occlude the interface element, and there is no need to perform collision detection on this interface element. Specifically, a preset distance can be determined, and other interface elements with a distance less than the preset distance from the target interface element are determined as anti-collision objects. The determination of the preset distance can refer to the larger value among the widths or heights of all possible dynamic elements in the interface. In practical applications, the method of determining anti-collision objects for which collision detection is to be performed among interface elements may not be limited to the methods listed above. Additionally, multiple different methods can be combined to determine anti-collision objects.

[0101] Interface elements in the user interface usually correspond to certain hierarchical information to achieve hierarchical control of each interface element during display. The hierarchical information of the interface element can be included in the layout state information. When the hierarchy of the target interface element is higher than that of the first interface element, when displaying dynamic elements related to the target interface element, it is usually not occluded by the first interface element with a lower display hierarchy, even if there is an overlapping area between the first interface element and the target interface element. In this case, the hierarchical relationship between the two can be determined based on the respective layout state information of the target interface element and the first interface element. According to the hierarchical relationship, it is determined whether the target interface element is at a higher hierarchical level than the first interface element. If so, collision detection between the first interface element and the dynamic element can be skipped, that is, the first interface element is excluded from the anti-collision objects.

[0102] In addition, in some cases, there may be a certain logical interaction relationship between the dynamic element and other interface elements. When excluding interface elements that do not require collision detection, it is also possible to consider whether there is a logical interaction relationship between the dynamic element and the anti-collision object to avoid affecting the operation logic of the two. Specifically, the hierarchical relationship between the two can be determined based on the respective layout state information of the target interface element and the second interface element, and the constraint relationship information of the interface elements in the user interface is obtained. The constraint relationship information can include information on whether there is a logical interaction relationship between the dynamic element and the second interface element; when the dynamic element is at a higher hierarchical level than the second interface element and there is no logical interaction relationship between the two, collision detection between the second interface element and the dynamic element is not performed.

[0103] S240: Determine whether the dynamic element collides with the anti-collision object when the dynamic element is located at the candidate output position according to the candidate output position and the layout state information of the anti-collision object;

[0104] When performing anti-collision processing, it is possible to determine whether a collision occurs between a dynamic element and an anti-collision object when the dynamic element is located at a candidate output position based on the candidate output position and the layout status information of the anti-collision object. Among them, the two parties to be subjected to collision detection are each candidate output position and each anti-collision object. For example, the candidate output position can be, for example, Figure 3 the 20 candidate output positions shown, and the anti-collision objects can be Figure 3 Object 4, Element c, and Element d in. According to the candidate output position and the layout status information of the anti-collision object, it is possible to determine whether the areas where they are located overlap or are blocked, that is, it is possible to determine whether a collision occurs between the two.

[0105] When multiple anti-collision objects need to be subjected to collision detection with a dynamic element, it can be carried out sequentially; and there are usually multiple candidate output positions. When performing collision detection, it is possible to perform collision detection with the anti-collision object for each candidate output position one by one. The goal of collision detection can be to perform collision detection for each candidate output position, or it can also end until a candidate output position that has no occlusion with all anti-collision objects (that is, has no collision with all anti-collision objects) is found.

[0106] In a preferred embodiment, the reference position points can be sorted in a certain manner, and then collision detection with the anti-collision object is sequentially performed on the candidate output positions corresponding to the reference position points. Since there is a correlation between the reference position point and the corresponding candidate output position, sorting the reference position points can be similarly equivalent to sorting the candidate output positions. Substantially, when there is a certain processing order for multiple candidate output positions corresponding to a reference position point, such as judging one by one counterclockwise from the upper right candidate output position, the collision detection for each candidate output position also has a specific order. When specifically implementing, there can be various sorting methods. One implementation method is to determine the click position when the target interface element is clicked, and sort the reference position points according to the distance between each reference position point and the click position; as Figure 5 shown, it is a schematic diagram of the distance between the reference position point and the click position. In the figure, the coordinates of the click position t are t(x,y), and the distance from t to P 1 (x 1 ,y 1 ) is:

[0107]

[0108] In the same way, the distances from the click position t to the reference position points P 2 , P 3 , P 4 , P 5 can be obtained as d 2 , d 3 , d4 , d 5 , sort d 1 to d 5 in ascending order:

[0109] orderByMinDitance(d 1 , d 2 , d 3 , d 4 , d 5 )

[0110] The sorted result is: d 1 , d 2 , d 5 , d 3 , d 4 ; After obtaining the sorted result, during the process of determining whether there is a collision with the anti-collision object when determining the candidate output position, according to the sorted result of the reference position points, it is determined in turn whether there is a collision with the anti-collision object when the dynamic element is at the candidate output position corresponding to each reference position point. The advantage of this method is that the position selected in the order of the distance from the click point is more convenient to click, so it is more convenient to operate and more likely to conform to the user's habit. As Figure 3 shown, after obtaining the above sorted result, collision detection is first performed on the four candidate output positions corresponding to the reference position point P1 according to the sorting. According to the counterclockwise order of S 11 -S 12 -S 13 -S 14 , first, S 11 is successively detected for collision with the anti-collision objects S a , S b , S c , S d , S e and S t . It can be determined that the candidate output position S 11 does not overlap with the above anti-collision objects, that is, S 11 does not collide with the above anti-collision objects.

[0111] Another sorting method can be to sort the reference position points in a specific quadrant order in a two-dimensional coordinate system with the click position point as the origin. For example, sort the reference position points in the order of the second, first, third, and fourth quadrants. Among the reference position points in the same quadrant, the points closer to the horizontal axis have a higher sorting. It is also possible to sort the reference position points in a clockwise or counterclockwise order.

[0112] In addition, the priority of each reference position point can be sorted according to the shape characteristics of the target interface element and / or the dynamic element; the shape characteristics can be determined according to the layout state information of the target interface element or the dynamic element. For example, it can be determined according to the layout state information of the target interface element that the target interface element is a rectangle with a width greater than the height, and the related dynamic element is an auxiliary function element arranged horizontally, and its width is also greater than the height. At this time, higher priorities can be assigned to the reference position points on the upper and lower edges of the target interface element. When determining whether a collision occurs with a collision prevention object at the candidate output position, the result of sorting the reference position points can be followed to determine in turn whether a collision occurs with the collision prevention object when the dynamic element is at the candidate output position corresponding to each reference position point. In this way, when displaying the dynamic element, while facilitating operation, the coordination between the target interface element and the dynamic element in display output can be ensured as much as possible.

[0113] As described above, when performing collision detection, collision detection can be performed on each candidate output position, or it can also end until a candidate output position that does not collide with the collision prevention object is found. In the implementation mode of combining the sorting of the reference position points, the strategy of ending once a candidate output position that does not collide with the collision prevention object is found can be preferably used.

[0114] Specifically, when implementing the collision detection between a candidate output position and the area of a collision prevention object, taking the case where both are rectangles, which is also a relatively common case in specific applications, as Figure 6 shown, it is a schematic diagram of graphic collision detection, where a collision prevention object includes four vertices H 1 , H 2 , H 3 and H 4 ; a candidate output position has four vertices as shown in P o1 , P o2 , P o3 and P o4 . The specific method for performing collision detection on the two can be to judge the value of the following formula:

[0115] (H 4 .y ≤ P o2 .y) && (H 2 .y ≥ P o4 .y) && (H 4 .x ≥ P o2 .x) && (H 2 .x ≤ P o4 .x)

[0116] where, H 4 .y represents the vertex H 4The y - coordinate value, and so on. When all the conditions in the formula are satisfied, the value of the entire judgment condition is True, indicating that there is an overlap in the graphics, that is, it is likely that the selected output position collides with the area of the anti - collision object.

[0117] S250: Determine a target position among the candidate output positions where the dynamic element does not collide with the anti - collision object, and use it as the display output position of the dynamic element.

[0118] Through collision detection, among the candidate output positions, the candidate output positions where the dynamic element does not collide with the anti - collision object can be determined as the target positions, so that the dynamic element can be output and displayed at these target positions. When a target object corresponds to multiple dynamic elements and multiple corresponding target positions need to be determined, they can also be determined one by one or in parallel according to the above process.

[0119] During the use of the interface, when some variable layout elements change their layout states due to user operations or other reasons, it may affect the dynamic elements whose display output positions have been determined. When the dynamic elements are still output according to the currently determined display positions, they may be blocked by the variable layout elements whose layout states have changed. Therefore, when the layout state of the interface elements changes in the user interface, it is possible to re - determine whether the dynamic element collides with the anti - collision object when the dynamic element is located at the candidate output position, so as to re - determine the target position as the display output position of the dynamic element. To reduce the computational cost, when it is necessary to re - determine the target position due to the change in the layout state of the interface elements, only the interface elements whose layout states have changed can be listed as anti - collision objects for collision detection.

[0120] In addition, there may be certain constraint relationships between different interface elements. According to the constraint relationships between interface elements, when the layout state of the third interface element in the user interface changes, the fourth interface element with a constraint relationship with it will also change its layout state accordingly. For example, when the third interface element is dragged and moved, a part of it falls on the position that originally belonged to the fourth interface element, and the constraint relationship between the third interface element and the fourth interface element determines that the two cannot overlap. After the layout state of the third interface element changes as described above, the fourth interface element will automatically change its position, size or other layout states to achieve the constraint goal of not overlapping with the third interface element. In this case, when re-determining the target position as the display output position of the dynamic element, the interface elements whose layout states have changed can be determined as anti-collision objects. Specifically, the constraint relationship information of the interface elements in the user interface can be obtained. The constraint relationship information includes the position constraint relationship between the third interface element and the fourth interface element. When the layout state of the third interface element in the user interface changes, the third interface element whose layout state has changed, and the fourth interface element whose layout state has changed according to the position constraint relationship can be determined as anti-collision objects, and then collision detection with each candidate output position can be performed.

[0121] In some applications or services, the layout states of each interface element in the interface can be uniformly managed through a preset module. For example, when the user interface is initialized, the layout state information of all elements in the user interface and the constraint relationship information between the elements can be registered in the preset module. All elements in the user interface include the aforementioned target interface elements, dynamic elements related to the target interface elements, and other interface elements in the user interface except the target interface elements. Through the preset module, layout state information registration and management can be provided. When the layout state information of certain elements changes, the changed layout state information can be updated and stored in a timely manner, and necessary information can be provided for other modules, such as the collision detection module, to achieve the unified management of all elements in the interface and improve the processing efficiency of the layout state information of the interface elements.

[0122] The above has introduced in detail the method for preventing collision of interface elements provided in the first embodiment of the present application. This method can determine the layout state information of target interface elements and their related dynamic elements in the user interface, determine the candidate output positions of the dynamic elements according to the layout state information of the target interface elements and the dynamic elements, determine the anti-collision objects for performing anti-collision processing with the dynamic elements and their layout state information, perform collision detection on the candidate output positions and the anti-collision objects according to the candidate output positions and the layout state information of the anti-collision objects, and determine the target position among the candidate output positions where the dynamic elements do not collide with the anti-collision objects as the display output position of the dynamic elements. Through this method, before displaying the dynamic elements of the target interface elements, the candidate output positions can be determined at the relevant positions of the target interface elements, the collision situation between the dynamic elements and the anti-collision objects when the dynamic elements appear at the candidate output positions can be predicted, and the position where no collision occurs is determined as the output position of the dynamic elements, thereby effectively reducing or even avoiding the problem of occlusion with the relevant target interface elements or other interface elements when displaying the dynamic elements, reducing the problem of element collision, making the functions provided by the dynamic elements no longer invalid due to occlusion, and thus no longer needing to move the occluding elements to make full use of them, ensuring the effectiveness of the dynamic element functions and the usability of the designed interface, and improving the use efficiency of computer-aided design products. Further, the reference position points can be sorted in a certain manner, and then the collision detection between the candidate output positions corresponding to each reference position point and the anti-collision objects is performed in sequence according to the sorting result. In this way, while avoiding element collision, a more convenient and more user-friendly target position can be obtained as the display output position of the dynamic elements.

[0123] Embodiment 2

[0124] The second embodiment of the present application discloses a method for providing an interface. Before loading or displaying each element of the interface, anti-collision preprocessing can be performed on the interface elements with associated dynamic elements, the display output positions of the dynamic elements associated with the interface elements can be determined and recorded in advance, and after outputting and displaying each interface element, when using the interface elements with associated dynamic elements, the pre-determined and anti-collision processed display output positions can be used for displaying the output of the associated dynamic elements, avoiding occlusion with the relevant target interface elements or other interface elements when displaying the dynamic elements, and improving the usability of computer-aided design products. As Figure 7 shown, it is a flowchart of the method for providing an interface disclosed in the second embodiment of the present application. This method can include an S710 reading process, an S720 preprocessing process, and an S730 loading and displaying process.

[0125] Among them,

[0126] The S710 reading process includes: reading the interface configuration, which may include the layout state information of each interface element in the interface; the interface configuration can be saved in the form of a file, which may include resources and description content related to the interface elements, such as interface code, picture files, layout state information, etc. As mentioned above, the layout state information of the interface elements, such as the size, position, layer, attributes, etc. of the interface elements, can be used to determine the layout state information of the target interface element and its related dynamic elements in the user interface by reading the configuration file.

[0127] The S720 preprocessing process includes: determining the target interface element with associated dynamic elements in the interface configuration, determining the layout state information of the target interface element and its associated dynamic elements, determining the candidate output positions of the dynamic elements, and determining the anti-collision objects for anti-collision processing with the dynamic elements and their layout state information; performing collision detection based on the candidate output positions and the layout state information of the anti-collision objects, and determining the display output position of the dynamic elements among the candidate output positions where the dynamic elements do not collide with the anti-collision objects. The specific processing of the S720 preprocessing process can refer to the content of steps S210 to S250 in Embodiment 1 of this application. The difference is that the preprocessing process provided in Embodiment 2 of this application performs anti-collision preprocessing based on the read interface configuration before loading or displaying each interface element to the display front end. The preprocessing process can be performed in the background.

[0128] The S730 loading and display process includes: loading and displaying each interface element in the interface framework according to the interface configuration, and loading the display output positions of the dynamic elements of the target interface element. After the preprocessing process is completed, each interface element can be loaded and displayed in the interface framework according to the interface configuration. For dynamic elements with dynamic display characteristics, they can be loaded first, and then when a specific signal or event occurs, such as when the mouse pointer is located at the target, or when a click event occurs for a certain interface element, the corresponding dynamic elements related to the target interface element can be displayed at the display output position.

[0129] The method for providing an interface provided in the second embodiment of the present application is introduced above. This method can read the interface configuration, perform anti-collision preprocessing on the dynamic elements associated with the target interface elements and the anti-collision objects, and obtain the display output positions where the dynamic elements and the anti-collision objects do not collide. Through this method, before loading or displaying each interface element, anti-collision preprocessing can be performed on the interface elements with associated dynamic elements, and the display output positions of the dynamic elements associated with the interface elements can be determined and recorded in advance. After outputting and displaying each interface element, when using the interface elements with associated dynamic elements, the pre-determined and anti-collision processed display output positions can be used for the display output of the associated dynamic elements, avoiding occlusion with relevant target interface elements or other interface elements when displaying the dynamic elements, and improving the usability of computer-aided design products.

[0130] Embodiment 3

[0131] Embodiment 3 of the present application discloses a method for providing an interface, which can be applied to a home design tool. The interface includes instance elements used in home design, such as the "sofa" instance element placed by the user into the design canvas. The instance elements of home design are associated with dynamic elements, and through the dynamic elements, the control of the instance elements of home design can be realized, such as changing the size of the instance elements of home design, displaying the information of the instance elements of home design, etc. This method for providing an interface can determine the candidate output positions of the dynamic elements at the edge positions of the instance elements of home design (such as the "sofa" instance element placed by the user into the interface) before the display of the dynamic elements associated with the instance elements of home design, and predict the collision situation with the anti-collision objects when the dynamic elements are to be output at each candidate output position, so as to screen out the candidate output positions where no collision will occur for the display output of the dynamic elements of the instance elements of home design, achieving the determination of a suitable collision-avoiding position to display the dynamic elements before the display of the dynamic elements of the instance elements of home design, avoiding the inability to use the functions of the dynamic elements caused by the collision of the dynamic elements with the anti-collision objects, and improving the usability of the home design tool product from the perspective of avoiding collisions. As Figure 8 shown, the method may include the following steps:

[0132] S810: In the interface of the furniture design application, determine the layout state information of the instance elements of home design and their associated dynamic elements;

[0133] The interface for furniture design applications can have different interface forms according to different product forms, which can be the interface of furniture design application software or can also include the online pages provided by online furniture design services. First, the layout state information of the example elements of home design can be determined, and the layout state information of its related dynamic elements can be determined. The example elements targeted by a specific signal or event can be determined as target elements, and their layout state information can be obtained. Determining the layout state information of the example elements of home design and their related dynamic elements can include information such as the size, position, level, and attributes of the elements.

[0134] S820: Determine the candidate output positions of the dynamic elements based at least on the layout state information of the example elements and the dynamic elements;

[0135] S830: Determine the anti-collision objects for performing anti-collision processing with the dynamic elements and their layout state information;

[0136] S840: Based on the candidate output positions and the layout state information of the anti-collision objects, determine whether a collision occurs between the dynamic elements and the anti-collision objects when the dynamic elements are located at the candidate output positions;

[0137] S850: Determine the target position among the candidate output positions where it is determined that no collision occurs between the dynamic elements and the anti-collision objects as the display output position of the dynamic elements.

[0138] Steps S820 to S850 can refer to the corresponding steps in Embodiment 1, and the specific implementation content will not be elaborated here. Embodiment 3 of the present application discloses a method for providing an interface, which can be applied to a home design tool. Before displaying the dynamic elements associated with the example elements of home design, the candidate output positions of the dynamic elements are determined, the collision situations between the candidate output positions and the anti-collision objects are predicted, and the candidate output positions where no collision occurs are selected for displaying the dynamic elements related to the example elements of home design. Before displaying the dynamic elements of the example elements of home design, a suitable collision-avoiding position can be determined to display the dynamic elements, avoiding the inability to use the functions of the dynamic elements caused by the collision between the dynamic elements and the anti-collision objects, and improving the usability of the home design tool product.

[0139] Embodiment 4

[0140] Embodiment 4 of the present application discloses a system for providing an interface, as Figure 9 shown. The system can include:

[0141] A layout management module 910, configured to store interface configurations, where the interface configurations can include the layout state information of each interface element in the interface;

[0142] The collision detection module 920 can be used to determine the layout state information of the target interface element and its associated dynamic elements, determine the candidate output positions of the dynamic elements, determine the anti-collision objects for anti-collision processing with the dynamic elements and their layout state information; perform collision detection based on the candidate output positions and the layout state information of the anti-collision objects, and determine the target position as the display output position of the dynamic element among the candidate output positions where the dynamic element does not collide with the anti-collision object. When determining the layout state information of the target interface element and its associated dynamic elements, the layout state information of both can be provided by the layout management module 910. For other specific implementations of the functions of the collision detection module 920, reference can be made to the content of steps S210 to S250 in Embodiment 1 of this application.

[0143] The display output module 930 is used to display each interface element according to the layout state information of each interface element, and display the corresponding dynamic element according to the determined display output position.

[0144] The above introduces the system for providing an interface provided in Embodiment 4 of this application. The system can store the interface configuration through the layout management module, determine the layout state information of the target interface element and its associated dynamic elements through the collision detection module, determine the candidate output positions of the dynamic elements, perform collision detection on the candidate output positions and the anti-collision objects, and determine the display output position of the dynamic element as the target position among the candidate output positions where the dynamic element does not collide with the anti-collision object. Through this system, before displaying the dynamic elements of the target interface element, candidate output positions can be determined at relevant positions of the target interface element, and the collision situation of the dynamic element with the anti-collision object when it appears at the candidate output position can be predicted, and the position where no collision occurs is determined as the output position of the dynamic element, thereby effectively reducing or even avoiding the problem of being blocked by relevant target interface elements or other interface elements when displaying dynamic elements, and improving the usability of computer-aided design products.

[0145] Corresponding to the interface element anti-collision method provided in Embodiment 1 of this application, an interface element anti-collision device is also provided, as Figure 10 shown. The device may include:

[0146] The layout state determination unit 1010 is used to determine the layout state information of the target interface element and its related dynamic elements in the user interface;

[0147] The candidate position determination unit 1020 is used to determine the candidate output positions of the dynamic elements at least according to the layout state information of the target interface element and the dynamic elements;

[0148] The anti-collision object determination unit 1030 is used to determine the anti-collision objects for anti-collision processing with the dynamic elements and their layout state information;

[0149] A collision detection unit 1040, configured to determine whether a collision occurs between a dynamic element and an anti-collision object when the dynamic element is located at a candidate output position according to the candidate output position and the layout state information of the anti-collision object;

[0150] A display position determination unit 1050, configured to determine a target position from the candidate output positions where no collision occurs between the dynamic element and the anti-collision object, and use it as the display output position of the dynamic element.

[0151] Among them, the candidate position determination unit 1020 may include:

[0152] A reference position determination subunit, configured to determine a reference position point at least according to the layout state information of the target interface element;

[0153] A candidate position determination subunit, configured to determine corresponding candidate output positions for each reference position point according to the position of the reference position point and the layout state information of the dynamic element.

[0154] The reference position determination subunit may specifically be configured to determine any one or a combination of several of the following reference position points according to the layout state information of the target interface element:

[0155] The vertices of the polygon determined by the layout state information of the target interface element;

[0156] The midpoints of the sides of the polygon determined by the layout state information of the target interface element;

[0157] The feet of the perpendiculars from the click point when the target interface element is clicked to the sides of the polygon determined by the layout state information of the target interface element.

[0158] The candidate position determination subunit may specifically be configured to: determine four candidate output positions in the four quadrants of the two-dimensional coordinate system with the reference position point as the origin, where each determined candidate output position has an offset of a preset distance from the two axes of the two-dimensional coordinate system.

[0159] In one implementation manner, the interface element anti-collision device may further include:

[0160] A first reference position sorting unit, configured to determine the click position when the target interface element is clicked, and sort each reference position point according to the distance between each reference position point and the click position;

[0161] In this implementation manner, the collision detection unit 1040 may specifically be configured to:

[0162] According to the result of sorting the reference position points, it is determined in sequence whether a collision occurs with the anti-collision object when the dynamic element is at the candidate output positions corresponding to the respective reference position points.

[0163] In one implementation, the interface element anti-collision device may further include:

[0164] A second reference position sorting unit, configured to perform priority sorting on each reference position point according to the shape features of the target interface element and / or the dynamic element; wherein, the shape features are determined according to the layout state information of the target interface element and / or the dynamic element;

[0165] In this implementation manner, the collision detection unit 1040 may specifically be configured to:

[0166] According to the result of performing priority sorting on the reference position points, it is determined in sequence whether a collision occurs with the anti-collision object when the dynamic element is at the candidate output positions corresponding to the respective reference position points.

[0167] The anti-collision object for performing anti-collision processing with the dynamic element may include:

[0168] The target interface element, and / or, other interface elements in the user interface except the target interface element.

[0169] When the anti-collision object includes other interface elements, the anti-collision object determination unit 1030 may be used for

[0170] Determine a preset distance, and determine the other interface elements whose distance from the target interface element is less than the preset distance as the anti-collision object.

[0171] In one implementation, the interface element anti-collision device may further include:

[0172] A graphic fitting unit, configured to determine whether the graphic of the target interface element is an irregular graphic according to the local state information of the target interface element; if the graphic of the target interface element is an irregular graphic, then fit the graphic of the target interface element into a regular graphic through fitting, and the candidate position determination unit 1020 is configured to determine the candidate output positions of the relevant dynamic element according to the processed regular graphic.

[0173] In one implementation, the anti-collision object determination unit 1030 is specifically configured to determine the hierarchical relationship between the target interface element and the first interface element according to the respective layout state information of the target interface element and the first interface element; determine whether the target interface element is located at a higher hierarchical level than the first interface element according to the hierarchical relationship, and if so, no collision detection is performed on the first interface element with respect to the dynamic element.

[0174] In another embodiment, the anti-collision object determination unit 1030 is specifically configured to determine the hierarchical relationship between the target interface element and the second interface element according to the respective layout state information of the two; obtain the constraint relationship information of the interface elements in the user interface; the constraint relationship information includes information on whether the dynamic element has a logical interaction relationship with the second interface element; when the dynamic element is at a higher hierarchical level than the second interface element and the two do not have a logical interaction relationship, collision detection between the second interface element and the dynamic element is not performed.

[0175] In one embodiment, the interface element anti-collision device may further include:

[0176] The position re-determination unit is configured to, when a layout state change of an interface element occurs in the user interface, re-determine whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is at the candidate output position, so as to re-determine the target position as the display output position of the dynamic element.

[0177] In this embodiment, the anti-collision object determination unit 1030 is specifically configured to obtain the constraint relationship information of the interface elements in the user interface; the constraint relationship information includes the position constraint relationship between the third interface element and the fourth interface element; when a layout state change occurs to the third interface element in the user interface, the third interface element whose layout state has changed and the fourth interface element whose layout state has changed according to the position constraint relationship are determined as the anti-collision object.

[0178] In one embodiment, the interface element anti-collision device may further include:

[0179] The interface information registration unit is configured to, when the user interface is initialized, register the layout state information of all elements in the user interface and the constraint relationship information between the elements into a preset module; wherein, all elements in the user interface include the target interface element, the dynamic element related to the target interface element, and other interface elements in the user interface except the target interface element.

[0180] Corresponding to the method for providing an interface provided in the second embodiment of the present application, there is also provided a device for providing an interface, as Figure 11 shown, the device may include:

[0181] The interface configuration reading unit 1110 is configured to read the interface configuration, and the interface configuration includes the layout state information of each interface element in the interface;

[0182] A preprocessing unit 1120, configured to determine target interface elements in an interface configuration that have associated dynamic elements, determine layout status information of the target interface elements and their associated dynamic elements, determine candidate output positions of the dynamic elements, and determine collision prevention objects for performing collision prevention processing on the dynamic elements and their layout status information; perform collision detection according to the candidate output positions and the layout status information of the collision prevention objects, and determine, from the candidate output positions where no collision occurs between the dynamic elements and the collision prevention objects, a display output position as the dynamic elements; and,

[0183] A loading and display unit 1130, configured to load and display each interface element in an interface framework according to the interface configuration, and load the display output positions of the dynamic elements of the target interface elements.

[0184] Corresponding to the interface element collision prevention method provided in Embodiment 3 of this application, another interface element collision prevention device is also provided. As Figure 12 shown, the device may include:

[0185] A layout information determination unit 1210, configured to determine layout status information of instance elements of home design and their associated dynamic elements in an interface of a home design application;

[0186] A candidate position calculation unit 1220, configured to determine candidate output positions of the dynamic elements at least according to the layout status information of the instance elements and the dynamic elements;

[0187] An object element determination unit 1230, configured to determine collision prevention objects for performing collision prevention processing on the dynamic elements and their layout status information;

[0188] A collision calculation unit 1240, configured to determine whether a collision occurs between the dynamic elements and the collision prevention objects when the dynamic elements are located at the candidate output positions according to the candidate output positions and the layout status information of the collision prevention objects;

[0189] A display determination unit 1250, configured to determine a target position from the candidate output positions where no collision occurs between the dynamic elements and the collision prevention objects as the display output position of the dynamic elements.

[0190] In addition, an embodiment of this application also provides a computer-readable storage medium, on which a computer program is stored, and when the program is executed by a processor, the steps of the method described in any one of the foregoing method embodiments are implemented.

[0191] And an electronic device, including:

[0192] One or more processors; and

[0193] A memory associated with one or more processors, the memory being configured to store program instructions that, when read and executed by the one or more processors, perform the steps of the method described in any of the foregoing method embodiments.

[0194] Wherein, Figure 13 An exemplary architecture of an electronic device is shown. For example, device 1300 may be a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, a medical device, a fitness device, a personal digital assistant, an aircraft, etc.

[0195] Referring to Figure 13 , device 1300 may include one or more of the following components: a processing component 1302, a memory 1304, a power supply component 1306, a multimedia component 1308, an audio component 1310, an input / output (I / O) interface 1312, a sensor component 1314, and a communication component 1316.

[0196] The processing component 1302 generally controls the overall operation of the device 1300, such as operations associated with display, telephone calls, data communication, camera operations, and recording operations. The processing element 1302 may include one or more processors 1320 to execute instructions to complete the steps of the video playback method provided by the technical solution of the present disclosure, which include: when a preset condition is met, generating a traffic compression request and sending it to the server, wherein the traffic compression request records information for triggering the server to obtain a target attention area, and the traffic compression request is used to request the server to preferentially guarantee the bit rate of the video content within the target attention area; playing the video content corresponding to the bitstream file returned by the server, wherein the bitstream file is a video file obtained by the server performing bit rate compression processing on the video content outside the target attention area according to the traffic compression request. In addition, the processing component 1302 may include one or more modules to facilitate the interaction between the processing component 1302 and other components. For example, the processing unit 1302 may include a multimedia module to facilitate the interaction between the multimedia component 1308 and the processing component 1302.

[0197] The memory 1304 is configured to store various types of data to support the operation of the device 1300. Examples of such data include instructions for any application or method operating on the device 1300, contact data, phone book data, messages, pictures, videos, and the like. The memory 1304 can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk, or optical disk.

[0198] The power supply component 1306 provides power to various components of the device 1300. The power supply component 1306 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power for the device 1300.

[0199] The multimedia component 1308 includes a screen that provides an output interface between the device 1300 and the user. In some embodiments, the screen may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen can be implemented as a touch screen to receive input signals from the user. The touch panel includes one or more touch sensors to sense touches, swipes, and gestures on the touch panel. The touch sensors can not only sense the boundaries of touch or swipe actions, but also detect the duration and pressure associated with the touch or swipe operation. In some embodiments, the multimedia component 1308 includes a front camera and / or a rear camera. When the device 1300 is in an operating mode, such as a shooting mode or a video mode, the front camera and / or the rear camera can receive external multimedia data. Each of the front camera and the rear camera can be a fixed optical lens system or have a focal length and optical zoom capabilities.

[0200] The audio component 1310 is configured to output and / or input audio signals. For example, the audio component 1310 includes a microphone (MIC) that is configured to receive external audio signals when the device 1300 is in an operating mode, such as a call mode, a recording mode, and a voice recognition mode. The received audio signals can be further stored in the memory 1304 or transmitted via the communication component 1316. In some embodiments, the audio component 1310 further includes a speaker for outputting audio signals.

[0201] The I / O interface 1312 provides an interface between the processing component 1302 and a peripheral interface module, which can be a keyboard, a click wheel, buttons, etc. These buttons can include, but are not limited to: a home button, a volume button, a start button, and a lock button.

[0202] The sensor assembly 1314 includes one or more sensors for providing a status assessment of various aspects of the device 1300. For example, the sensor assembly 1314 can detect the on / off state of the device 1300, the relative positioning of components, such as the display and keypad of the device 1300. The sensor assembly 1314 can also detect a change in the position of the device 1300 or a component of the device 1300, the presence or absence of user contact with the device 1300, the orientation or acceleration / deceleration of the device 1300, and the temperature change of the device 1300. The sensor assembly 1314 can include a proximity sensor configured to detect the presence of nearby objects without any physical contact. The sensor assembly 1314 can also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor assembly 1314 can also include an acceleration sensor, a gyroscope sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.

[0203] The communication component 1316 is configured to facilitate communication between the device 1300 and other devices in a wired or wireless manner. The device 1300 can access a wireless network based on communication standards, such as WiFi, 2G, or 3G, or a combination thereof. In an exemplary embodiment, the communication component 1316 receives broadcast signals or broadcast-related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 1316 also includes a near field communication (NFC) module to facilitate short-range communication. For example, the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology, and other technologies.

[0204] In an exemplary embodiment, the device 1300 can be implemented by one or more application specific integrated circuits (ASICs), digital signal processors (DSPs), digital signal processing devices (DSPDs), programmable logic devices (PLDs), field programmable gate arrays (FPGAs), controllers, microcontrollers, microprocessors, or other electronic components for performing the above methods.

[0205] In an exemplary embodiment, a non-transitory computer-readable storage medium including instructions is further provided, such as a memory 1304 including instructions. The above instructions can be executed by a processor 1320 of a device 1300 to complete the video playback method provided by the technical solution of the present disclosure. When a preset condition is satisfied, a traffic compression request is generated and sent to a server. Information for triggering the server to obtain a target attention area is recorded in the traffic compression request. The traffic compression request is used to request the server to preferentially ensure the bit rate of video content within the target attention area; play the video content corresponding to the bitstream file according to the bitstream file returned by the server, where the bitstream file is a video file obtained by the server performing bit rate compression processing on the video content outside the target attention area. For example, the non-transitory computer-readable storage medium may be a ROM, a random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, an optical data storage device, etc.

[0206] From the description of the above embodiments, those skilled in the art can clearly understand that this application can be implemented by means of software plus a necessary general hardware platform. Based on such an understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. The computer software product can be stored in a storage medium, such as ROM / RAM, magnetic disk, optical disc, etc., and includes several instructions for causing a computer device (which may be a personal computer, a server, or a network device, etc.) to execute the methods described in various embodiments or some parts of the embodiments of this application.

[0207] Each embodiment in this specification is described in a progressive manner. The same or similar parts between the embodiments can be referred to each other, and the key point of each embodiment is to illustrate the differences from other embodiments. In particular, for a system or a system embodiment, since it is basically similar to a method embodiment, the description is relatively simple, and the relevant parts can refer to the partial description of the method embodiment. The systems and system embodiments described above are merely illustrative. The units described as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place, or may be distributed to multiple network units. Some or all of the modules can be selected according to actual needs to achieve the purpose of the solution of this embodiment. Those of ordinary skill in the art can understand and implement it without creative efforts.

[0208] The above has introduced in detail the method for preventing interface element collisions, the method and system for providing an interface provided by this application. Specific examples are used in this article to elaborate on the principle and implementation manner of this application. The description of the above embodiments is only used to help understand the method of this application and its core idea; at the same time, for those of ordinary skill in the art, according to the idea of this application, there will be changes in the specific implementation manner and application scope. In summary, the content of this specification should not be construed as a limitation to this application.

Claims

1. A method for preventing collision of interface elements, characterized in that, it includes: Determine the layout state information of the target interface element and its related dynamic elements in the user interface; Determine at least the candidate output positions of the dynamic elements according to the layout state information of the target interface element and the dynamic elements; the candidate output positions include candidate positions for outputting dynamic elements related to the target interface element, and the candidate output positions are used to predict the collision situation with the anti-collision object when the dynamic elements are to be output at the candidate output positions; Determine the anti-collision object for performing anti-collision processing with the dynamic elements and its layout state information; According to the candidate output positions and the layout state information of the anti-collision object, determine whether a collision occurs between the dynamic elements and the anti-collision object when the dynamic elements are located at the candidate output positions; the anti-collision object includes an interface element object for performing anti-collision processing with the dynamic elements; Determine the target position among the candidate output positions where it is determined that the dynamic elements do not collide with the anti-collision object, and use it as the display output position of the dynamic elements.

2. The method according to claim 1, characterized in that, The step of determining at least the candidate output positions of the dynamic elements according to the layout state information of the target interface element and the dynamic elements includes: Determine at least the reference position points according to the layout state information of the target interface element; Determine the corresponding candidate output positions of each reference position point according to the position of the reference position point and the layout state information of the dynamic elements.

3. The method according to claim 2, characterized in that, The step of determining at least the reference position points according to the layout state information of the target interface element includes: Determine any one or a combination of the following reference position points according to the layout state information of the target interface element: The polygon vertices determined by the layout state information of the target interface element; The midpoints of the polygon sides determined by the layout state information of the target interface element; The feet of the perpendiculars from the click point when the target interface element is clicked to each side of the polygon determined by the layout state information of the target interface element.

4. The method according to claim 3, characterized in that, The step of determining the corresponding candidate output positions of each reference position point according to the position of the reference position point and the layout state information of the dynamic elements includes: Determine four candidate output positions in the four quadrants of the two-dimensional coordinate system with the reference position point as the origin, and the determined candidate output positions have offset amounts with preset distances from the two axes of the two-dimensional coordinate system respectively.

5. The method according to claim 2, characterized in that, It further includes: Determine the click position when the target interface element is clicked, and sort each reference position point according to the distance between each reference position point and the click position; The step of determining whether a collision occurs between the dynamic elements and the anti-collision object when the dynamic elements are located at the candidate output positions includes: According to the sorting result of the reference position points, sequentially determine whether a collision occurs between the dynamic elements and the anti-collision object when the dynamic elements are located at the candidate output positions corresponding to each reference position point.

6. The method according to claim 2, wherein, it further comprises: performing a priority ranking on each reference position point according to the shape features of the target interface element and / or the dynamic element; the shape features are determined according to the layout state information of the target interface element and / or the dynamic element; the determining whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is located at the candidate output position includes: sequentially determining whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is located at the candidate output position corresponding to each reference position point according to the result of the priority ranking of the reference position points.

7. The method according to claim 1, wherein, the anti-collision object includes other interface elements other than the target interface element, and the method further comprises: determining a preset distance, and determining other interface elements whose distance from the target interface element is less than the preset distance as the anti-collision object.

8. The method according to any one of claims 1-7, wherein, it further comprises: determining the hierarchical relationship between the target interface element and the first interface element according to their respective layout state information; determining whether the target interface element is located at a higher hierarchical level than the first interface element according to the hierarchical relationship, and if so, not performing collision detection on the first interface element with the dynamic element.

9. The method according to any one of claims 1-7, wherein, it further comprises: when a change in the layout state of the interface elements occurs in the user interface, re-determining whether a collision occurs between the dynamic element and the anti-collision object when the dynamic element is located at the candidate output position, so as to re-determine the target position as the display output position of the dynamic element.

10. A method for providing an interface, wherein, it comprises: a reading process, a preprocessing process, and a loading and display process; wherein, the reading process includes: reading an interface configuration, and the interface configuration includes the layout state information of each interface element in the interface; the preprocessing process includes: determining a target interface element having an associated dynamic element in the interface configuration, determining the layout state information of the target interface element and its associated dynamic element, determining the candidate output position of the dynamic element, determining an anti-collision object for performing anti-collision processing on the dynamic element and its layout state information; performing collision detection according to the candidate output position and the layout state information of the anti-collision object, and determining, from the candidate output positions where no collision occurs between the dynamic element and the anti-collision object, the display output position of the dynamic element; wherein, the candidate output position includes a candidate position for outputting the dynamic element related to the target interface element, and the candidate output position is used to predict the collision situation with the anti-collision object when the dynamic element is to be output at the candidate output position; the anti-collision object includes an interface element object for performing anti-collision processing on the dynamic element; the loading and display process includes: loading and displaying each interface element in the interface framework according to the interface configuration, and loading the display output position of the dynamic element of the target interface element.

11. A method for preventing collision of interface elements, characterized in that, comprising: In the interface of the home design application, determining the layout state information of the instance elements of the home design and their related dynamic elements; Determining at least the candidate output positions of the dynamic elements according to the instance elements and the layout state information of the dynamic elements; the candidate output positions include candidate positions for outputting the dynamic elements related to the target interface elements, and the candidate output positions are used to predict the collision situation with the anti-collision object when the dynamic elements are to be output at the candidate output positions; Determining the anti-collision object for performing anti-collision processing with the dynamic elements and its layout state information; According to the candidate output positions and the layout state information of the anti-collision object, determining whether a collision occurs between the dynamic elements and the anti-collision object when the dynamic elements are located at the candidate output positions; the anti-collision object includes the interface element object for performing anti-collision processing with the dynamic elements; Determining a target position among the candidate output positions where it is determined that the dynamic elements do not collide with the anti-collision object as the display output position of the dynamic elements.

12. A system for providing an interface, characterized in that, comprising: A layout management module for storing interface configurations, where the interface configurations include the layout state information of each interface element in the interface; A collision detection module for determining the layout state information of the target interface element and its associated dynamic elements, determining the candidate output positions of the dynamic elements, determining the anti-collision object for performing anti-collision processing with the dynamic elements and its layout state information; performing collision detection according to the candidate output positions and the layout state information of the anti-collision object, and determining a target position as the display output position of the dynamic elements among the candidate output positions where the dynamic elements do not collide with the anti-collision object; wherein, the candidate output positions include candidate positions for outputting the dynamic elements related to the target interface elements, and the candidate output positions are used to predict the collision situation with the anti-collision object when the dynamic elements are to be output at the candidate output positions; the anti-collision object includes the interface element object for performing anti-collision processing with the dynamic elements; A display output module for displaying each interface element according to the layout state information of each interface element, and displaying the dynamic elements according to the display output position.

13. An electronic device, characterized in that, comprising: One or more processors; and A memory associated with the one or more processors, where the memory is used to store program instructions, and when the program instructions are read and executed by the one or more processors, the steps of the method according to any one of claims 1 to 10 are executed.

14. A computer-readable storage medium, on which a computer program is stored, characterized in that, When the program is executed by a processor, the steps of the method according to any one of claims 1 to 10 are implemented.

Images