CN117311692A - Automatic Qt interface and style generation method and system based on HTML file format - Google Patents

Abstract

The invention relates to the field of Qt interface application program development, in particular to a Qt interface and style automatic generation method and system based on an HTML file format, which are implemented by acquiring HTML file data and corresponding resource file data derived by interface prototype design software; analyzing the HTML file and the file association relation thereof to obtain a precompiled generation interface; analyzing the class file of the graphic element, the graphic element attribute and the logic relationship between the graphic elements in the precompiled generation interface to obtain interface graphic element list data; constructing a mapping relation between the primitive and the control type of the Qt interface to obtain primitive and control mapping relation data; and automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data. Through automatic analysis of the derived HTML format file of the prototype design software, complicated interface layout and interface style debugging are reduced, and development efficiency of Qt interface application software is greatly improved.

Description

Automatic Qt interface and style generation method and system based on HTML file format

Technical Field

The invention relates to the field of Qt interface application program development, in particular to a method and a system for automatically generating a Qt interface and a style based on an HTML file format.

Background

The Qt interface is a user interface and an interactive description scheme based on software prototype design are generally adopted in the development process of the Qt application program. The software prototype design aims at the problem of specific interface design, abstracts the software interface and the user interaction model by summarizing the design experience of the former person, and simultaneously provides related automation tools for analysis and generates a specific user interface conforming to the use style. The software developer can grasp the design of the whole user interface from a macroscopic angle, and not be limited in specific details such as control selection, design and the like, so that the interface development efficiency can be improved.

When developing Qt applications based on software interface design prototypes, qt interface layout and style debugging takes up significant time and effort in program development. Complicated interface layout and interface style debugging in the current Qt interface development process greatly influence the development efficiency of Qt interface application software, so that a method and a tool for directly generating the Qt interface and style from an intermediate file derived from prototype design software are lacked.

Disclosure of Invention

In view of the above, the invention provides a method and a system for automatically generating a Qt interface and a style based on an HTML file format, which aim to solve the technical problem of low efficiency in developing the existing Qt interface application software.

In order to solve the technical problems, the technical scheme of the invention is to provide a Qt interface and style automatic generation method based on an HTML file format, which comprises the following steps:

acquiring HTML file data derived by interface prototype design software and corresponding resource file data;

analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data thereof to obtain a precompiled generation interface;

analyzing the class file of the graphic element, the graphic element attribute and the logic relationship between the graphic elements in the precompiled generation interface to obtain interface graphic element list data;

constructing a mapping relation between the primitive and the control type of the Qt interface to obtain primitive and control mapping relation data;

and automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.

As an embodiment, the parsing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain a precompiled generation interface includes:

and generating interface file object tree data, CSS object tree data and resource file object tree data based on the HTML file data and the corresponding resource file data, and respectively analyzing the interface file object tree data, the CSS object tree data and the resource file object tree data to obtain a precompiled generation interface.

As one embodiment, generating interface file object tree data includes:

and generating an interface file object tree according to the HTML file name, wherein one HTML file corresponds to one node in the object tree, and the node name has global uniqueness in the resolved domain name.

As one embodiment, generating CSS object tree data includes:

generating CSS object tree data based on file folders in which folders corresponding to each interface name exist in the exported files, wherein each file corresponds to one node in the CSS object tree;

analyzing the style. CSS files stored in the folders corresponding to each interface name, and generating child node data of the CSS object tree node;

and calling a CSS code analyzer to read the child node data and converting the child node data into AST data, wherein the node name and the child node name have global uniqueness in the analyzed domain name.

As one embodiment, generating resource file object tree data includes:

generating resource file object tree data based on resource/images folders in the exported files, wherein each file corresponds to one node of the resource file object tree;

and obtaining a unique corresponding relation between the node name and the corresponding resource file through associating the node name with the resource file, wherein the node name has global uniqueness in the resolved domain name.

As an implementation manner, the analyzing the class file of the graphic element, the graphic element attribute, the logical relationship between the graphic element and the graphic element in the pre-compiling generation interface to obtain the interface graphic element list data further includes:

the primitive logical relationships are saved in a key-value database.

As an implementation manner, the constructing the mapping relationship between the primitive and the control type of the Qt interface to obtain the mapping relationship data between the primitive and the control includes:

assigning control type attributes of the primitives based on software function requirements, wherein the control type attributes comprise Qt controls and user-defined controls;

correcting names of the interface file object tree data, the CSS object tree data, the resource file object tree data and the graphic primitives according to software function requirements, and updating the corrected names in the key-value database;

and constructing a mapping relation between the primitives of the Qt interface and the control types of the appointed primitives to obtain control mapping relation data of the primitives and the appointed primitives.

As one embodiment, the method for automatically generating the Qt interface file includes:

traversing the key-value database which stores the graphic element logic relationship, loading a Qt interface and C++ codes to generate template resource data, and generating a Qt interface UI file and a corresponding C++ interface class file according to the control type and class name set by the software function requirement.

As one embodiment, the method for automatically generating the Qt interface style file includes:

traversing the key-value database which stores the logical relation of the primitives to obtain the names of the primitives;

searching CSS attributes and CSS attribute values of corresponding attributes in a CSS object tree according to the primitive names;

and converting the CSS attribute and the CSS attribute value into a QSS attribute and a QSS attribute value, and generating a Qt interface style QSS file.

Correspondingly, the invention also provides a Qt interface and style automatic generation system based on the HTML file format, which comprises the following steps:

the file data acquisition module is used for acquiring HTML file data and corresponding resource file data derived by the interface prototype design software;

the association relation analysis module is used for analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain a precompiled generation interface;

the primitive relation mapping module is used for analyzing the primitives, primitive attributes and logical relations among the primitives in the precompiled generation interface to obtain interface primitive list data;

the Qt interface pre-editing module is used for constructing the mapping relation between the primitives of the Qt interface and the control types to obtain the mapping relation data of the primitives and the controls;

the Qt interface file generation module is used for automatically generating a Qt interface file based on the precompiled generation interface, interface primitive list data and the primitive and control mapping relation data;

and the Qt interface style file generation module is used for automatically generating a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.

The primary improvement of the invention is that: acquiring HTML file data derived by interface prototype design software and corresponding resource file data by adopting a Qt interface and style automatic generation system based on an HTML file format; analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data thereof to obtain a precompiled generation interface; analyzing the class file of the graphic element, the graphic element attribute and the logic relationship between the graphic elements in the precompiled generation interface to obtain interface graphic element list data; constructing a mapping relation between the primitive and the control type of the Qt interface to obtain primitive and control mapping relation data; and automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data. The Qt interface file and the Qt interface style file are dynamically generated through automatic analysis of the derived HTML format file of the prototype design software, so that complicated interface layout and interface style debugging are reduced, and the development efficiency of the Qt interface application software is greatly improved.

Drawings

In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings that are needed in the description of the embodiments will be briefly described below, and it is obvious that the drawings in the following description are only some embodiments of the present application, and that other drawings may be obtained according to these drawings without inventive effort for a person skilled in the art.

FIG. 1 is a schematic diagram of steps of a Qt interface and style automatic generation method based on an HTML file format according to an embodiment of the present invention;

FIG. 2 is a diagram of a prototype design software export directory structure according to one embodiment of the present invention;

FIG. 3 is a schematic diagram illustrating an effect of parsing an HTML file according to an embodiment of the present invention;

fig. 4 is a schematic structural diagram of a Qt interface and style automatic generation system based on an HTML file format according to an embodiment of the present invention.

Detailed Description

In order that those skilled in the art will better understand the embodiments of the present invention, a technical solution in the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings in which it is apparent that the described embodiments are only some embodiments of the present invention, not all embodiments. All other embodiments, which can be made by those skilled in the art based on the embodiments of the invention without making any inventive effort, are intended to be within the scope of the invention.

Referring to fig. 1, a schematic diagram of steps of a Qt interface and a style automatic generation method based on an HTML file format according to an embodiment of the present invention is shown.

S11, acquiring HTML file data derived by the interface prototype design software and corresponding resource file data.

The HTML file data and the corresponding resource file data derived by the interface prototype design software are obtained, and mainly comprise data, files, images, plugins, resources, index. HTML, start. HTML, start_c_1.HTML, start_with_pages. HTML and HTML files of each interface, wherein the file name of each interface is set and derived by a prototype interface designer through the interface prototype design software, as shown in fig. 2.

S12, analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain a precompiled generation interface.

Further, based on the HTML file data and the corresponding resource file data, generating interface file object tree data, CSS object tree data and resource file object tree data, and respectively analyzing the interface file object tree data, the CSS object tree data and the resource file object tree data to obtain a precompiled generation interface.

Further, the generating of the interface file object tree data and the parsing thereof are specifically as follows: and generating an interface file object tree according to the HTML file name, wherein one HTML file corresponds to one node in the object, and the node name is globally unique in the resolved domain name.

Further, the generating CSS object tree data and the parsing thereof are specifically: generating CSS object tree data based on file folders in which folders corresponding to each interface name exist in the exported files, wherein each file corresponds to one node in the CSS object tree; analyzing the style. CSS files stored in the folders corresponding to each interface name, and generating child node data of the CSS object tree node; and calling a CSS code analyzer to read the child node data and converting the child node data into AST data, wherein the node name and the child node name have global uniqueness in the analyzed domain name.

It should be noted that AST (Abstract Syntax Tree ) is a data structure that can facilitate the traversal and operation of the code by the parser, and when the CSS code is read in by the parser, it is parsed by various parser rules, including CSS selector, CSS attribute, CSS value, and so on.

Further, the generating of the resource file object tree data and the parsing thereof are specifically as follows: generating resource file object tree data based on resource/images folders in the exported files, wherein each file corresponds to one node of the resource file object tree; and obtaining a unique corresponding relation between the node name and the corresponding resource file by associating the node name with the resource file, wherein the node name has global uniqueness in the resolved domain name, and various picture resource data exist in a resources/images folder in the derived file, including but not limited to bmp, jpg, png, svg format files.

S13, analyzing the class file of the graphic element, the graphic element attribute and the logic relation between the graphic elements in the precompiled generation interface to obtain interface graphic element list data.

The interface prototype type HTML file data mainly comprises a head and a body node, wherein the head mainly comprises, but is not limited to, title, meta, link, script src, script type and other attributes. The body is a carrier of the interface primitive, and the body node mainly comprises a div node. div has attributes including, but not limited to: id. class, style, data-label, data-left, data-top, data-width, data-height. The div nodes in turn contain p and span nodes. Of particular importance, div nodes are nested, i.e., N groups of div nodes can be nested in a div node. One div node corresponds to one primitive, and from the div node attribute, the nested relationship exists between the primitives, i.e. one primitive can contain N groups of primitives. The name of the primitive is the class attribute field value in the div node attribute. And analyzing the HTML to generate the graphic primitive and the graphic primitive logic relationship, and storing the graphic primitive logic relationship in a key-value database, so that the graphic primitive logic relationship is convenient to search and retrieve.

S14, constructing a mapping relation between the primitive and the control type of the Qt interface, and obtaining primitive and control mapping relation data.

Further, a control type attribute of the primitive is specified based on the software function requirement, wherein the control type attribute comprises a Qt control and a user-defined control; correcting names of the interface file object tree data, the CSS object tree data, the resource file object tree data and the graphic primitives according to software function requirements, and updating the corrected names in the key-value database; and constructing a mapping relation between the primitives of the Qt interface and the control types of the appointed primitives to obtain control mapping relation data of the primitives and the appointed primitives.

It should be noted that, the primitive data of the software design interface is mainly parsed from the interface prototype HTML file, and cannot directly establish a mapping relationship with the Qt interface control type, so that a developer needs to specify the control type attribute of the primitive according to the software function requirement. Meanwhile, in interface file object tree data, CSS object tree data, resource file object tree data and primitives which are analyzed from an interface prototype class HTML file, names are set in prototype design software by a prototype designer, naming is not standard, and the names cannot be directly exported into C++ interface class codes and Qt interface ui files. The developer is required to set the primitive aliases conforming to the C++ code specification according to the software function requirements, and the primitive aliases are mainly used for generating interface ui files and C++ class code files.

S15, automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.

Further, the method for automatically generating the Qt interface file specifically includes: traversing the key-value database which stores the graphic element logic relationship, loading a Qt interface and C++ codes to generate template resource data, and generating a Qt interface UI file and a corresponding C++ interface class file according to the control type and class name set by the software function requirement.

Further, the method for automatically generating the Qt interface style file specifically comprises the following steps: traversing the key-value database which stores the logical relation of the primitives to obtain the names of the primitives; searching CSS attributes and CSS attribute values of corresponding attributes in a CSS object tree according to the primitive names; and converting the CSS attribute and the CSS attribute value into a QSS attribute and a QSS attribute value, and generating a Qt interface style QSS file. The file name is a name set in the Qt interface preprocess module by a developer. An effect diagram after the HTML file analysis shown in fig. 3 is obtained.

The embodiment provides a Qt interface and style automatic generation method based on an HTML file format, which is implemented by acquiring HTML file data and corresponding resource file data derived by interface prototype design software; analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data thereof to obtain a precompiled generation interface; analyzing the class file of the graphic element, the graphic element attribute and the logic relationship between the graphic elements in the precompiled generation interface to obtain interface graphic element list data; constructing a mapping relation between the primitive and the control type of the Qt interface to obtain primitive and control mapping relation data; and automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data. The Qt interface file and the Qt interface style file are dynamically generated through automatic analysis of the derived HTML format file of the prototype design software, so that complicated interface layout and interface style debugging are reduced, and the development efficiency of the Qt interface application software is greatly improved.

Correspondingly, as shown in fig. 4, an embodiment of the present invention further provides a structural schematic diagram of a Qt interface and style automatic generation system based on an HTML file format, including:

the file data acquisition module is used for acquiring HTML file data and corresponding resource file data derived by the interface prototype design software;

the association relation analysis module is used for analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain a precompiled generation interface;

the primitive relation mapping module is used for analyzing the primitives, primitive attributes and logical relations among the primitives in the precompiled generation interface to obtain interface primitive list data;

the Qt interface pre-editing module is used for constructing the mapping relation between the primitives of the Qt interface and the control types to obtain the mapping relation data of the primitives and the controls;

the Qt interface file generation module is used for automatically generating a Qt interface file based on the precompiled generation interface, interface primitive list data and the primitive and control mapping relation data;

and the Qt interface style file generation module is used for automatically generating a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.

The Qt interface and the style automatic generation method and the system based on the HTML file format provided by the embodiment of the invention. In the description, each embodiment is described in a progressive manner, and each embodiment is mainly described by the differences from other embodiments, so that the same similar parts among the embodiments are mutually referred. For the device disclosed in the embodiment, since it corresponds to the method disclosed in the embodiment, the description is relatively simple, and the relevant points refer to the description of the method section. It should be noted that it will be apparent to those skilled in the art that various modifications and adaptations of the invention can be made without departing from the principles of the invention and these modifications and adaptations are intended to be within the scope of the invention as defined in the following claims.

Those of skill would further appreciate that the various illustrative elements and algorithm steps described in connection with the embodiments disclosed herein may be implemented as electronic hardware, computer software, or combinations of both, and that the various illustrative elements and steps are described above generally in terms of functionality in order to clearly illustrate the interchangeability of hardware and software. Whether such functionality is implemented as hardware or software depends upon the particular application and design constraints imposed on the solution. Skilled artisans may implement the described functionality in varying ways for each particular application, but such implementation decisions should not be interpreted as causing a departure from the scope of the present invention. The steps of a method or algorithm described in connection with the embodiments disclosed herein may be embodied directly in hardware, in a software module executed by a processor, or in a combination of the two. The software modules may be disposed in Random Access Memory (RAM), memory, read Only Memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, a removable disk, a CD-ROM, or any other form of storage medium known in the art.

Claims (10)

1. A Qt interface and style automatic generation method based on an HTML file format is characterized by comprising the following steps:

acquiring HTML file data derived by interface prototype design software and corresponding resource file data;

analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data thereof to obtain a precompiled generation interface;

analyzing the class file of the graphic element, the graphic element attribute and the logic relationship between the graphic elements in the precompiled generation interface to obtain interface graphic element list data;

constructing a mapping relation between the primitive and the control type of the Qt interface to obtain primitive and control mapping relation data;

and automatically generating a Qt interface file and a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.

2. The automatic Qt interface and style generation method based on the HTML file format according to claim 1, wherein the parsing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain the precompiled generation interface includes:

and generating interface file object tree data, CSS object tree data and resource file object tree data based on the HTML file data and the corresponding resource file data, and respectively analyzing the interface file object tree data, the CSS object tree data and the resource file object tree data to obtain a precompiled generation interface.

3. The automatic Qt interface and style generation method based on the HTML file format of claim 2, wherein generating the interface file object tree data includes:

and generating an interface file object tree according to the HTML file name, wherein one HTML file corresponds to one node in the object tree, and the node name has global uniqueness in the resolved domain name.

4. The automatic Qt interface and style generation method based on the HTML file format of claim 2, wherein generating CSS object tree data includes:

generating CSS object tree data based on file folders in which folders corresponding to each interface name exist in the exported files, wherein each file corresponds to one node in the CSS object tree;

analyzing the style. CSS files stored in the folders corresponding to each interface name, and generating child node data of the CSS object tree node;

and calling a CSS code analyzer to read the child node data and converting the child node data into AST data, wherein the node name and the child node name have global uniqueness in the analyzed domain name.

5. The automatic Qt interface and style generation method based on the HTML file format of claim 2, wherein generating the resource file object tree data includes:

generating resource file object tree data based on resource/images folders in the exported files, wherein each file corresponds to one node of the resource file object tree;

and obtaining a unique corresponding relation between the node name and the corresponding resource file through associating the node name with the resource file, wherein the node name has global uniqueness in the resolved domain name.

6. The automatic generating method of Qt interface and style based on HTML file format according to claim 1, wherein the analyzing the class file of the graphic element, the graphic element attribute, the logical relationship between graphic elements in the precompiled generating interface, and obtaining the interface graphic element list data further comprises:

the primitive logical relationships are saved in a key-value database.

7. The method for automatically generating the Qt interface and the style based on the HTML file format according to claims 3 to 6, wherein the constructing the mapping relation between the primitive and the control type of the Qt interface to obtain the mapping relation data between the primitive and the control includes:

assigning control type attributes of the primitives based on software function requirements, wherein the control type attributes comprise Qt controls and user-defined controls;

correcting names of the interface file object tree data, the CSS object tree data, the resource file object tree data and the graphic primitives according to software function requirements, and updating the corrected names in the key-value database;

and constructing a mapping relation between the primitives of the Qt interface and the control types of the appointed primitives to obtain control mapping relation data of the primitives and the appointed primitives.

8. The automatic Qt interface and style generation method based on the HTML file format of claim 7, wherein the method for automatically generating the Qt interface file includes:

traversing the key-value database which stores the graphic element logic relationship, loading a Qt interface and C++ codes to generate template resource data, and generating a Qt interface UI file and a corresponding C++ interface class file according to the control type and class name set by the software function requirement.

9. The automatic Qt interface and style generation method based on the HTML file format of claim 7, wherein the method for automatically generating the Qt interface style file includes:

traversing the key-value database which stores the logical relation of the primitives to obtain the names of the primitives;

searching CSS attributes and CSS attribute values of corresponding attributes in a CSS object tree according to the primitive names;

and converting the CSS attribute and the CSS attribute value into a QSS attribute and a QSS attribute value, and generating a Qt interface style QSS file.

10. The Qt interface and style automatic generation system based on the HTML file format is characterized by comprising:

the file data acquisition module is used for acquiring HTML file data and corresponding resource file data derived by the interface prototype design software;

the association relation analysis module is used for analyzing the HTML file and the file association relation thereof based on the HTML file data and the corresponding resource file data to obtain a precompiled generation interface;

the primitive relation mapping module is used for analyzing the primitives, primitive attributes and logical relations among the primitives in the precompiled generation interface to obtain interface primitive list data;

the Qt interface pre-editing module is used for constructing the mapping relation between the primitives of the Qt interface and the control types to obtain the mapping relation data of the primitives and the controls;

the Qt interface file generation module is used for automatically generating a Qt interface file based on the precompiled generation interface, interface primitive list data and the primitive and control mapping relation data;

and the Qt interface style file generation module is used for automatically generating a Qt interface style file based on the precompiled generation interface, the interface primitive list data and the primitive and control mapping relation data.