Constraint detection methods, devices, computer equipment, and storage media for design drafts.

By analyzing the code node attributes and hierarchical relationships of the interface design draft, calculating the motion trajectory, and judging the rationality of the display constraint information, the problem of overlapping or non-overlapping interface components was solved, thus improving development efficiency.

CN117632103BActive Publication Date: 2026-03-13DOUYIN VISION CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-08-15
Publication Date
2026-03-13

AI Technical Summary

Technical Problem

During the development of the interface design draft, unreasonable display constraint settings caused abnormal overlap or non-overlap of interface components, reducing the development efficiency of developers.

Method used

By parsing the target interface code, the display attribute information and hierarchical relationship of the interface components corresponding to each code node are determined, their motion trajectory is calculated, and the rationality of the display constraint information is judged, providing constraint detection results.

Benefits of technology

The system automatically detects and displays whether the constraint information is reasonable, avoiding repeated adjustments by developers and improving development efficiency.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN117632103B_ABST
    Figure CN117632103B_ABST
Patent Text Reader

Abstract

This disclosure provides a constraint detection method, apparatus, computer device, and storage medium for a design draft. The method includes: acquiring the target interface code corresponding to the target interface design draft; parsing the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; determining the motion trajectory of the interface components corresponding to each code node based on the display attribute information and display constraint information; and determining the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory, display attribute information, and hierarchical relationship between the interface components corresponding to each code node, wherein the constraint detection result is used to characterize whether the display constraint information is reasonable.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This disclosure relates to the field of computer technology, and more specifically, to a constraint detection method, apparatus, computer device, and storage medium for a design draft. Background Technology

[0002] Design to code (D2C) is an inevitable product and trend in software development technology, enabling the conversion of interface design drafts created by designers into interface code.

[0003] In related technologies, during the design process of interface design drafts, display constraint information is often set for the interface components in the interface design drafts to achieve responsive design draft editing effects. However, due to reasons such as unreasonable setting of display constraint information, abnormal situations may occur during the development of interface design drafts, such as interface components that were not originally overlapping becoming overlapping, and / or interface components that were originally overlapping not overlapping. This may require developers to repeatedly adjust the display constraint information, thereby reducing the development efficiency of developers. Summary of the Invention

[0004] This disclosure provides at least one constraint detection method, apparatus, computer device, and storage medium for a design draft.

[0005] In a first aspect, embodiments of this disclosure provide a constraint detection method for a design draft, including:

[0006] Obtain the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components;

[0007] The target interface code is parsed to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0008] Based on the display attribute information and display constraint information of the interface components corresponding to each code node, the motion trajectory of the interface components corresponding to each code node is determined; the motion trajectory is used to characterize the position where the interface components can be deployed in the target interface design draft.

[0009] Based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between each code node, the constraint detection results corresponding to the display constraint information of each interface component in the target interface design are determined. The constraint detection results are used to characterize whether each display constraint information is reasonable.

[0010] In one possible implementation, the target interface code is stored in a node tree format.

[0011] The process of parsing the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node includes:

[0012] The target node tree corresponding to the target interface code is traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

[0013] In one possible implementation, determining the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node includes:

[0014] For any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node is determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

[0015] In one possible implementation, determining the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node includes:

[0016] Based on the hierarchical relationship between each code node, the sibling nodes in the target interface code are determined;

[0017] Based on the display attribute information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined; and based on the motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes is determined; wherein, the initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory.

[0018] Based on the initial overlap relationship and the target overlap relationship, the constraint detection results corresponding to the target interface design draft are determined.

[0019] In one possible implementation, the display attribute information of the interface component includes the initial display position information of the interface component.

[0020] The step of determining the initial overlap relationship of the interface components corresponding to the sibling nodes based on the display attribute information of the interface components corresponding to the sibling nodes includes:

[0021] Based on the initial display position information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined.

[0022] In one possible implementation, the motion trajectory includes a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction;

[0023] Determining the target overlap relationship of the interface components corresponding to the sibling nodes based on their respective motion trajectories includes:

[0024] Based on the first motion trajectories of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction is determined; and...

[0025] Based on the second motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction is determined.

[0026] In one possible implementation, determining the constraint detection result corresponding to the target interface design draft based on the initial overlap relationship and the target overlap relationship includes:

[0027] If a mismatch is detected between the initial overlap relationship and the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a failure; and,

[0028] If the initial overlap relationship is detected to match the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a pass.

[0029] In one possible implementation, the method further includes:

[0030] If the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node is adjusted to the target constraint information; or, the display constraint information of the interface components corresponding to each code node is deleted.

[0031] Secondly, embodiments of this disclosure also provide a constraint detection device for a design draft, comprising:

[0032] The acquisition module is used to acquire the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components;

[0033] The parsing module is used to parse the target interface code, determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0034] The first determining module is used to determine the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node; the motion trajectory is used to characterize the position where the interface component can be deployed in the target interface design draft;

[0035] The second determining module is used to determine the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node. The constraint detection results are used to characterize whether each display constraint information is reasonable.

[0036] In one possible implementation, the target interface code is stored in a node tree format.

[0037] The parsing module, when parsing the target interface code and determining the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node, is used for:

[0038] The target node tree corresponding to the target interface code is traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

[0039] In one possible implementation, the first determining module, when determining the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node, is used to:

[0040] For any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node is determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

[0041] In one possible implementation, the second determining module, when determining the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, is used to:

[0042] Based on the hierarchical relationship between each code node, the sibling nodes in the target interface code are determined;

[0043] Based on the display attribute information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined; and based on the motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes is determined; wherein, the initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory.

[0044] Based on the initial overlap relationship and the target overlap relationship, the constraint detection results corresponding to the target interface design draft are determined.

[0045] In one possible implementation, the display attribute information of the interface component includes the initial display position information of the interface component.

[0046] The second determining module, when determining the initial overlap relationship of the interface components corresponding to the sibling nodes based on the display attribute information of the interface components corresponding to the sibling nodes, is used to:

[0047] Based on the initial display position information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined.

[0048] In one possible implementation, the motion trajectory includes a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction;

[0049] The second determining module, when determining the target overlap relationship of the interface components corresponding to the sibling nodes based on the motion trajectories of the interface components corresponding to the sibling nodes, is used to:

[0050] Based on the first motion trajectories of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction is determined; and...

[0051] Based on the second motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction is determined.

[0052] In one possible implementation, the second determining module, when determining the constraint detection result corresponding to the target interface design draft based on the initial overlap relationship and the target overlap relationship, is used to:

[0053] If a mismatch is detected between the initial overlap relationship and the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a failure; and,

[0054] If the initial overlap relationship is detected to match the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a pass.

[0055] In one possible implementation, the second determining module is further configured to:

[0056] If the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node is adjusted to the target constraint information; or, the display constraint information of the interface components corresponding to each code node is deleted.

[0057] Thirdly, embodiments of this disclosure also provide a computer device, including: a processor, a memory, and a bus, wherein the memory stores machine-readable instructions executable by the processor, and when the computer device is running, the processor communicates with the memory via the bus, and when the machine-readable instructions are executed by the processor, the steps of the first aspect above, or any possible implementation of the first aspect, are performed.

[0058] Fourthly, embodiments of this disclosure also provide a computer-readable storage medium storing a computer program that, when executed by a processor, performs the steps of the first aspect or any possible implementation of the first aspect.

[0059] The constraint detection method, apparatus, computer equipment, and storage medium for design drafts provided in this disclosure can determine the motion trajectory of the interface components corresponding to each code node by parsing the display attribute information, display constraint information, and hierarchical relationship between each code node of the target interface code corresponding to the target interface design draft. Then, based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between each code node, the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft can be determined. In this way, by parsing the hierarchical relationship between each code node and determining the deployment positions of the corresponding UI components in the target UI design, it is possible to determine whether the overlap relationship of the UI components corresponding to each level of code node will change after deployment. If the overlap relationship changes, it indicates that the display constraint information of the UI components corresponding to the code node is set unreasonably. Thus, the constraint detection results of the display constraint information of the UI components corresponding to each level of code node can be determined layer by layer. This helps developers automatically detect whether the current display constraint information will cause changes in the overlap relationship of the UI components, thereby eliminating the need for developers to repeatedly adjust the display constraint information and improving their development efficiency.

[0060] To make the above-mentioned objects, features and advantages of this disclosure more apparent and understandable, preferred embodiments are described below in detail with reference to the accompanying drawings. Attached Figure Description

[0061] To more clearly illustrate the technical solutions of the embodiments of this disclosure, the accompanying drawings used in the embodiments will be briefly described below. These drawings are incorporated in and constitute a part of this specification. They illustrate embodiments conforming to this disclosure and, together with the specification, serve to explain the technical solutions of this disclosure. It should be understood that the following drawings only show some embodiments of this disclosure and should not be considered as limiting the scope. Those skilled in the art can obtain other related drawings based on these drawings without creative effort.

[0062] Figure 1 A flowchart illustrating a constraint detection method for a design draft provided by an embodiment of this disclosure is shown;

[0063] Figure 2 This illustration shows a schematic diagram of the architecture of a constraint detection device in a design draft provided by an embodiment of the present disclosure;

[0064] Figure 3 A schematic diagram of the structure of a computer device provided in an embodiment of this disclosure is shown. Detailed Implementation

[0065] To make the objectives, technical solutions, and advantages of the embodiments of this disclosure clearer, the technical solutions of the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only a part of the embodiments of this disclosure, and not all of them. The components of the embodiments of this disclosure described and shown in the accompanying drawings can generally be arranged and designed in various different configurations. Therefore, the following detailed description of the embodiments of this disclosure provided in the accompanying drawings is not intended to limit the scope of the claimed disclosure, but merely represents selected embodiments of this disclosure. All other embodiments obtained by those skilled in the art based on the embodiments of this disclosure without inventive effort are within the scope of protection of this disclosure.

[0066] It should be noted that similar labels and letters in the following figures indicate similar items. Therefore, once an item is defined in one figure, it does not need to be further defined and explained in subsequent figures.

[0067] In this document, the term "and / or" merely describes a relationship, indicating that three relationships can exist. For example, A and / or B can represent three cases: A alone, A and B simultaneously, and B alone. Furthermore, the term "at least one" in this document means any combination of at least two of any one or more elements. For example, including at least one of A, B, and C can mean including any one or more elements selected from the set consisting of A, B, and C.

[0068] It is understood that before using the technical solutions disclosed in the various embodiments of this disclosure, users should be informed of the types, scope of use, and usage scenarios of the personal information involved in this disclosure in an appropriate manner in accordance with relevant laws and regulations, and user authorization should be obtained.

[0069] For example, upon receiving a user's active request, a prompt message is sent to the user to explicitly inform them that the requested operation will require the acquisition and use of the user's personal information. This allows the user to independently choose whether to provide personal information to the software or hardware, such as the electronic device, application, server, or storage medium performing the operations of this disclosed technical solution, based on the prompt message.

[0070] Research has found that during the design process of interface design drafts, display constraints are often set for the interface components to achieve responsive design editing effects. However, if the display constraints are not set reasonably, it may reduce the development efficiency of developers. Therefore, how to detect whether the display constraints of interface design drafts are set reasonably has become an urgent problem to be solved in this field.

[0071] Based on the above research, this disclosure provides a constraint detection method, apparatus, computer device, and storage medium for design drafts. By parsing the display attribute information, display constraint information, and hierarchical relationship between each code node of the target interface code corresponding to the target interface design draft, the motion trajectory of the interface component corresponding to each code node can be determined. Then, based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft can be determined. In this way, by parsing the hierarchical relationship between each code node and determining the deployment positions of the corresponding UI components in the target UI design, it is possible to determine whether the overlap relationship of the UI components corresponding to each level of code node will change after deployment. If the overlap relationship changes, it indicates that the display constraint information of the UI components corresponding to the code node is set unreasonably. Thus, the constraint detection results of the display constraint information of the UI components corresponding to each level of code node can be determined layer by layer. This helps developers automatically detect whether the current display constraint information will cause changes in the overlap relationship of the UI components, thereby eliminating the need for developers to repeatedly adjust the display constraint information and improving their development efficiency.

[0072] To facilitate understanding of this embodiment, a constraint detection method for a design draft disclosed in this disclosure will first be described in detail. The execution entity of the constraint detection method for a design draft provided in this disclosure is generally a computer device with certain computing capabilities. This computer device may include, for example, a terminal device, a server, or other processing devices. The terminal device may be a user equipment (UE), mobile device, user terminal, terminal, personal digital assistant (PDA), handheld device, computing device, in-vehicle device, wearable device, etc. In some possible implementations, the constraint detection method for the design draft can be implemented by a processor calling computer-readable instructions stored in memory.

[0073] See Figure 1 The diagram shows a flowchart of a constraint detection method for a design draft provided in this embodiment of the present disclosure. The method includes steps S101 to S104, wherein:

[0074] S101: Obtain the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components.

[0075] S102: Parse the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0076] S103: Based on the display attribute information and display constraint information of the interface components corresponding to each code node, determine the motion trajectory of the interface components corresponding to each code node; the motion trajectory is used to characterize the position where the interface components can be deployed in the target interface design draft.

[0077] S104: Based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, determine the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft. The constraint detection result is used to characterize whether each display constraint information is reasonable.

[0078] The following is a detailed explanation of the steps described above.

[0079] For S101, the data format for storing the target interface code can be a node tree, which can contain multiple levels of code nodes; the interface components can be elements that make up the interface content, such as buttons and icons.

[0080] S102: Parse the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0081] Here, the displayed constraint information may include various types of constraint information, including at least one of the following constraint methods:

[0082] Constraint Method 1: The distance between the interface component corresponding to the child node and the interface component corresponding to the parent node in a specific direction is a preset value.

[0083] Here, the specific direction may include Left, Top, Right, and Bottom.

[0084] Constraint Method 2: The distance between the center point of the interface component corresponding to the child node and the center point of the interface component corresponding to the parent node is a preset value.

[0085] Constraint Method 3: The ratio of the size of the UI component corresponding to the child node to the size of the UI component corresponding to the parent node is a preset value.

[0086] In one possible implementation, when parsing the target interface code, the target node tree corresponding to the target interface code can be traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

[0087] Here, the display attribute information of the interface component may include the initial display position information of the interface component. The initial display position information may include the position information of the preset boundary point in the interface component and the size information of the interface component. Taking the shape of the interface component as a rectangle as an example, the preset boundary point may be the vertex located at the upper left, and the size information may be the length and width of the rectangle. The hierarchical relationship between each code node may be, for example, that node B is a child node of node A, and node C is a child node of node B.

[0088] S103: Based on the display attribute information and display constraint information of the interface components corresponding to each code node, determine the motion trajectory of the interface components corresponding to each code node; the motion trajectory is used to characterize the position where the interface components can be deployed in the target interface design draft.

[0089] Here, by determining the motion trajectory of the interface components corresponding to each code node, the position where each interface component in the target interface design can be deployed can be determined, and the display constraint information settings corresponding to each interface component can be judged as reasonable based on the motion trajectory.

[0090] In one possible implementation, when determining the motion trajectory of the interface component corresponding to each code node, for any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node can be determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

[0091] Specifically, the target interface design draft can be regarded as the parent node of the code node of the first layer. The display constraint information corresponding to the target interface design draft can be preset constraint information. For example, the preset constraint information can be Left & Top, which means that the distance between the interface component corresponding to the code node of the first layer and the left and top edges of the target interface design draft are both preset values.

[0092] For example, taking a target node tree containing three layers of code nodes, where the code nodes in layers 1 to 3 are A, B, C, and D (D is a child node of C), the motion trajectory of the interface component 1 corresponding to code node A is motion trajectory 1 determined based on the preset constraint information and the display attribute information of the interface component 1. Code nodes B and C are sibling nodes, and the motion trajectory 2 corresponding to the interface component 2 can be determined based on motion trajectory 1, the display constraint information corresponding to code node A, and the display attribute information of the interface component 2 corresponding to code node B. The motion trajectory 3 corresponding to the interface component 3 can be determined based on motion trajectory 1, the display constraint information corresponding to code node A, and the display attribute information of the interface component 3 corresponding to code node C. The motion trajectory 4 corresponding to the interface component 4 can be determined based on motion trajectory 3, the display constraint information corresponding to code node C, and the display attribute information of the interface component 4 corresponding to code node D.

[0093] In this way, by determining the motion trajectory of the interface components corresponding to each level of code node from high to low, the display constraint information corresponding to each ancestor node can be superimposed onto the child node in turn, thereby obtaining the motion trajectory of the interface components corresponding to each child node. In addition to being constrained by the display constraint information of the parent node, the motion trajectory of the interface components corresponding to the child node is also constrained by the display constraint information of other ancestor nodes besides the parent node.

[0094] S104: Based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, determine the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft. The constraint detection result is used to characterize whether each display constraint information is reasonable.

[0095] Here, when determining whether the display constraint information settings are reasonable, for any child node's corresponding interface component, since the interface component corresponding to the child node is theoretically contained within the interface component corresponding to the ancestor node of the child node, the reasonableness of the display constraint information cannot be judged by node pairs with parent-child relationship. Instead, the reasonableness of the display constraint information should be judged by node pairs that are sibling nodes, so as to determine whether the display constraint information settings for the parent node of the sibling node are reasonable.

[0096] In one possible implementation, the constraint detection results corresponding to the target interface design draft can be determined through the following steps A1 to A3:

[0097] A1: Based on the hierarchical relationship between each code node, determine the sibling nodes in the target interface code.

[0098] A2: Based on the display attribute information of the interface components corresponding to the sibling nodes, determine the initial overlap relationship of the interface components corresponding to the sibling nodes; and based on the motion trajectory of the interface components corresponding to the sibling nodes, determine the target overlap relationship of the interface components corresponding to the sibling nodes.

[0099] The initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the initial overlap relationship can include overlap and non-overlap; the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory, and the target overlap relationship can include overlap and non-overlap.

[0100] It should be noted that moving according to the motion trajectory can refer to changing the position information of the interface component according to the motion trajectory; or it can refer to changing the size information of the interface component according to the motion trajectory.

[0101] In one possible implementation, when determining the initial overlap relationship of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes can be determined based on the initial display position information of the interface components corresponding to the sibling nodes.

[0102] Here, the initial display position information is used to characterize the display position of the interface component when performing constraint detection; the initial overlap relationship is used to characterize whether the display positions of the interface components corresponding to the sibling nodes overlap when performing constraint detection.

[0103] In another possible implementation, the motion trajectory may include a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction. When determining the target overlap relationship of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction can be determined based on the first motion trajectory of the interface components corresponding to the sibling nodes respectively; and the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction can be determined based on the second motion trajectory of the interface components corresponding to the sibling nodes respectively.

[0104] Here, in order to simulate the real state of developers when editing interface components (they usually do not adjust the size or position of interface components in different directions at the same time in one editing operation), and also to avoid misjudging the target overlap relationship due to not distinguishing the motion trajectory components corresponding to the horizontal and vertical directions, which would lead to inaccurate constraint detection results based on the target overlap relationship.

[0105] Specifically, the first motion trajectory is the horizontal component of the motion trajectory, and the second motion trajectory is the vertical component of the motion trajectory. For the motion trajectory of the interface component corresponding to any of the sibling nodes, vector decomposition processing can be performed on the motion trajectory of the interface component corresponding to the sibling node to determine the first motion trajectory and the second motion trajectory of the interface component corresponding to the sibling node.

[0106] A3: Based on the initial overlap relationship and the target overlap relationship, determine the constraint detection result corresponding to the target interface design draft.

[0107] In one possible implementation, if the initial overlap relationship is detected to be mismatched with the target overlap relationship, the constraint detection result corresponding to the target interface design draft can be determined to be a failure; and if the initial overlap relationship is detected to be a match with the target overlap relationship, the constraint detection result corresponding to the target interface design draft can be determined to be a success.

[0108] Here, the initial overlap relationship and the target overlap relationship are matched, which can mean that both the initial overlap relationship and the target overlap relationship are overlapping or both are non-overlapping, that is, the initial overlap relationship and the target overlap relationship are the same.

[0109] In this way, by judging whether the initial overlap relationship and the target overlap relationship match, we can simulate the editing situation that may occur when editing the target interface design draft, such as whether the interface components will generate new overlaps during editing, thereby determining whether the current display constraint information settings are reasonable.

[0110] Furthermore, if the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node can be adjusted to the target constraint information. The target constraint information can be preset constraint information, such as Left & Top, which means that the distances between the interface components corresponding to each code node and the left and top edges of the interface components corresponding to the parent node are preset values.

[0111] Alternatively, the sibling nodes whose target overlap relationship does not match the initial overlap relationship can be identified as target sibling nodes, and the display constraint information of the parent node corresponding to the target sibling node can be adjusted to the target constraint information.

[0112] Alternatively, the display constraint information of the interface components corresponding to each code node can be deleted;

[0113] Alternatively, the display constraint information of the parent node corresponding to the target sibling node can be deleted.

[0114] The constraint detection method for design drafts provided in this disclosure, by parsing the display attribute information, display constraint information, and hierarchical relationship between code nodes of the target interface code corresponding to the target interface design draft, can determine the motion trajectory of the interface components corresponding to each code node. Furthermore, based on the motion trajectory, display attribute information, and hierarchical relationship of the interface components corresponding to each code node, the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft can be determined. Thus, by parsing the hierarchical relationship between code nodes and determining the deployable positions of the interface components corresponding to code nodes at the same level in the target interface design draft, it is possible to determine, layer by layer, whether the overlap relationship of the interface components corresponding to each level of code nodes will change after deployment. If the overlap relationship changes, it indicates that the display constraint information of the interface components corresponding to the code nodes is set unreasonably. This allows for the determination of the constraint detection result of the display constraint information of the interface components corresponding to each level of code nodes, helping developers automatically detect whether the current display constraint information will cause changes in the overlap relationship of the interface components. This eliminates the need for developers to repeatedly adjust the display constraint information, improving development efficiency.

[0115] Those skilled in the art will understand that, in the above-described method of the specific implementation, the order in which each step is written does not imply a strict execution order and does not constitute any limitation on the implementation process. The specific execution order of each step should be determined by its function and possible internal logic.

[0116] Based on the same inventive concept, this disclosure also provides a constraint detection device for a design draft corresponding to the constraint detection method for the design draft. Since the principle of the device in this disclosure for solving the problem is similar to the constraint detection method for the design draft described above, the implementation of the device can refer to the implementation of the method, and the repeated parts will not be described again.

[0117] Reference Figure 2 The diagram shown is an architectural schematic of a constraint detection device for a design draft provided in an embodiment of this disclosure. The device includes: an acquisition module 201, a parsing module 202, a first determination module 203, and a second determination module 204; wherein,

[0118] The acquisition module 201 is used to acquire the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components.

[0119] The parsing module 202 is used to parse the target interface code and determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0120] The first determining module 203 is used to determine the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node; the motion trajectory is used to characterize the position where the interface component can be deployed in the target interface design draft.

[0121] The second determining module 204 is used to determine the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node. The constraint detection results are used to characterize whether each display constraint information is reasonable.

[0122] In one possible implementation, the target interface code is stored in a node tree format.

[0123] The parsing module 202, when parsing the target interface code and determining the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node, is used for:

[0124] The target node tree corresponding to the target interface code is traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

[0125] In one possible implementation, the first determining module 203, when determining the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node, is used to:

[0126] For any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node is determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

[0127] In one possible implementation, the second determining module 204, when determining the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, is used to:

[0128] Based on the hierarchical relationship between each code node, the sibling nodes in the target interface code are determined;

[0129] Based on the display attribute information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined; and based on the motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes is determined; wherein, the initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory.

[0130] Based on the initial overlap relationship and the target overlap relationship, the constraint detection results corresponding to the target interface design draft are determined.

[0131] In one possible implementation, the display attribute information of the interface component includes the initial display position information of the interface component.

[0132] The second determining module 204, when determining the initial overlap relationship of the interface components corresponding to the sibling nodes based on the display attribute information of the interface components corresponding to the sibling nodes, is used to:

[0133] Based on the initial display position information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined.

[0134] In one possible implementation, the motion trajectory includes a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction;

[0135] The second determining module 204, when determining the target overlap relationship of the interface components corresponding to the sibling nodes based on the motion trajectories of the interface components corresponding to the sibling nodes, is used to:

[0136] Based on the first motion trajectories of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction is determined; and...

[0137] Based on the second motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction is determined.

[0138] In one possible implementation, the second determining module 204, when determining the constraint detection result corresponding to the target interface design draft based on the initial overlap relationship and the target overlap relationship, is used to:

[0139] If a mismatch is detected between the initial overlap relationship and the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a failure; and,

[0140] If the initial overlap relationship is detected to match the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a pass.

[0141] In one possible implementation, the second determining module 204 is further configured to:

[0142] If the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node is adjusted to the target constraint information; or, the display constraint information of the interface components corresponding to each code node is deleted.

[0143] The constraint detection device for design drafts provided in this disclosure, by parsing the display attribute information, display constraint information, and hierarchical relationship between code nodes of the target interface code corresponding to the target interface design draft, can determine the motion trajectory of the interface components corresponding to each code node. Furthermore, based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between code nodes, the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft can be determined. Thus, by parsing the hierarchical relationship between code nodes and determining the deployable positions of the interface components corresponding to code nodes at the same level in the target interface design draft, it is possible to determine, layer by layer, whether the overlap relationship of the interface components corresponding to each level of code nodes will change after deployment. If the overlap relationship changes, it indicates that the display constraint information of the interface components corresponding to the code nodes is set unreasonably. Therefore, the constraint detection result of the display constraint information of the interface components corresponding to each level of code nodes can be determined layer by layer, helping developers automatically detect whether the current display constraint information will cause changes in the overlap relationship of the interface components. This eliminates the need for developers to repeatedly adjust the display constraint information, improving development efficiency.

[0144] The processing flow of each module in the device and the interaction flow between each module can be referred to the relevant descriptions in the above method embodiments, and will not be detailed here.

[0145] Based on the same technical concept, this disclosure also provides a computer device. (See also...) Figure 3 The diagram shows the structure of a computer device 300 provided in this embodiment, including a processor 301, a memory 302, and a bus 303. The memory 302 stores execution instructions and includes a main memory 3021 and an external memory 3022. The main memory 3021, also called internal memory, is used to temporarily store computational data in the processor 301 and data exchanged with external memory such as a hard disk. The processor 301 exchanges data with the external memory 3022 through the main memory 3021. When the computer device 300 is running, the processor 301 and the memory 302 communicate through the bus 303, causing the processor 301 to execute the following instructions:

[0146] Obtain the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components;

[0147] The target interface code is parsed to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node.

[0148] Based on the display attribute information and display constraint information of the interface components corresponding to each code node, the motion trajectory of the interface components corresponding to each code node is determined; the motion trajectory is used to characterize the position where the interface components can be deployed in the target interface design draft.

[0149] Based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between each code node, the constraint detection results corresponding to the display constraint information of each interface component in the target interface design are determined. The constraint detection results are used to characterize whether each display constraint information is reasonable.

[0150] In one possible implementation, the data format for storing the target interface code in the instructions of the processor 301 is a node tree;

[0151] The process of parsing the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node includes:

[0152] The target node tree corresponding to the target interface code is traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

[0153] In one possible implementation, the instruction of the processor 301, which determines the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node, includes:

[0154] For any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node is determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

[0155] In one possible implementation, the instruction of the processor 301, which determines the constraint detection result corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node, includes:

[0156] Based on the hierarchical relationship between each code node, the sibling nodes in the target interface code are determined;

[0157] Based on the display attribute information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined; and based on the motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes is determined; wherein, the initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory.

[0158] Based on the initial overlap relationship and the target overlap relationship, the constraint detection results corresponding to the target interface design draft are determined.

[0159] In one possible implementation, the display attribute information of the interface component in the instructions of the processor 301 includes the initial display position information of the interface component.

[0160] The step of determining the initial overlap relationship of the interface components corresponding to the sibling nodes based on the display attribute information of the interface components corresponding to the sibling nodes includes:

[0161] Based on the initial display position information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined.

[0162] In one possible implementation, the instructions of the processor 301 include a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction.

[0163] Determining the target overlap relationship of the interface components corresponding to the sibling nodes based on their respective motion trajectories includes:

[0164] Based on the first motion trajectories of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction is determined; and...

[0165] Based on the second motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction is determined.

[0166] In one possible implementation, the instruction of the processor 301, which determines the constraint detection result corresponding to the target interface design draft based on the initial overlap relationship and the target overlap relationship, includes:

[0167] If a mismatch is detected between the initial overlap relationship and the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a failure; and,

[0168] If the initial overlap relationship is detected to match the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a pass.

[0169] In one possible implementation, the instructions of the processor 301 further include:

[0170] If the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node is adjusted to the target constraint information; or, the display constraint information of the interface components corresponding to each code node is deleted.

[0171] This disclosure also provides a computer-readable storage medium storing a computer program, which, when executed by a processor, performs the steps of the constraint detection method for the design draft described in the above method embodiments. The storage medium can be a volatile or non-volatile computer-readable storage medium.

[0172] This disclosure also provides a computer program product carrying program code. The program code includes instructions that can be used to execute the steps of the constraint detection method for the design draft described in the above method embodiments. For details, please refer to the above method embodiments, which will not be repeated here.

[0173] The aforementioned computer program product can be implemented through hardware, software, or a combination thereof. In one optional embodiment, the computer program product is specifically embodied in a computer storage medium; in another optional embodiment, the computer program product is specifically embodied in a software product, such as a software development kit (SDK), etc.

[0174] Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the specific working processes of the systems and devices described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here. In the several embodiments provided in this disclosure, it should be understood that the disclosed systems, devices, and methods can be implemented in other ways. The device embodiments described above are merely illustrative. For example, the division of units is only a logical functional division; in actual implementation, there may be other division methods. Furthermore, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Another point is that the displayed or discussed mutual coupling or direct coupling or communication connection may be through some communication interfaces; the indirect coupling or communication connection of devices or units may be electrical, mechanical, or other forms.

[0175] The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.

[0176] In addition, the functional units in the various embodiments of this disclosure can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit.

[0177] If the aforementioned functions are implemented as software functional units and sold or used as independent products, they can be stored in a processor-executable, non-volatile, computer-readable storage medium. Based on this understanding, the technical solution of this disclosure, in essence, or the part that contributes to the prior art, or a portion of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of this disclosure. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0178] Finally, it should be noted that the above-described embodiments are merely specific implementations of this disclosure, used to illustrate the technical solutions of this disclosure, and not to limit it. The protection scope of this disclosure is not limited thereto. Although this disclosure has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that any person skilled in the art can still modify or easily conceive of changes to the technical solutions described in the foregoing embodiments, or make equivalent substitutions for some of the technical features, within the scope of the technology disclosed in this disclosure. Such modifications, changes, or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of this disclosure, and should all be covered within the protection scope of this disclosure. Therefore, the protection scope of this disclosure should be determined by the protection scope of the claims.

Claims

1. A constraint detection method for a design draft, characterized in that, include: Obtain the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components; The target interface code is parsed to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node. Based on the display attribute information and display constraint information of the interface components corresponding to each code node, the motion trajectory of the interface components corresponding to each code node is determined; the motion trajectory is used to characterize the position where the interface components can be deployed in the target interface design draft. Based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between each code node, the constraint detection results corresponding to the display constraint information of each interface component in the target interface design are determined. The constraint detection results are used to characterize whether each display constraint information is reasonable. If the display constraint information is unreasonable, it is manifested as the overlap relationship of the interface components changes after deployment.

2. The method according to claim 1, characterized in that, The target interface code is stored in a node tree format. The process of parsing the target interface code to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node includes: The target node tree corresponding to the target interface code is traversed layer by layer to determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node.

3. The method according to claim 2, characterized in that, The process of determining the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node includes: For any code node at the Nth level in the target node tree, the motion trajectory of the interface component corresponding to the code node is determined based on the motion trajectory of the interface component corresponding to the parent node of the code node, the display constraint information corresponding to the parent node of the code node, and the display attribute information of the interface component corresponding to the code node; wherein, N is a positive integer greater than 1, and the motion trajectory of the interface component corresponding to the code node at the first level in the target node tree is determined based on the preset display constraint information and the display attribute information of the interface component corresponding to the code node at the first level.

4. The method according to claim 1, characterized in that, The constraint detection results, based on the motion trajectory of the interface components corresponding to each code node, the display attribute information of the interface components corresponding to each code node, and the hierarchical relationship between each code node, are determined according to the display constraint information of each interface component in the target interface design draft. These results include: Based on the hierarchical relationship between each code node, the sibling nodes in the target interface code are determined; Based on the display attribute information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined; and based on the motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes is determined; wherein, the initial overlap relationship is used to characterize whether the initial display positions of the interface components corresponding to the sibling nodes overlap, and the target overlap relationship is used to characterize whether the interface components corresponding to the sibling nodes overlap when moving according to the motion trajectory. Based on the initial overlap relationship and the target overlap relationship, the constraint detection results corresponding to the target interface design draft are determined.

5. The method according to claim 4, characterized in that, The display attribute information of the interface components includes the initial display position information of the interface components; The step of determining the initial overlap relationship of the interface components corresponding to the sibling nodes based on the display attribute information of the interface components corresponding to the sibling nodes includes: Based on the initial display position information of the interface components corresponding to the sibling nodes, the initial overlap relationship of the interface components corresponding to the sibling nodes is determined.

6. The method according to claim 4, characterized in that, The motion trajectory includes a first motion trajectory in the horizontal direction and a second motion trajectory in the vertical direction; Determining the target overlap relationship of the interface components corresponding to the sibling nodes based on their respective motion trajectories includes: Based on the first motion trajectories of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the horizontal direction is determined; and... Based on the second motion trajectory of the interface components corresponding to the sibling nodes, the target overlap relationship of the interface components corresponding to the sibling nodes in the vertical direction is determined.

7. The method according to claim 4, characterized in that, The step of determining the constraint detection result corresponding to the target interface design draft based on the initial overlap relationship and the target overlap relationship includes: If a mismatch is detected between the initial overlap relationship and the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a failure; and, If the initial overlap relationship is detected to match the target overlap relationship, the constraint detection result corresponding to the target interface design draft is determined to be a pass.

8. The method according to claim 7, characterized in that, The method further includes: If the constraint detection result corresponding to the target interface design draft is detected as failing, the display constraint information of the interface components corresponding to each code node is adjusted to the target constraint information; or, the display constraint information of the interface components corresponding to each code node is deleted.

9. A constraint detection device for a design draft, characterized in that, include: The acquisition module is used to acquire the target interface code corresponding to the target interface design draft; wherein, the target interface code contains multi-level code nodes, and different code nodes correspond to different interface components; The parsing module is used to parse the target interface code, determine the display attribute information, display constraint information, and hierarchical relationship between the interface components corresponding to each code node; wherein, the display constraint information is used to restrict the display position of the interface components corresponding to the child nodes of the code node. The first determining module is used to determine the motion trajectory of the interface component corresponding to each code node based on the display attribute information and display constraint information of the interface component corresponding to each code node; the motion trajectory is used to characterize the position where the interface component can be deployed in the target interface design draft; The second determining module is used to determine the constraint detection results corresponding to the display constraint information of each interface component in the target interface design draft based on the motion trajectory of the interface component corresponding to each code node, the display attribute information of the interface component corresponding to each code node, and the hierarchical relationship between each code node. The constraint detection results are used to characterize whether each display constraint information is reasonable. The unreasonable display constraint information is manifested as the overlap relationship of the interface components changes after deployment.

10. A computer device, characterized in that, include: The computer device includes a processor, a memory, and a bus. The memory stores machine-readable instructions executable by the processor. When the computer device is running, the processor communicates with the memory via the bus. When the machine-readable instructions are executed by the processor, they perform the steps of the constraint detection method for the design draft as described in any one of claims 1 to 8.

11. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program that, when executed by a processor, performs the steps of the constraint detection method for the design draft as described in any one of claims 1 to 8.

Citation Information

Patent Citations

  • Recombination method and device for component elements in interface and computer equipment

    CN114860234A