Page processing method and device, equipment and medium

Abstract

The invention relates to a page processing method and device, equipment and a medium, and the method comprises the steps: obtaining a hierarchical relationship between controls in a generated target page in response to a generation operation on the target page in a page development platform, obtaining attribute information of the controls based on the hierarchical relationship between the controls in the target page, and displaying the attribute information of the controls in the page development platform. The attribute information at least comprises absolute position information of at least one first control serving as a bottom-layer control and relative position information of at least one second control serving as an upper-layer control, and therefore a descriptive language file corresponding to the target page is generated based on the attribute information of the multiple controls. Through the scheme provided by the invention, the absolute position information used when the descriptive language file is generated can be converted into the relative position information, so that the readability of the generated descriptive language file is improved, and convenience is provided for a subsequent page development process.

Description

Page processing method, device, equipment and medium Technical Field

[0001] The present application relates to the field of software development technology, and in particular to a page processing method, apparatus, device, and medium. Background Art

[0002] As a commonly used development and operations tool in the software development field, page visual configuration tools can help technicians quickly generate and publish pages. However, the visual configuration pages generated by page visual configuration tools are primarily for technicians to view, so that technicians can develop pages based on the visual configuration pages.

[0003] When developing a page based on a visual configuration page, a technician is required to develop a code based on the visual configuration page so that the page can be displayed based on the developed code to achieve page development.

[0004] However, during the page development process, it may be necessary to modify the configured page. In this case, the developed code needs to be modified at the source code level. In other words, during the page development process, it may be necessary to perform secondary development of the configured page at the source code level. Therefore, a page processing method is urgently needed to obtain a more readable source code file based on the configured page, facilitate modification of the configured page at the source code level, and realize secondary development of the page.

[0005] Summary of the Invention

[0006] The present application provides a page processing method, apparatus, device and medium to address the deficiencies in the related art.

[0007] According to a first aspect of an embodiment of the present application, a page processing method is provided, the method comprising:

[0008] In response to a target page generation operation in a page development platform, obtaining a hierarchical relationship between various controls in the generated target page;

[0009] Based on the hierarchical relationship between the multiple controls in the target page, acquiring attribute information of the multiple controls, the attribute information including at least absolute position information of at least one first control as a bottom-layer control and relative position information of at least one second control as an upper-layer control;

[0010] Based on the attribute information of multiple controls, a descriptive language file corresponding to the target page is generated.

[0011] According to a second aspect of an embodiment of the present application, a page processing device is provided, the device comprising:

[0012] A first acquisition module is configured to, in response to a generation operation of a target page in a page development platform, acquire a hierarchical relationship between various controls in the generated target page;

[0013] A second acquisition module is configured to acquire attribute information of the multiple controls based on a hierarchical relationship between the multiple controls in the target page, where the attribute information includes at least absolute position information of at least one first control as a bottom-layer control and relative position information of at least one second control as an upper-layer control;

[0014] The generation module is used to generate a descriptive language file corresponding to the target page based on the attribute information of multiple controls.

[0015] According to a third aspect of an embodiment of the present application, a computing device is provided, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the computer program, the operations performed by the page processing method provided in the first aspect and any embodiment of the first aspect are implemented.

[0016] According to a fourth aspect of the embodiments of the present application, a computer-readable storage medium is provided, on which a program is stored. When the program is executed by a processor, the operations performed by the page processing method provided in the first aspect and any embodiment of the first aspect are implemented.

[0017] According to the above embodiment, by responding to the generation operation of the target page in the page development platform, the hierarchical relationship between the various controls in the generated target page is obtained, and based on the hierarchical relationship between the multiple controls in the target page, the attribute information of the multiple controls is obtained, and the attribute information at least includes the absolute position information of at least one first control as the bottom control and the relative position information of at least one second control as the upper control, so as to generate the descriptive language file corresponding to the target page based on the attribute information of the multiple controls. Through the solution provided by the present application, the descriptive language file corresponding to the target page can be automatically generated, and the descriptive language file can be directly viewed and modified through the browser, which is convenient for the secondary development of the page; moreover, the present invention can convert the absolute position information used when generating the descriptive language file into relative position information to improve the readability of the generated descriptive language file, thereby ensuring the readability of the source code subsequently generated based on the descriptive language file.

[0018] It should be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the present application. BRIEF DESCRIPTION OF THE DRAWINGS

[0019] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.

[0020] FIG1 is an exemplary schematic diagram showing a target page according to an embodiment of the present application.

[0021] FIG2 is a flowchart illustrating a page processing method according to an embodiment of the present application.

[0022] FIG3 is a schematic diagram showing a hierarchical relationship of controls according to an embodiment of the present application.

[0023] FIG4 is a schematic diagram showing another control hierarchical relationship according to an embodiment of the present application.

[0024] FIG5 is a schematic diagram showing another control hierarchical relationship according to an embodiment of the present application.

[0025] FIG6 is a schematic diagram of a target page according to an embodiment of the present application.

[0026] FIG7 is a flowchart illustrating a page processing method according to an embodiment of the present application.

[0027] FIG8 is a flowchart illustrating a process of obtaining a source code file according to an embodiment of the present application.

[0028] FIG9 is a block diagram of a page processing device according to an embodiment of the present application.

[0029] FIG10 is a schematic structural diagram of a computing device according to an embodiment of the present application. DETAILED DESCRIPTION

[0030] Exemplary embodiments will be described in detail herein, with examples illustrated in the accompanying drawings. In the following description, when referring to the drawings, identical numerals in different figures represent identical or similar elements, unless otherwise indicated. The embodiments described in the following exemplary embodiments are not intended to represent all embodiments consistent with the present application. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present application, as detailed in the appended claims.

[0031] The present application provides a page processing method for converting a target page generated by a page development platform using an absolute layout into a form using a relative layout, thereby generating a descriptive language file corresponding to the target page based on the page using the relative layout, so as to convert the absolute position information used when generating the descriptive language file into relative position information, so that the visual configuration of the page can be realized based on the descriptive language file using the relative position information, so that the result obtained by the page visual configuration process describes the relative layout of the page. When developing code based on the visual configuration page, it is also necessary to use a relative layout, so that the page visual configuration result can be unified with the layout method used in the code development process, so as to improve the readability of the generated descriptive language file.

[0032] Furthermore, secondary development of the target page at the source code level is achieved based on the generated descriptive language file, which improves the readability of the source code file generated based on the descriptive language file, thereby ensuring the smooth progress of the secondary development process and improving page development efficiency.

[0033] Descriptive language is a way to create a rule language, which is used to build code in a way that is closer to the business field and in a natural language-like manner, so that developers can understand the business meaning of the code without spending too much effort. A descriptive language file is a file composed of code built based on a descriptive language. A descriptive language file can be as simple as a configuration file. Compared with ordinary configuration files, the code of a descriptive language file is easier to understand. Generally, a descriptive language file needs to be parsed with the help of a specific parsing framework. The parsed descriptive language file can be viewed directly through a browser.

[0034] It should be noted that the page development platform can provide developers with page development functions. For example, the page development platform can provide developers with a development interface, and provide a canvas area and a variety of optional elements in the development interface. Developers can select from the various elements provided by the page development platform and add the selected elements to the canvas area to display the page to be generated in the canvas area. The developer can then generate a target page based on the page style of the page to be generated displayed in the canvas area.

[0035] In addition, it should be noted that the types of elements provided by the page development platform are pre-set. Developers can determine the types of elements that need to be added based on actual technical requirements, so that they can select elements of corresponding types from the elements provided by the page development platform and add elements of corresponding types to the canvas area.

[0036] Optionally, when developing a page, the developer can create a project in a page development platform and develop the page under the project. The page development platform can be a World Wide Web (WEB) platform, or a Windows development platform, etc. The present application does not limit the specific type of the page development platform.

[0037] The above-mentioned page processing method can be used to process various types of pages, that is, the above-mentioned page processing method can be used to process any page in any application software. For example, the above-mentioned page processing method can be used to process a page displaying a three-dimensional map. Referring to FIG1 , FIG1 is an exemplary schematic diagram of a target page according to an embodiment of the present application. The target page shown in FIG1 displays a three-dimensional map. Through the page processing method provided by the present application, a descriptive language file of the target page displaying a three-dimensional map as shown in FIG1 can be obtained.

[0038] The above is only an exemplary description of the application scenario of the present application and does not constitute a limitation on the application scenario of the present application. In more possible implementation methods, the page processing method provided by the present application can also be applied to other scenarios involving the page development process. The present application does not limit the specific application scenario of the page processing method.

[0039] The above page processing method can be executed by a computing device, which can be a terminal device, such as a desktop computer, portable computer, laptop computer, smart phone, tablet computer, smart watch, etc. This application does not limit the device type of the terminal device.

[0040] After introducing the application scenario and implementation environment of this application, the page processing method provided by this application is introduced in detail below.

[0041] Referring to FIG. 2 , FIG. 2 is a flow chart of a page processing method according to an embodiment of the present application. As shown in FIG. 2 , the method includes:

[0042] Step 201: In response to a target page generation operation in a page development platform, a hierarchical relationship between various controls in the generated target page is obtained.

[0043] Among them, the hierarchical relationship can be used to indicate the display hierarchical relationship between controls. For example, referring to Figure 3, Figure 3 is a schematic diagram of a control hierarchical relationship according to an embodiment of the present application. As shown in Figure 3, control B is included in control A. The hierarchical relationship between controls is described as control A being the bottom control of control B, and control B being the top control of control A.

[0044] For another example, refer to Figure 4, which is a schematic diagram of another control hierarchical relationship according to an embodiment of the present application. As shown in Figure 4, control B and control C are both included in control A, and there is no overlapping part between control B and control C. The hierarchical relationship between controls is described as control A being the bottom control of control B and control C, control B and control C being the upper-level controls of control A, and control B and control C being controls of the same level.

[0045] For another example, refer to Figure 5, which is a schematic diagram of another control hierarchical relationship according to an embodiment of the present application. As shown in Figure 5, control B and control C are both included in control A, and there is an overlapping part between control B and control C, which is described as a hierarchical relationship between controls, that is, control A is the bottom control of control B and control C, control B and control C are both upper-level controls of control A, and control B and control C are controls of the same level.

[0046] Step 202: Based on the hierarchical relationship between multiple controls in the target page, obtain attribute information of multiple controls, where the attribute information includes at least absolute position information of at least one first control as a bottom-level control and relative position information of at least one second control as an upper-level control.

[0047] Among them, whether it is absolute position information or relative position information, it describes the position information of the control. For a control, the attribute information may include not only its position information, but also the control identifier and style information of the control, etc. Among them, the control identifier can be used to uniquely identify a control, and the style information may include the control type, control size, control shape, control fill color, etc. This application does not limit the specific content included in the attribute information.

[0048] Step 203: Generate a descriptive language file corresponding to the target page based on the attribute information of the multiple controls.

[0049] The descriptive language file may be a Domain Specific Language Tools (DSL) file. Optionally, the descriptive language file may also be other types of files, which is not limited in this application.

[0050] DSL, or Domain Specific Language, is a programming language designed for a specific domain and primarily expressive. When processing tasks in certain specialized domains, the code may not require many language features. To effectively handle such tasks, DSLs have emerged. As a language tool for solving specific tasks, DSLs can be embodied in different types for tasks corresponding to different business domains. For example, for document writing tasks, lightweight markup language (Markdown) can be used as a DSL; for string matching tasks, regular expressions (RegExp) can be used as a DSL; for process control tasks, dependency checker (Make) or automated build tool (Gradle) can be used as a DSL; for data search tasks, structured query language (SQL) can be used as a DSL; for web page style coding tasks, cascading style sheets (CSS) can be used as a DSL, and so on. The code file generated by DSL writing is also a DSL file. Accordingly, the specific formats of DSL files corresponding to different DSL languages ​​will also vary. This application does not limit the specific programming language used for DSL files or the format of DSL files.

[0051] In short, the essence of DSL language is actually the same as the solution to many software engineering problems, that is, by limiting the boundaries of the problem domain, thereby locking in complexity and improving programming efficiency.

[0052] Through the solution provided in this application, the absolute position information used when generating a descriptive language file can be converted into relative position information to improve the readability of the generated descriptive language file, thereby ensuring the readability of the source code subsequently generated based on the descriptive language file.

[0053] After introducing the basic implementation process of the page processing method provided by the present application, various optional embodiments of the present application are introduced below.

[0054] In some embodiments, in step 201, in response to a target page generation operation in a page development platform, obtaining the hierarchical relationship between controls in the generated target page may include the following steps:

[0055] Step 2011: In response to a control adding operation in the page development platform, a target page is displayed based on a plurality of controls added in the page development platform.

[0056] Optionally, the developer can select from a variety of elements provided by the page development platform, and then drag the selected elements to the canvas area to add controls so that the style of the page to be generated (that is, the target page) can be displayed in real time in the canvas area.

[0057] Step 2012: In response to the target page generation operation, the hierarchical relationship between the various controls in the target page is obtained.

[0058] Optionally, a save control may be provided in the page development platform to trigger a generation operation of the target page through the save control.

[0059] It should be noted that when the developer confirms that the page displayed in the canvas area meets the style of the target page to be generated, the save control in the page development platform can be triggered, and the computing device can generate the target page based on the controls currently included in the canvas area of ​​the page development platform and the style of the controls in response to the triggering operation of the save control.

[0060] When the save control is triggered, it is equivalent to triggering the generation operation of the target page. At this time, the computing device can obtain the hierarchical relationship between the various controls in the generated target page.

[0061] Optionally, in response to the operation of generating the target page, the computing device may determine the hierarchical relationship between the controls in the target page based on the control type and position information of the controls in the target page.

[0062] In one possible implementation, the various controls included in the target page can be traversed. Each time a control is traversed, the hierarchical relationship between the target control and other controls is determined based on the control type of the currently traversed control (recorded as the target control) and the positional relationship between the target control and other controls in the target page.

[0063] It should be noted that the computing device can maintain a control information list for storing the attribute information of each control included in the target page. Optionally, each time the developer adds an element to the canvas area, the computing device can store the attribute information of the corresponding control in the control information list to achieve the creation of the control information list. For example, when the canvas area is empty, the computing device can create an empty list as the control information list. If the developer adds the first element in the canvas area, the computing device can store the attribute information of the control corresponding to the element added by the developer in the created control information list. Each time the developer adds a new element in the canvas area, the attribute information of the control corresponding to the added element will be added to the control information list, and so on, to achieve the creation of the control information list. It should be noted that the order of controls in the control information list can be determined based on the order in which the developer adds the controls.

[0064] After the developer triggers the generation operation of the target page, the computing device can determine that the control information list corresponding to the target page is created.

[0065] The attribute information includes the control type and position information. Based on the above control information list, in one possible implementation method, when obtaining the hierarchical relationship between each control in the generated target page, the control information list can be traversed. Based on the control type and position information stored in the control information list, the position relationship of each control can be compared in turn to obtain the hierarchical relationship between each control in the generated target page.

[0066] It should be noted that control types can be divided into stackable controls and non-stackable controls. For stackable controls, overlap is allowed between two stackable controls, but non-stackable controls are not allowed to overlap with other controls. Therefore, when comparing the positional relationship of each control based on control type and position information, the control type of the two controls being compared can be determined first, and then the hierarchical relationship can be determined based on the positional relationship of the two controls based on the determined control type.

[0067] Taking the stack container as an example, for two Stack containers, if there is overlap between the two Stack containers and one Stack container (represented as Stack container 1) is completely contained in the other Stack container (represented as Stack container 2), it can be determined that Stack container 2 is the bottom-level control of Stack container 1, and Stack container 1 is the top-level control of Stack container 2. If there is overlap between the two Stack containers but there is no complete containment relationship, it can be determined that the two Stack containers are controls of the same level and correspond to the same bottom-level control. For two Stack containers that do not overlap, there is no need to determine the hierarchical relationship between them.

[0068] For non-stackable controls, the process of determining the hierarchical relationship of non-stackable controls is explained by taking non-stackable controls as ordinary containers (Container), row containers (Row), and column containers as examples.

[0069] A normal container contains only one control, and the control type of the control is also a normal container. For two normal containers, if one (denoted as normal container 1) is completely contained in the other (denoted as normal container 2), then normal container 2 can be determined to be the bottom-level control of normal container 1, and normal container 1 is the top-level control of normal container 2. For two normal containers that do not have a containment relationship, there is no need to determine the hierarchical relationship between them.

[0070] For a Row container, a Row container can include multiple controls arranged horizontally. For two Row containers, if one Row container (denoted as Row container 1) is completely contained in the other Row container (denoted as Row container 2), it can be determined that Row container 2 is the bottom-level control of Row container 1, and Row container 1 is the top-level control of Row container 2. If there is no containment relationship between the two Row containers but they are both contained in the same Row container, it can be determined that the two Row containers are controls of the same level and correspond to the same bottom-level control. For two Row containers that are not contained in the same Row container, there is no need to determine the hierarchical relationship between them.

[0071] For a Column container, it can contain multiple controls arranged vertically. The process of determining the hierarchical relationship between two Column containers can be found in the introduction to the Row container above and will not be repeated here.

[0072] For ease of understanding, the process of determining the hierarchical relationship between controls is described below using a specific example. Referring to FIG6 , FIG6 is a schematic diagram of a target page according to an embodiment of the present application. When determining the hierarchical relationship between controls in the target page shown in FIG6 , each control can be traversed. When traversing to control 610 as a common container, by comparing the positional relationship between control 610 and other controls, it can be determined that control 611 as a common container is completely contained in control 610, thereby determining that control 610 is the bottom control of control 611, and control 611 is the upper control of control 610; when traversing to control 620 as a row container, by comparing the positional relationship between control 620 and other controls, it can be determined that control 621 and control 622 as row containers are both completely contained in control 620, and there is no containment relationship between control 621 and control 622, thereby determining that control 620 is the bottom control of control 621 and control 622, control 621 and control 622 are both upper controls of control 620, and control 621 and control 622 are in a peer relationship; when traversing to control 630 as a column container, by comparing the positional relationship between control 630 and other controls By comparing the positional relationship between control 640 and other controls, it can be determined that control 631 and control 632 as column containers are both completely contained in control 630, and there is no containment relationship between control 631 and control 632, thereby determining that control 630 is the bottom control of control 631 and control 632, control 631 and control 632 are both upper controls of control 630, and control 631 and control 632 are in a peer relationship; when traversing to control 640 as a stacking container, by comparing the positional relationship between control 640 and other controls, it can be determined that control 641 and control 642 as stacking containers are both completely contained in control 640, and there is an overlapping but non-containment relationship between control 641 and control 642, thereby determining that control 640 is the bottom control of control 641 and control 642, control 641 and control 642 are both upper controls of control 640, and control 641 and control 642 are in a peer relationship.

[0073] It should be noted that the position information of a control can be represented using the parameters of a Rectangular (Rect) object. For example, a control can be represented by a rectangular frame. By recording the positions of the leftmost, topmost, rightmost, and bottommost points of the rectangular frame, the control position can be recorded. Furthermore, the control size can be determined from the control position represented by the parameters of the Rect object, allowing comparison of the positional relationships between controls based on the control position and size.

[0074] Optionally, when traversing the control information list, the first element in the control information list can be used as the root element and recorded as curWidget. The template function is then called to convert the view (i.e., the attribute information corresponding to curWidget) of curWidget into JavaScript Object Notation (JSON) characters, and the type of curWidget in the JSON code is set according to the type of the control corresponding to the curWidget element.

[0075] It should be noted that the type of curWidget can be divided into single-Child type and multi-Child type. If curWidget is of single-Child type, it indicates that the control corresponding to the curWidget element is a bottom-level control that includes only one upper-level control (such as a common container). If curWidget is of multi-Child type, it indicates that the control corresponding to the curWidget element is a bottom-level control that includes multiple upper-level controls (such as a Row container, Column container, Stack container, etc.). In other words, when the control corresponding to curWidget is a bottom-level control such as a common container that includes only one upper-level control, curWidget can be set to a single-Child type; when the control corresponding to curWidget is a bottom-level control such as a Row container, Column container, Stack container that includes multiple upper-level controls, curWidget can be set to a multi-Child type.

[0076] Optionally, when curWidget is a single Child type, the JSON string used to define the curWidget type can be set to child:@child; when curWidget is a multi-Child type, the JSON string used to define the curWidget type can be set to child:[@child], and the set JSON string can also be recorded as parentString.

[0077] After the hierarchical relationship between the controls is obtained in step 201 , the attribute information of the multiple controls can be obtained based on the hierarchical relationship between the multiple controls in the target page in step 202 .

[0078] In some embodiments, when acquiring attribute information of multiple controls based on the hierarchical relationship between the multiple controls in the target page, the following steps may be included:

[0079] Step 2021: Based on the hierarchical relationship between multiple controls, generate at least one control set, where the control set uses the control identifier of the first control as the bottom control as a keyword, and the control set is used to store the control identifier of the second control as the upper control of the corresponding bottom control.

[0080] It should be noted that when generating a target page based on the elements added by the developer in the canvas area, each element added in the canvas area will be generated as a control in the target page. When generating the controls in the target page, the computing device can generate a control identifier for each control so that each control can be uniquely identified by the generated control identifier. Optionally, the generated control identifier can be a control number determined according to the order in which the elements are added, or the generated control identifier can be a randomly generated string. It is only necessary to ensure that the control identifiers of each control are different. This application does not limit the specific type of control identifier.

[0081] In one possible implementation, for an underlying control that has an upper-level control, a mapping set can be generated using the control identifier of the underlying control as a keyword. The mapping set is also a control set, and the value stored in the control set is the control identifier of the upper-level control corresponding to the underlying control.

[0082] It should be noted that there may be a bottom-level control on the page, and other controls are added to this bottom-level control as upper-level controls. In this case, a control collection is obtained. However, there may also be multiple bottom-level controls on the page, each corresponding to its own upper-level control. In this case, multiple control collections are obtained, and different control collections correspond to different bottom-level controls.

[0083] Still taking the target page shown in FIG6 as an example, in the target page shown in FIG6 , there are four bottom-level controls of the same level, namely control 610, control 620, control 630 and control 640. Therefore, based on the target page shown in FIG6 , four control sets can be obtained, and these four control sets correspond to different bottom-level controls. For the sake of convenience, the labels of the controls in FIG6 are directly used as the control identifiers of the controls. Then, control set 1 can be the control set corresponding to the bottom-level control 610, and the keyword of control set 1 is 610. Control set 1 includes the control identifier of control 611 (that is, 611); control set 2 can be the control set corresponding to the bottom-level control 620, and the keyword of control set 2 is 620. Control set 2 includes the control identifier of control 621 (that is, 621) and the control identifier of control 622 (that is, 622). That is, 622); control set 3 can be the control set corresponding to the underlying control 630, the keyword of control set 3 is 630, and control set 3 includes the control identifier of control 631 (that is, 631) and the control identifier of control 632 (that is, 632); control set 4 can be the control set corresponding to the underlying control 640, the keyword of control set 4 is 640, and control set 4 includes the control identifier of control 641 (that is, 641) and the control identifier of control 642 (that is, 642).

[0084] Step 2022: For any control set, obtain the property information of the first control corresponding to the control set and the property information of the second control in the control set.

[0085] Optionally, you can obtain the control identifier of the underlying control corresponding to curWidget as the root element, and based on the obtained control identifier, take out the corresponding value from the corresponding control set (that is, the upper-level control identifier included in the control set), record it as the childList list, and then you can obtain the property information of the corresponding control based on the value recorded in the childList list (that is, the control identifier).

[0086] Furthermore, a variable of a variable type of StringBuffer may be created, and the variable name of the created variable may be recorded as jsonBuffer, so that the childList list may be encapsulated through the created variable jsonBuffer.

[0087] It should be noted that, since the JSON string representing the curWidget type has been recorded as parentString, the created variable jsonBuffer and the childList list it encapsulates will be recorded under the code declaring parentString to indicate the control type corresponding to the created variable jsonBuffer and the childList list it encapsulates.

[0088] Wherein, the attribute information includes at least position information. In the case where the attribute information is position information, for any control set, when obtaining the attribute information of the first control corresponding to the control set and the attribute information of the second control in the control set, it can be achieved by the following steps:

[0089] Step 2022-1: For any control set, obtain the absolute position information of the first control corresponding to the control set.

[0090] Step 2022-2: When the control set is not empty, obtain relative position information of at least one second control based on the control type of the first control and the absolute position information of at least one second control in the control set.

[0091] It should be noted that the relative position information of the upper-level control corresponding to different types of underlying controls (i.e., the first control) is obtained in different ways. Therefore, when the childList list is not empty, the type of parentString corresponding to the childList list can be determined (single Child type or multi-Child type), and then the absolute position information of the second control as the upper-level control is converted according to the determined type of parentString corresponding to the childList list, so as to obtain the relative position information of the upper-level control corresponding to different types of underlying controls.

[0092] The following describes how to obtain the relative position information of upper-level controls corresponding to different types of underlying controls:

[0093] In one possible implementation, when the first control is an ordinary container that includes only one second control, based on the absolute position information of the first control and the absolute position information of the second control, the position difference information of the second control relative to the first control is determined as the relative position information of the second control.

[0094] When controls are represented by rectangular boxes, if the first control is a common container that includes only one upper-level control, the difference between the leftmost point (i.e., left) and the topmost point (i.e., top) of the rectangular box of the upper-level control and the left and top points of the rectangular box of the underlying control are directly compared to obtain the margin spacing of the upper-level control relative to the underlying control as the relative position information of the upper-level control.

[0095] In another possible implementation, when the first control is a row container including multiple second controls, the multiple second controls are sorted based on the horizontal coordinate information of the multiple second controls, and the relative position information of the multiple second controls is determined based on the sorting of the multiple second controls, the absolute position information of the multiple second controls and the absolute position information of the first control.

[0096] It should be noted that if the first control is a row container, the row container may have multiple child elements, so that the first control may include multiple upper-level controls.

[0097] Optionally, when describing the relative position information of each upper-level control in a row container, the margin spacing of the first upper-level control relative to the bottom-level control can be used as the relative position information of the first upper-level control, and for the second to last upper-level controls, their margin spacing relative to the previous (adjacent to the left) upper-level control of the same level can be used as their relative position information.

[0098] Therefore, when the first control is a row container, the multiple second controls corresponding to the first control can be sorted in ascending order of horizontal coordinates, so as to obtain the relative position information of each second control based on the sorting result. The horizontal coordinate can be the coordinate of the leftmost point of each second control.

[0099] It should be noted that, for the second control ranked 1, the position difference information of the second control ranked 1 relative to the first control can be determined as the relative position information of the second control ranked 1; and for the second control ranked N, the position difference information of the second control ranked N relative to the second control ranked N-1 can be determined as the relative position information of the second control ranked N, where N is a positive integer not less than 2.

[0100] Optionally, you can define the x-axis offset as xOffset and set the initial value of xOffset to 0. Traverse the childList list, calculate the difference between the left and top of the rectangular box of the upper control sorted 1 and the left and top of the rectangular box of the bottom control, then subtract xOffset from the difference of left as the spacing of the upper control sorted 1 on the horizontal axis, and the top as the spacing of the upper control sorted 1 on the vertical axis, and assign the left of the rectangular box of the upper control sorted 1 plus the width of the rectangular box to xOffset to achieve the first update of xOffset; then calculate the difference between the left and top of the rectangular box of the upper control sorted 2 and the left and top of the upper control sorted 1, then subtract xOffset obtained after the first update from the difference of left as the spacing of the upper control sorted 2 on the horizontal axis, and the top as the spacing of the upper control sorted 2 on the vertical axis, and assign the left of the rectangular box of the upper control sorted 2 plus the width of the rectangular box to xOffset to achieve the second update of xOffset, and so on, to achieve the determination of the relative position information of multiple second controls.

[0101] In another possible implementation, when the second control is a column container including multiple second controls, the multiple second controls are sorted based on the vertical coordinate information of the multiple second controls, and the relative position information of the multiple second controls is determined based on the sorting of the multiple second controls, the absolute position information of the multiple second controls and the absolute position information of the first control.

[0102] It should be noted that if the first control is a column container, the column container can have multiple child elements, so the first control can include multiple parent controls. When describing the relative position information of each parent control in the column container, the margin spacing of the first parent control is relative to the bottom control, while the margin spacing of the second to the last parent control is relative to the previous (upper adjacent) parent control of the same level.

[0103] Therefore, when the first control is a column container, the multiple second controls corresponding to the first control can be sorted in ascending order of the vertical coordinates, so as to obtain the relative position information of each second control based on the sorting result. The horizontal coordinate can be the coordinate of the top vertex of each second control.

[0104] It should be noted that, for the second control ranked 1, the position difference information of the second control ranked 1 relative to the first control can be determined as the relative position information of the second control ranked 1; and for the second control ranked N, the position difference information of the second control ranked N relative to the second control ranked N-1 can be determined as the relative position information of the second control ranked N, where N is a positive integer not less than 2.

[0105] Optionally, you can define the y-axis offset as yOffset and set the initial value of yOffset to 0. Traverse the childList list, calculate the difference between the left and top of the rectangular box of the upper control sorted 1 and the left and top of the rectangular box of the bottom control, then subtract the yOffset from the top difference as the spacing of the upper control sorted 1 on the vertical axis, and the left as the spacing of the upper control sorted 1 on the horizontal axis, and assign the top of the rectangular box of the upper control sorted 1 plus the width of the rectangular box to yOffset to achieve the first update of yOffset; then calculate the left and top of the rectangular box of the upper control sorted 2 and the left and top of the upper control sorted 1, then subtract the yOffset obtained after the first update from the top difference as the spacing of the upper control sorted 2 on the vertical axis, and the left as the spacing of the upper control sorted 2 on the horizontal axis, and assign the top of the rectangular box of the upper control sorted 2 plus the width of the rectangular box to yOffset to achieve the second update of yOffset, and so on, to achieve the determination of the relative position information of multiple second controls.

[0106] In another possible implementation, when the second control is a stacked container including multiple second controls, based on the absolute position information of the first control and the absolute position information of each second control, the position difference information of each second control relative to the first control is determined as the relative position information of each second control.

[0107] It should be noted that if the first control is a stack container, the stack container can have multiple child elements, so that the first control can include multiple upper-level controls. When describing the relative position information of each upper-level control in the stack container, the margin spacing of each upper-level control is relative to the underlying control.

[0108] Therefore, when the first control is a stacking container, the childList list can be traversed to calculate the difference between the left and top of the rectangular box of the currently traversed upper control and the left and top of the rectangular box of the bottom control as the margin spacing of the currently traversed upper control.

[0109] The above process mainly describes how to obtain the relative position information of the second control when the control set is not empty. If the control set is empty, it indicates that the second control is not included in the corresponding first control. In this case, there is no need to obtain the relative position information of the second control. Alternatively, if the control set is empty, that is, if the childList list is empty, parentString can be directly returned.

[0110] Through the above process, the absolute position information of the first control and the relative position information of the second control can be obtained. Compared with the method of using absolute position information to describe the page layout, the method of using relative position information to describe the page layout can be used in the page visualization configuration process and the page development process. Therefore, compared with the absolute position information, the relative position information is more readable, thereby improving the readability of the generated descriptive language file, and further improving the readability of other files converted based on the descriptive language file.

[0111] After obtaining the absolute position information of the first control and the relative position information of the second control, a descriptive language file corresponding to the target page can be generated based on the attribute information of the multiple controls in step 203 .

[0112] In some embodiments, in step 203, when generating a descriptive language file corresponding to the target page based on the attribute information of the multiple controls, the following steps may be included:

[0113] Step 2031: Generate multiple character strings in a first preset format based on the attribute information of multiple controls.

[0114] The first preset format string may be a JSON string. JSON is a universal lightweight data exchange format. By generating a descriptive language file based on a JSON string, parsing and format conversion of the descriptive language file are simplified, thereby improving page development efficiency.

[0115] Optionally, each time the relative position information of a second control is obtained, the template function can be called to generate a JSON string describing the relative position information of the corresponding second control, thereby obtaining multiple JSON strings, that is, multiple strings in the first preset format. It should be noted that the JSON string can be recorded as childString.

[0116] Step 2032: Generate a descriptive language file based on multiple character strings in preset formats.

[0117] Optionally, when generating a descriptive language file based on multiple character strings in preset formats, the descriptive language file may be generated according to the number of controls included in the control set (ie, the length of the childList list).

[0118] If the length of the childList list is 1, the @child character in the parentString character can be replaced with the parentString2 character, and the control identifier of the upper-level control included in the childList list can be taken out and recorded as the childList2 list. At this time, because the length of the childList list is 1, there is only one upper-level control in the bottom-level control, and there are no other controls in the upper-level control. Moreover, due to the restrictions of the control layout requirements, no controls will be laid out in the upper-level control. Therefore, the childList2 list is empty and the parentString2 character can be returned directly.

[0119] If the length of childList is greater than 1, indicating that the underlying control contains more than one upper-level control, the control identifier of each upper-level control in childList can be recorded as a childList list, and the value of the current child element in the parent-child relationship mapping set can be retrieved and recorded as childList2 list. However, due to control layout requirements, no controls will be placed in the upper-level control. Therefore, childList2 list is empty, so the childString character string can be directly returned. Optionally, the value of the returned childString character string can be written to jsonBuffer.

[0120] The above process can obtain multiple values ​​of the variable jsonBuffer, which is equivalent to obtaining a jsonBuffer byte stream. If the jsonBuffer byte stream is not empty, you can convert the jsonBuffer byte stream into a jsonBufferString string and replace the @child characters in the parentString string with the jsonBufferString string.

[0121] At this point, the attribute information of the target page can be converted into the corresponding DSL description language to obtain a DSL file as a descriptive language file.

[0122] DSL files can be parsed using the DSL4.0 parsing framework. Developers can use a web browser to view the configured page information in real time based on the parsed DSL file and make modifications to the configured page. After making modifications, refreshing the page again will synchronize the developer's modified content.

[0123] Refer to Figure 7, which is a flow chart of a page processing method according to an embodiment of the present application. As shown in Figure 7, after obtaining the widgetList list (that is, the control information list), the widgetList can be traversed to determine the hierarchical relationship between the controls based on the attribute information of the Rect object, thereby constructing the parent-child parentChildrenMap (that is, the control set) according to the determined hierarchical relationship, taking the first element of the widgetList list, recorded as curWidget, and converting the view (that is, the view) corresponding to curWidget into JSON characters, and then performing subsequent processing based on the type of curWidget. In the case where curWidget is a single-child type, the JSON character indicating the curWidget type can be set to child:@child. In the case where curWidget is a multi-child type, the JSON character indicating the curWidget type can be set to child:[@child]. Regardless of the above method, after completing the setting of the JSON character, the JSON character can be recorded as parentString. After obtaining parentString, you can obtain curWidget's widgetId (also known as the widget identifier), extract the value corresponding to widgetId in parentChildrenMap, record it as childList, and then record the type of parentString, childList, and curWidget as parentType, and create inBuffer. After creating inBuffer, you can first determine whether childList is empty. If childList is empty, you can replace child:@child in parentString with an empty string and return it. If childList is not empty, you can perform different processing based on parentType.When parentType is Row (that is, a row container), childList can be sorted in order of x from small to large. When parentType is Column (that is, a column container), childList can be sorted in order of y from small to large. When parentType is neither Row nor Column, childList can be traversed, each item in childList can be taken as curItem, and the margin of curItem can be calculated to create a new container so that the created container wraps the current curItem, and then the view corresponding to curItem is converted into JSON characters, and the converted characters are recorded as curJson. When the newly created container is a single child, the child content in the JSON character can be set to child:@child. When the newly created container is multiple children, the child content in the JSON character can be set to child:[@child]. Regardless of the above method, after completing the setting of the child content in the JSON character, it is necessary to determine whether the length of curList is greater than 1. If so, curJson can be written to inBuffer. Otherwise, @child in parentString is replaced with curJson. Whether after writing curJson into inBuffer or replacing @child in parentString with curJson, you can get the widgetId of curItem, and then take out the value corresponding to the widgetId in parentChildrenMap, recorded as childList1, and then make a recursive call to use the type of curItem as parentType and the child element childList1 of curItem as childList to create inBuffer, and then repeat the above process after creating inBuffer. If the length of inBuffer is greater than 0, you can replace @child in parentString with inBuffer characters, and if the length of inBuffer is less than or equal to 0, you can replace @child in parentString with curJson to return parentString characters. Through the above process, the attribute information of the control can be described in the form of JSON language, thereby realizing the generation of descriptive language files.

[0124] The above process mainly introduces the process of obtaining a descriptive language file. In more possible implementation methods, the descriptive language file can also be converted into a source code (Dart) file. Furthermore, developers can also synchronize the converted Dart source code directly to the corresponding code repository through the Jenkins backend.

[0125] Among them, Dart is a computer programming language developed by Google. It is a language that can be run directly by computers. The file written in Dart language is a Dart file. By converting the descriptive language file into a Dart file, the computer can directly compile the Dart file to run the Dart code in the Dart file, thereby realizing the display of the target page.

[0126] A code repository, also known as a repository, resource library, version library, code base, or storage repository, is a public or private location where large amounts of source code are stored. Most repositories are used for backups and version control, and they help resolve various code versioning issues in multi-development projects. By syncing Dart source code to a code repository, all developers working on the same project can access the Dart source code, allowing them to view and modify it across different development files.

[0127] In some embodiments, a source code acquisition control may be provided in the page development platform so that developers can convert the descriptive language file into a source code file by triggering the source code acquisition control.

[0128] In a possible implementation, in response to a triggering operation on a source code acquisition control, the descriptive language file may be parsed to convert the descriptive language file into a source code file.

[0129] It should be noted that in the related art, generally only one page is created under a project, so that each project only contains one project (one page corresponds to one project). However, this application adds the concept of directory on the basis of the single project of the page development platform. Based on the directory, after creating a project, the developer can create at least multiple directories under the project and create pages under these multiple directories to achieve the effect of classifying and storing pages by target. Moreover, within the project corresponding to each page, the developer can configure the jump operation between it and other pages to achieve the jump between multiple pages.

[0130] Based on this, in some embodiments, in response to the triggering operation of the source code acquisition control, parsing the descriptive language file to convert the descriptive language file into a source code file may include the following steps:

[0131] Step 1: In response to a trigger operation on a source code acquisition control, a directory list is acquired, where the directory list includes a plurality of items, and the items are subdirectories and / or descriptive language files.

[0132] It should be noted that the target list may be a folderList directory list, which may include multiple items, wherein an item may be a descriptive language file or a subdirectory, and a subdirectory may further include at least one descriptive language file.

[0133] For example, a directory list may include DSL file 1, DSL file 2, subdirectory 1 and subdirectory 2. Subdirectory 1 may include DSL file 3, and subdirectory 2 may include DSL file 4 and DSL file 5. The multiple DSL files under the directory list correspond to the projects created by the user at the beginning of page development.

[0134] Optionally, before obtaining the directory list in response to the trigger operation of the source code acquisition control, it can be determined whether all pages of the current project have been converted into descriptive language files. If there are unconverted pages, the unconverted pages can be converted into descriptive language files through the above embodiment, so that when all pages have been converted into descriptive language files, the target list can be obtained in response to the trigger operation of the source code acquisition control.

[0135] Step 2: For any item in the directory list, if the item is a descriptive language file, the descriptive language file is parsed to convert the descriptive language file into a source code file; if the item is a directory, the descriptive language file is obtained from the directory and parsed to convert the descriptive language file into a source code file.

[0136] In a possible implementation, when parsing a descriptive language file to convert the descriptive language file into a source code file, it can be implemented as follows:

[0137] For any first control in the descriptive language file, based on the control type of the first control, the character strings of the first control and the second control corresponding to the first control in the descriptive language file are format converted to obtain character strings in a second preset format.

[0138] Optionally, the folderList directory list can be recursively traversed to determine whether the currently traversed item is a file or a directory. If the currently traversed item is a directory, a folder can be created according to the set directory name, and then a descriptive language file can be retrieved from the directory for subsequent processing based on the descriptive language file; if the currently traversed item is a file, subsequent processing can be performed directly based on the descriptive language file.

[0139] Recursively traverse each descriptive language file, and each time a descriptive language file is traversed, each control in the descriptive language file can be processed in turn. Optionally, the control type of the control to be parsed can be determined, so that the source code corresponding to the control can be obtained based on the determined control type. Different types of controls will correspond to different source code templates, so that code can be obtained based on the corresponding source code templates.

[0140] If the control is a common container, which includes only one element (corresponding to an upper-level control), and the source code template corresponding to the common container is a container template, then the margin character corresponding to the element can be obtained from the descriptive language file, and the template engineering method can be called to convert it into the margin character corresponding to the margin object in the Dart language. A variable name can be set for the converted margin character, recorded as EdgMargin; the object indicating the width (width) and height (height) of the element can also be obtained from the descriptive language file, and the template engineering method can be called to convert it into the width and height characters of the Dart language. The converted width and height characters can be recorded as widthH eight; you can also get the decoration object of the element from the descriptive language file, call the template engineering method to convert it into the decoration character decorationString of the Dart language, and then call the template engineering method to replace the @margin character corresponding to the margin object in the container template with EdgMargin, replace the @width character corresponding to the object indicating the width of the element and the @height character corresponding to the object indicating the height of the element with widthHeight characters, and replace the @decoration character corresponding to the decoration object with decorationString characters.

[0141] Furthermore, it is also possible to determine whether the element has a child element. If not, the @child character can be replaced with the SizedBox() character. If so, the control type of the child object can be determined in the same way as the above process, and then the DSL description language corresponding to the child object can be converted into source code based on the determined control type, and the converted string can be used to replace the @child character in the container template.

[0142] If the control is a column container or a row container, and both the column container and the row container include multiple elements, the multiple elements can be processed in sequence. Optionally, the layout characters of the primary and secondary axes corresponding to the currently processed element (that is, the relative position information of the control corresponding to the currently processed element) can be obtained from the descriptive language file, and the template project is called to convert it into the description text of the primary and secondary axis layout in the Dart language. The description text of the primary and secondary axis layout obtained by conversion can be recorded as variables mainAxisString and variable crossAxisString, and then the template project is called to replace the @mainAxis character of the variable mainAxisString in the source code template of the column container or row container with the mainAxisString character, and replace the @crossAxis character of the variable crossAxisString with crossAxisString.

[0143] Furthermore, it is also possible to determine whether the element has child elements. If not, the @child character can be replaced with the SizedBox() character. If so, the control type of each object in the children list can be determined in the same way as the above process. Then, based on the determined control type, the DSL description language corresponding to each object in the children list can be converted into source code, and the converted string can be used to replace the @child character in the source code template.

[0144] If the control is a stacking container, which includes multiple elements, for any element, it can be determined whether the element has children elements. If not, the @child character can be replaced with the SizedBox() character. If so, the control type of each object in the children list can be determined in the same way as the above process. Then, based on the determined control type, the DSL description language corresponding to each object in the children list is converted into source code, and the converted string is used to replace the @child character in the source code template.

[0145] If the control is a text view control, and the source code template corresponding to the text control is a text template, then the text information characters configured for the control (that is, the text characters to be displayed in the control) can be obtained from the descriptive language file, and the obtained text information characters are recorded as dataString; the style object configured for the control can also be obtained from the descriptive language file, and the obtained style object can be converted into characters. The converted characters can be recorded as styleString, and then the template project is called to replace the @data characters in the text template with dataString characters, and replace the @style characters in the text template with styleString characters.

[0146] If the control is an Image view control, and the source code template corresponding to the Image control is also a text template, you can obtain the image address information characters configured for the control from the descriptive language file, and record the obtained image address information characters as urlString; you can also obtain the width and height objects configured for the control from the descriptive language file, and convert the obtained characters into characters. The converted characters can be recorded as widthString and heightString, and then call the template project, replace the @url characters in the text template file with urlString characters, replace the @width characters in the text template file with widthString characters, and replace the @height characters in the text template file with heightString.

[0147] The above process converts the content of the descriptive language file into a Dart source code string. The resulting Dart source code string can be recorded as pageString. Furthermore, you can call the template project and replace the @child characters in the page template with pageString. At this point, a complete Dart source code string is generated. Then, create a .dart file with the configured class name and write the source code string to this file to obtain the source code file corresponding to the descriptive language file.

[0148] It should be noted that after the directory traversal is completed, a directory with a multi-layer structure can be obtained, and each layer corresponds to a source code file. The obtained source code file can be compressed and packaged and stored at a preset address, and the download address can be returned to the developer based on the preset address. The developer can download the compressed and packaged source code file to the local computer through the download address, so as to perform secondary development of the page at the source code level based on the downloaded source code file.

[0149] Optionally, the above process is described using the example of triggering the download of source code files through the source code acquisition control. In more possible implementations, developers can also use a visual web tool service to convert source code. The visual web tool service can be a Jenkins service.

[0150] In one possible implementation, the project identifier corresponding to the descriptive language file can be obtained through the target platform; based on the project identifier, a directory list corresponding to the descriptive language file is obtained; and the directory list is added to a preset directory to obtain an executable program file.

[0151] For example, a developer can open the Jenkins service, enter a project ID, and trigger the source code build process. The Jenkins service can use the project ID to obtain the project's descriptive language file. Based on the obtained descriptive language file, it then parses the descriptive language file to obtain the project's configuration information. It then traverses the project's directory structure to obtain a multi-layered directory (also known as a directory listing) to achieve the conversion from the DSL description language to source code.

[0152] Optionally, the developer can pre-set the Git repository address to indicate in which Git repository the generated source code files are to be stored.

[0153] If the Git repository address corresponds to a non-empty repository, you can pull the repository information to copy the created directory to the Lib directory, and then commit the changes to the repository. If the Git repository address corresponds to an empty repository, you can pull the address of a pre-set template project, copy the created directory to the Lib directory of the template project, and then commit the changes to the repository.

[0154] Refer to Figure 8, which is a flow chart of a source code file acquisition process according to an embodiment of the present application. As shown in Figure 8, after obtaining the project identifier, the configuration information of the project can be obtained according to the project identifier, thereby converting the configuration information into a pageList list, and creating a root directory according to the project name. Traverse the pageList list. If the traversed directory is a directory, the directory can be generated according to the set name; if the traversed directory is not a directory, the StatefullWidget template file can be taken out, and the @child character in the template file can be replaced with the pageJson character of the current file. The pageJson character can be recorded as widgetString, thereby taking out the directory level of the current node, creating a file under the specified directory level, and writing widgetString into the current file. Then, it is determined whether the current node has child elements. If so, the child elements can be taken out and converted into a pageList list, thereby continuing to traverse the converted pageList list.

[0155] If the developer chooses to download the source code file directly, the generated directory can be packaged into a compressed package (also known as a zip package) at the root directory to obtain the source code file, and then the zip package can be returned to the front end so that the developer can add the source code file to the local project for secondary development. If the developer does not choose to download the source code file directly, the pre-input Git warehouse address can be cloned to the local directory. If the Git warehouse address corresponds to an empty warehouse, the set template project can be downloaded and copied to the empty Git project. Then, the generated directory or file can be copied to the Lib directory under the Git project. If the Git warehouse address does not correspond to an empty warehouse, the generated directory or file can be directly copied to the Lib directory under the Git project. After copying the generated directory or file to the Lib directory under the Git project, the changes can be submitted to the warehouse so that the developer can pull the latest code from the warehouse for secondary development.

[0156] In more possible implementations, an executable program product (ie, an executable program file) on a mobile phone or Windows side may be obtained based on the descriptive language file.

[0157] In a possible implementation, the project identifier corresponding to the descriptive language file and the device version corresponding to the executable program file to be generated can be obtained through the target platform; thereby generating the executable program file based on the project identifier and the device version.

[0158] For example, after the user saves the configuration page, he can enter the corresponding project ID in the Jenkins management background and select the corresponding terminal version according to the terminal to be applied to. The Jenkins management background can then build an apk file for the mobile phone or an exe executable file for the Windows side to obtain an executable program product for the mobile phone or Windows side.

[0159] Corresponding to the embodiments of the aforementioned method, the present application also provides embodiments of a corresponding page processing apparatus and a computing device to which it is applied.

[0160] As shown in FIG9 , FIG9 is a block diagram of a page processing device according to an embodiment of the present application, the device including:

[0161] A first acquisition module 901 is configured to, in response to a target page generation operation in a page development platform, acquire a hierarchical relationship between various controls in the generated target page;

[0162] A second acquisition module 902 is configured to acquire attribute information of multiple controls based on a hierarchical relationship between the multiple controls in the target page, where the attribute information includes at least absolute position information of at least one first control as a bottom-layer control and relative position information of at least one second control as an upper-layer control;

[0163] The generating module 903 is used to generate a descriptive language file corresponding to the target page based on the attribute information of the multiple controls.

[0164] In some embodiments, the second acquisition module 902, when used to acquire attribute information of multiple controls based on the hierarchical relationship between the multiple controls in the target page, is used to:

[0165] Based on the hierarchical relationship between the multiple controls, at least one control set is generated, where the control set uses the control identifier of the first control as the bottom-level control as a key, and the control set is used to store the control identifier of the second control as the upper-level control corresponding to the bottom-level control;

[0166] For any control set, the property information of the first control corresponding to the control set and the property information of the second control in the control set are obtained.

[0167] In some embodiments, when the attribute information is location information, the second acquisition module 902, when used to acquire the attribute information of the first control corresponding to any control set and the attribute information of the second control in the control set, is used to:

[0168] For any control set, obtain the absolute position information of the first control corresponding to the control set;

[0169] When the control set is not empty, the relative position information of the at least one second control is acquired based on the control type of the first control and the absolute position information of the at least one second control in the control set.

[0170] In some embodiments, the second acquisition module 902, when used to acquire relative position information of at least one second control based on the control type of the first control and the absolute position information of at least one second control in the control set, is used for any of the following:

[0171] If the control type of the first control is a common container that includes only one second control, then based on the absolute position information of the first control and the absolute position information of the second control, determine the position difference information of the second control relative to the first control as the relative position information of the second control;

[0172] If the control type of the first control is a stacked container including multiple second controls, then based on the absolute position information of the first control and the absolute position information of each second control, the position difference information of each second control relative to the first control is determined as the relative position information of each second control.

[0173] In some embodiments, the second acquisition module 902, when used to acquire relative position information of at least one second control based on the control type of the first control and the absolute position information of at least one second control in the control set, is further used for any of the following:

[0174] If the control type of the first control is a row container including multiple second controls, sorting the multiple second controls based on the horizontal coordinate information of the multiple second controls, and determining the relative position information of the multiple second controls based on the sort of the multiple second controls, the absolute position information of the multiple second controls, and the absolute position information of the first control;

[0175] If the control type of the first control is a column container including multiple second controls, the multiple second controls are sorted based on the vertical coordinate information of the multiple second controls, and the relative position information of the multiple second controls is determined based on the sorting of the multiple second controls, the absolute position information of the multiple second controls and the absolute position information of the first control.

[0176] In some embodiments, the second acquisition module 902, when used to determine the relative position information of the plurality of second controls based on the order of the plurality of second controls, the absolute position information of the plurality of second controls, and the absolute position information of the first control, is used to:

[0177] For the second control ranked 1, determine position difference information of the second control ranked 1 relative to the first control as the relative position information of the second control ranked 1;

[0178] For the second control ranked N, determine the position difference information of the second control ranked N relative to the second control ranked N-1 as the relative position information of the second control ranked N, where N is a positive integer not less than 2.

[0179] In some embodiments, the generating module 903, when generating a descriptive language file corresponding to a target page based on the property information of a plurality of controls, is configured to:

[0180] Based on the attribute information of the plurality of controls, a plurality of character strings in a first preset format are generated, where the character strings are used to describe the attribute information according to the format requirements of the first preset format;

[0181] Generate a descriptive language file based on multiple pre-formatted strings.

[0182] In some embodiments, the first acquisition module 901, when used to obtain the hierarchical relationship between various controls in the generated target page in response to a generation operation of the target page in the page development platform, is used to:

[0183] In response to a control adding operation in the page development platform, displaying a target page based on a plurality of controls added in the page development platform;

[0184] In response to the generation operation of the target page, the hierarchical relationship between the various controls in the target page is obtained.

[0185] In some embodiments, the first acquisition module 901, when used to acquire the hierarchical relationship between various controls in the target page in response to the generation operation of the target page, is used to:

[0186] In response to the generation operation of the target page, the hierarchical relationship between the controls in the target page is determined based on the control type and position information of the controls in the target page.

[0187] In some embodiments, the first acquisition module 901, when used to determine the hierarchical relationship between the controls in the target page based on the control type and location information of the controls in the target page, is used to:

[0188] Traverse each control included in the target page. Each time a control is traversed, determine the hierarchical relationship between the target control and other controls based on the control type of the target control currently traversed and the positional relationship between the target control and other controls in the target page.

[0189] In some embodiments, the page development platform includes a source code acquisition control;

[0190] The device also includes:

[0191] The conversion module is used to parse and convert the descriptive language file into a source code file in response to a triggering operation on the source code acquisition control.

[0192] In some embodiments, the conversion module, when used to parse the descriptive language file in response to the triggering operation of the source code acquisition control to convert the descriptive language file into a source code file, is used to:

[0193] In response to a trigger operation on a source code acquisition control, a directory list is acquired, where the directory list includes a plurality of items, each of which is a subdirectory and / or a descriptive language file;

[0194] For any item in the directory list, if the item is a descriptive language file, the descriptive language file is parsed to convert the descriptive language file into a source code file. If the item is a directory, the descriptive language file is obtained from the directory, and the descriptive language file is parsed and format converted to convert the descriptive language file into a source code file.

[0195] In some embodiments, the conversion module, when used to parse and convert the descriptive language file to convert the descriptive language file into a source code file, is used to:

[0196] For any first control in the descriptive language file, based on the control type of the first control, formatting the character strings of the first control and the second control corresponding to the first control in the descriptive language file to obtain character strings in a second preset format;

[0197] A source code file is generated based on the character string in the second preset format.

[0198] In some embodiments, the apparatus further comprises:

[0199] A third acquisition module is used to acquire, through the target platform, the project identifier corresponding to the descriptive language file and the device version corresponding to the executable program file to be generated;

[0200] The generating module 903 is further configured to generate an executable program file based on the project identifier and the device version.

[0201] For the device embodiments, since they basically correspond to the method embodiments, the relevant parts can be referred to the partial description of the method embodiments. The device embodiments described above are merely illustrative, and the modules described as separate components may or may not be physically separated, and the components displayed as modules may or may not be physical modules, that is, they may be located in one place, or they may be distributed on multiple network modules. Some or all of the modules can be selected according to actual needs to achieve the purpose of the scheme of this specification. Those of ordinary skill in the art can understand and implement it without paying any creative work.

[0202] The present application also provides a computing device, see Figure 10, which is a schematic diagram of the structure of a computing device according to an embodiment of the present application. As shown in Figure 10, the computing device includes a processor 1010, a memory 1020 and a network interface 1030. The memory 1020 is used to store computer instructions that can be run on the processor 1010. The processor 1010 is used to implement the page processing method provided in any embodiment of the present application when executing computer instructions. The network interface 1030 is used to implement input and output functions. In more possible implementations, the computing device may also include other hardware, which is not limited by the present application.

[0203] The present application also provides a computer-readable storage medium, which can be in various forms. For example, in different examples, the computer-readable storage medium can be: RAM (Random Access Memory), volatile memory, non-volatile memory, flash memory, storage drive (such as a hard disk drive), solid-state drive, any type of storage disk (such as a CD, DVD, etc.), or similar storage medium, or a combination thereof. In particular, the computer-readable medium can also be paper or other suitable medium capable of printing programs. A computer program is stored on the computer-readable storage medium, and when the computer program is executed by the processor, the page processing method provided in any embodiment of the present application is implemented.

[0204] The present application also provides a computer program product, including a computer program, which implements the page processing method provided in any embodiment of the present application when the computer program is executed by a processor.

[0205] It should be understood by those skilled in the art that one or more embodiments of this specification may be provided as a method, apparatus, computing device, computer-readable storage medium, or computer program product. Thus, one or more embodiments of this specification may take the form of a fully hardware embodiment, a fully software embodiment, or an embodiment combining software and hardware aspects. Furthermore, one or more embodiments of this specification may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to magnetic disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0206] The various embodiments in this specification are described in a progressive manner. Similar portions between the various embodiments can be referenced to each other. Each embodiment focuses on the differences between the other embodiments. In particular, the embodiments corresponding to the computing device are generally similar to the method embodiments, so the description is relatively simple. For relevant portions, refer to the description of the method embodiments.

[0207] The foregoing description of specific embodiments of this specification is provided. Other embodiments are within the scope of this application. In some cases, the actions or steps described herein may be performed in an order different from that shown in the embodiments and still achieve the desired results. Additionally, the processes depicted in the accompanying drawings do not necessarily require the specific order or sequential order shown to achieve the desired results. In certain embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0208] Embodiments of the subject matter and functional operations described in this specification may be implemented in digital electronic circuitry, tangibly embodied computer software or firmware, computer hardware including the structures disclosed in this specification and their structural equivalents, or a combination of one or more thereof. Embodiments of the subject matter described in this specification may be implemented as one or more computer programs, i.e., one or more modules of computer program instructions encoded on a tangible, non-transitory program carrier for execution by a page processing device or to control the operation of the page processing device. Alternatively or additionally, the program instructions may be encoded on an artificially generated propagated signal, such as a machine-generated electrical, optical, or electromagnetic signal, that is generated to encode information and transmit it to a suitable receiver device for execution by the page processing device. The computer storage medium may be a machine-readable storage device, a machine-readable storage substrate, a random or serial access memory device, or a combination of one or more thereof.

[0209] The processes and logic flows described in this specification can be performed by one or more programmable computers executing one or more computer programs to perform the corresponding functions by operating on input data and generating output. The processes and logic flows can also be performed by, and apparatus can be implemented as, special purpose logic circuitry, such as an FPGA (field programmable gate array) or an ASIC (application-specific integrated circuit).

[0210] Computers suitable for executing computer programs include, for example, general-purpose and / or special-purpose microprocessors, or any other type of central processing unit. Typically, the central processing unit will receive instructions and data from a read-only memory and / or random access memory. The basic components of a computer include a central processing unit for implementing or executing instructions and one or more memory devices for storing instructions and data. Typically, a computer will also include one or more mass storage devices for storing data, such as magnetic disks, magneto-optical disks, or optical disks, or the computer will be operably coupled to such mass storage devices to receive data from them or to transmit data to them, or both. However, a computer does not necessarily have such devices. In addition, a computer can be embedded in another device, such as a mobile phone, a personal digital assistant (PDA), a mobile audio or video player, a game console, a global positioning system (GPS) receiver, or a portable storage device such as a universal serial bus (USB) flash drive, to name a few.

[0211] Computer-readable media suitable for storing computer program instructions and data include all forms of nonvolatile memory, media, and storage devices, including, for example, semiconductor memory devices (e.g., EPROM, EEPROM, and flash memory devices), magnetic disks (e.g., internal hard disks or removable disks), magneto-optical disks, and CD ROM and DVD-ROM disks. The processor and memory can be supplemented by, or incorporated in, special purpose logic circuitry.

[0212] Although this specification includes many specific implementation details, these should not be interpreted as limiting the scope of any invention or the scope of protection claimed, but are mainly used to describe the features of specific embodiments of specific inventions. Certain features described in multiple embodiments within this specification may also be implemented in combination in a single embodiment. On the other hand, the various features described in a single embodiment may also be implemented separately in multiple embodiments or in any suitable sub-combination. In addition, although features may work in certain combinations as described above and even initially claimed as such, one or more features from the claimed combination may be removed from the combination in some cases, and the claimed combination may point to a sub-combination or a variation of the sub-combination.

[0213] Similarly, although operations are depicted in a particular order in the accompanying drawings, this should not be understood as requiring that these operations be performed in the particular order shown or performed sequentially, or that all illustrated operations be performed to achieve the desired results. In some cases, multitasking and parallel processing may be advantageous. In addition, the separation of various system modules and components in the above-described embodiments should not be understood as requiring such separation in all embodiments, and it should be understood that the described program components and systems can generally be integrated together in a single software product, or packaged into multiple software products.

[0214] Thus, specific embodiments of the subject matter have been described. Other embodiments are within the scope of this application. In some cases, the actions described in this application can be performed in a different order and still achieve the desired results. Furthermore, the processes depicted in the accompanying drawings do not necessarily require the specific order or sequential sequence shown to achieve the desired results. In some implementations, multitasking and parallel processing may be advantageous.

[0215] Those skilled in the art will readily appreciate other embodiments of the present invention after considering the present invention and practicing the invention claimed herein. This specification is intended to cover any variations, uses, or adaptations of the present invention that follow the general principles of this specification and include common knowledge or customary techniques in the art that are not claimed herein. That is, this specification is not limited to the precise structure described above and shown in the accompanying drawings, and various modifications and variations may be made without departing from the scope thereof.

[0216] The above description is only an optional embodiment of this specification and is not intended to limit this specification. Any modifications, equivalent replacements, improvements, etc. made within the spirit and principles of this specification should be included in the scope of protection of this specification.

Claims

1. A page processing method, characterized in that: The method comprises: In response to a generation operation of a target page in a page development platform, a hierarchical relationship between various controls in the generated target page is obtained; Based on the hierarchical relationship between the multiple controls in the target page, acquiring attribute information of the multiple controls, the attribute information at least including absolute position information of at least one first control as a bottom-layer control and relative position information of at least one second control as an upper-layer control; Based on the attribute information of the multiple controls, a descriptive language file corresponding to the target page is generated.

2. The method according to claim 1, characterized in that The acquiring the attribute information of the multiple controls based on the hierarchical relationship between the multiple controls in the target page includes: Based on the hierarchical relationship between the multiple controls, at least one control set is generated, the control set uses the control identifier of the first control as the bottom-level control as a key, and the control set is used to store the control identifier of the second control as the upper-level control corresponding to the bottom-level control; For any control set, the property information of the first control corresponding to the control set and the property information of the second control in the control set are obtained.

3. The method according to claim 2, characterized in that In the case where the attribute information is position information, for any control set, acquiring the attribute information of a first control corresponding to the control set and the attribute information of a second control in the control set includes: For any control set, obtaining the absolute position information of the first control corresponding to the control set; When the control set is not empty, the relative position information of the at least one second control is acquired based on the control type of the first control and the absolute position information of at least one second control in the control set.

4. The method according to claim 3, characterized in that The acquiring the relative position information of the at least one second control based on the control type of the first control and the absolute position information of the at least one second control in the control set includes any of the following: If the control type of the first control is a common container including only one second control, then based on the absolute position information of the first control and the absolute position information of the second control, position difference information of the second control relative to the first control is determined as the relative position information of the second control; If the control type of the first control is a stacked container including multiple second controls, based on the first control The absolute position information of the first component and the absolute position information of each second component are used to determine the position difference information of each second component relative to the first component as the relative position information of each second component.

5. The method according to claim 3, characterized in that: The acquiring the relative position information of at least one second control based on the control type of the first control and the absolute position information of at least one second control in the control set further includes any of the following: If the control type of the first control is a row container including multiple second controls, the multiple second controls are sorted based on the horizontal coordinate information of the multiple second controls, and the relative position information of the multiple second controls is determined based on the sort of the multiple second controls, the absolute position information of the multiple second controls and the absolute position information of the first control; If the control type of the first control is a column container including multiple second controls, the multiple second controls are sorted based on the vertical coordinate information of the multiple second controls, and the relative position information of the multiple second controls is determined based on the sorting of the multiple second controls, the absolute position information of the multiple second controls and the absolute position information of the first control.

6. The method according to claim 5, characterized in that The determining the relative position information of the plurality of second controls based on the order of the plurality of second controls, the absolute position information of the plurality of second controls, and the absolute position information of the first control comprises: For a second control ranked 1, determining position difference information of the second control ranked 1 relative to the first control as relative position information of the second control ranked 1; For a second control ranked N, position difference information of the second control ranked N relative to a second control ranked N-1 is determined as relative position information of the second control ranked N, where N is a positive integer not less than 2.

7. The method according to claim 1, characterized in that The generating, based on the attribute information of the plurality of controls, a descriptive language file corresponding to the target page comprises: Based on the attribute information of the plurality of controls, generating a plurality of character strings in a first preset format, the character strings being used to describe the attribute information according to the format requirements of the first preset format; The descriptive language file is generated based on the plurality of character strings in the first preset format.

8. The method according to claim 1, characterized in that The step of obtaining the hierarchical relationship between the controls in the generated target page in response to the target page generation operation in the page development platform includes: In response to a control adding operation in the page development platform, displaying a target page based on a plurality of controls added in the page development platform; In response to the generation operation of the target page, the hierarchical relationship between the controls in the target page is obtained.

9. The method according to claim 8, characterized in that The step of obtaining the hierarchical relationship between the controls in the target page in response to the generation operation of the target page includes: In response to the generation operation of the target page, the hierarchical relationship between the controls in the target page is determined based on the control type and position information of the controls in the target page.

10. The method according to claim 9, characterized in that The determining the hierarchical relationship between the controls in the target page based on the control type and position information of the controls in the target page includes: Each control included in the target page is traversed, and each time a control is traversed, the hierarchical relationship between the target control and other controls in the target page is determined based on the control type of the currently traversed target control and the positional relationship between the target control and other controls in the target page.

11. The method according to claim 1, characterized in that: The page development platform includes a source code acquisition control; After generating the descriptive language file corresponding to the target page based on the attribute information of the plurality of controls, the method further includes: In response to a triggering operation on the source code acquisition control, the descriptive language file is parsed and format converted to convert the descriptive language file into a source code file.

12. The method according to claim 11, characterized in that The step of parsing the descriptive language file in response to the triggering operation of the source code acquisition control to convert the descriptive language file into a source code file includes: In response to a trigger operation on the source code acquisition control, a directory list is acquired, wherein the directory list includes a plurality of items, and the items are sub-directories and / or descriptive language files; For any item in the directory list, if the item is a descriptive language file, the descriptive language file is parsed and formatted to convert the descriptive language file into a source code file. If the project is a subdirectory, the descriptive language file is obtained from the subdirectory, and the descriptive language file is parsed and format converted to convert the descriptive language file into a source code file.

13. The method according to claim 12, characterized in that The parsing and format conversion of the descriptive language file to convert the descriptive language file into a source code file includes: For any first control in the descriptive language file, based on the control type of the first control, format conversion is performed on the character string of the first control and the second control corresponding to the first control in the descriptive language file to obtain a character string in a second preset format The source code file is generated based on the character string in the second preset format.

14. The method according to claim 1, characterized in that After generating the descriptive language file corresponding to the target page based on the attribute information of the plurality of controls, the method further includes: Obtaining, through the target platform, a project identifier corresponding to the descriptive language file and a device version corresponding to the executable program file to be generated; An executable program file is generated based on the project identifier and the device version.

15. A page processing device, characterized in that: The device comprises: A first acquisition module, configured to acquire the hierarchical relationship between various controls in the generated target page in response to a generation operation of the target page in the page development platform; A second acquisition module, configured to acquire attribute information of the multiple controls based on the hierarchical relationship between the multiple controls in the target page, wherein the attribute information at least includes absolute position information of at least one first control as a bottom-layer control and relative position information of at least one second control as an upper-layer control; A generating module is used to generate a descriptive language file corresponding to the target page based on the attribute information of the multiple controls.

16. A computing device, characterized in that: The computing device includes a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the operations performed by the page processing method according to any one of claims 1 to 14 when executing the computer program.

17. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a program, and when the program is executed by the processor, the operations performed by the page processing method according to any one of claims 1 to 14 are implemented.

Images