An application generation method, apparatus, electronic device, and storage medium

By automatically generating interface configuration data and interactive data, combined with application classifier matching basic code templates, the intelligent terminal application development process is simplified and efficient multiple use and iterative updates are achieved.

CN114327432BActive Publication Date: 2025-07-18FUTURE TV CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202111680646.5
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2021-12-27
Publication Date
2025-07-18
Estimated Expiration
2041-12-27

AI Technical Summary

Technical Problem

The existing smart terminal application development process is complex and time-consuming, especially due to the diversified development framework and the consideration of different application needs, which leads to inefficient development.

Method used

By obtaining interface design diagrams, interface configuration data and interaction data are automatically generated, and the application classifier is used to match the basic code templates, generate application code and optimize the development process.

Benefits of technology

The application development process is simplified, multiple uses of one development, iterative updates are realized, and duplicate processes such as labeling data and cutting graph sizes are avoided, which improves development efficiency.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN114327432B_ABST
    Figure CN114327432B_ABST
Patent Text Reader

Abstract

The present application provides an application generation method, apparatus, electronic device, and storage medium. The method includes: obtaining an interface design diagram; generating interface configuration data according to the interface design diagram, and generating an application page corresponding to the interface design diagram according to the interface configuration data; corresponding and matching the interaction data of the application page with the interface configuration data to obtain page configuration information; through an application classifier, calling basic code according to the interface design diagram, and modifying configuration parameters in the basic code according to the page configuration information to obtain application code; and generating an application deployment file according to the application code; wherein the application deployment file is used to generate an application. Automatically generating an application page according to the interface design diagram, integrating, storing, and processing interface configuration data, interaction data, etc., providing basic code templates for different classification applications, and being able to expand the application template library and basic code templates, optimizing and simplifying the application development process.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of application development. Specifically, it relates to an application generation method, apparatus, electronic device, and storage medium. Background Art

[0002] With the popularization of intelligent devices, application programs on intelligent terminals have become increasingly important, and their usage scenarios have become more and more extensive. Currently, common intelligent terminal applications include native applications, web applications, and hybrid applications, etc., which mostly rely on the technical features of HTML5 to implement functions such as application program update and debugging. However, due to the variety of development frameworks and the need for developers to consider the requirements of different application developments when developing applications, the application development process is relatively complex and time-consuming. Summary of the Invention

[0003] An object of embodiments of the present invention is to provide an application development method, apparatus, electronic device, and storage medium. By obtaining the design effect diagram and the original material diagram in the interface design diagram, an application page corresponding to the interface design diagram is generated through image matching, text matching, and style matching; the interaction data of the application page is manually edited and corresponding matched with the interface configuration data, and the interaction data and the interface configuration data are stored in a database to generate an interface for application call; and an application classifier is used to match the closest application template in the application template library according to the design effect diagram, modify the basic code in the application template according to the page configuration information to obtain application code, and generate an application according to the application code. Obtaining the design effect diagram and the original material diagram to automatically generate an application page, integrating, storing, and processing interface configuration data, interaction data, etc. Different classification applications provide basic code templates, which can be developed once, used multiple times, iteratively updated, and the application template library and the basic code template can be extended. An application is generated according to the application code.

[0004] In a first aspect, an embodiment of the present application provides an application generation method, including: obtaining an interface design diagram; generating interface configuration data according to the interface design diagram, and generating an application page corresponding to the interface design diagram according to the interface configuration data; corresponding and matching the interaction data of the application page with the interface configuration data to obtain page configuration information; through an application classifier, calling basic code according to the interface design diagram, and modifying configuration parameters in the basic code according to the page configuration information to obtain application code; and generating an application deployment file according to the application code; wherein, the application deployment file is used to generate an application.

[0005] In the above implementation process, obtaining the design effect diagram and the original material diagram to automatically generate a page, integrating, storing, and processing interface configuration data, interaction data, etc. By providing a basic code template through an application classifier, it can be developed once, used multiple times, iteratively updated, and the application template library and the basic code template can be extended. An application is generated according to the application code. Without considering the interface design tool, the application development process is optimized and simplified.

[0006] Optionally, in the embodiments of the present application, the interface configuration data includes: picture position information, text position information, and style information; generating interface configuration data according to the interface design drawing includes: generating picture position information according to the picture information of the interface design drawing; generating text position information according to the text information of the interface design drawing; and matching style information according to the interface design drawing. In the above implementation process, by inputting the interface design drawing, an application page is automatically generated according to the picture position information, text position information, and matching style in the interface configuration data of the interface design drawing, without considering the interface design tool, which simplifies the process of generating the page.

[0007] Optionally, in the embodiments of the present application, after generating interface configuration data according to the interface design drawing and generating an application page corresponding to the interface design drawing according to the interface configuration data, the method further includes: by previewing the application page, matching and verifying the picture of the application page with the interface design drawing to obtain a matching verification result, and adjusting the interface configuration data according to the matching verification result.

[0008] In the above implementation process, by comparing the generated application page with the original drawing of the interface design drawing, a proofreading result is generated, and the differences between the application page and the interface design drawing are adjusted until the application page and the interface design drawing reach an ideal matching degree, then the adjustment is completed. By visually adjusting the application page, it is possible to avoid repeated processes such as annotation data and cut map sizes in application development, and the adjustment of the application page is more rapid and simplified.

[0009] Optionally, in the embodiments of the present application, the interface design drawing includes a design effect drawing and an original material drawing; adjusting the interface configuration data according to the matching verification result includes: adjusting the position of the original material drawing of the picture of the application page and the hierarchical relationship in the interface design drawing according to the matching verification result.

[0010] In the above implementation process, the obtained interface design drawing includes a design effect drawing and an original material drawing. By comparing the generated application page with the original drawing of the interface design drawing, a proofreading result is generated, and the differences between the application page and the interface design drawing are adjusted until the application page and the interface design drawing reach an ideal matching degree, then the adjustment is completed.

[0011] Optionally, in the embodiments of the present application, matching the interaction data of the application page with the interface configuration data to obtain page configuration information includes: matching the interaction elements in the application page with corresponding interaction actions to obtain interaction data; and processing the interaction data and matching it with the corresponding interface configuration data.

[0012] In the above implementation process, by previewing and editing the application page online, the interaction elements and interaction actions are bound to obtain interaction data; the interaction data is formatted and bound and matched with the corresponding interface configuration data to achieve interactive association between multiple pages, thereby realizing the switching between pages.

[0013] Optionally, in the embodiment of the present application, wherein, through an application classifier, the basic code is called according to the interface design drawing, and the configuration parameters in the basic code are modified according to the page configuration information to obtain the application code, including: through the application classifier, matching the corresponding application type among multiple application types according to the interface design drawing, and obtaining the basic code of the matching application type; modifying the configuration parameters in the basic code of the matching application type according to the page configuration information to obtain the application code corresponding to the interface design drawing.

[0014] In the above implementation process, the application classifier matches the closest application template in the application template library according to the design effect drawing, modifies the basic code in the application template according to the page configuration information to obtain the application code, and generates an application according to the application code. Different classification applications provide basic code templates, which can be developed once, used multiple times, iteratively updated, and the application template library and basic code templates can be extended. Using application templates avoids situations such as different code qualities of different developers and uncontrollable terminal transplantation processes.

[0015] Optionally, in the embodiment of the present application, wherein generating an application deployment file according to the application code includes: compiling and packaging the application code according to the application type to generate an application deployment file; wherein, the application deployment file includes an installation package and a remote deployment file, the installation package is used to generate an application by downloading, and the remote deployment file is used to deploy the application on a remote server. In the above implementation process, the system automatically generates an application installation package or a remote deployment file. The installation package is used to generate an application by downloading, and the remote deployment file is used to deploy the application on a remote server, adapting to various requirements.

[0016] Optionally, in the embodiment of the present application, the page configuration information is stored in the database, and a data interface is generated according to the page configuration information, and the interface is used for the application to call.

[0017] Second aspect, embodiments of the present application further provide an application generation device, including: an acquisition module for acquiring an interface design diagram; a page generation module for generating interface configuration data according to the interface design diagram and generating an application page corresponding to the interface design diagram according to the interface configuration data; a data processing module for correspondingly matching the interaction data of the application page with the interface configuration data to obtain page configuration information; an application classification module for calling basic code according to the interface design diagram through an application classifier and modifying configuration parameters in the basic code according to the page configuration information to obtain application code; and an application generation module for generating an application deployment file according to the application code; wherein, the application deployment file is used to generate an application.

[0018] Optionally, in embodiments of the present application, the interface configuration data includes: picture position information, text position information, and style information; the page generation module is further configured to generate picture position information according to the picture information of the interface design diagram; generate text position information according to the text information of the interface design diagram; and match style information according to the interface design diagram.

[0019] Optionally, in embodiments of the present application, the application generation device further includes an adjustment module for, by previewing the application page, matching and verifying the picture of the application page with the interface design diagram and adjusting the picture of the application page according to the interface design diagram.

[0020] Optionally, in embodiments of the present application, the interface design diagram includes a design effect diagram and an original material diagram; the adjustment module is further configured to adjust the original material diagram of the picture of the application page according to the design effect diagram.

[0021] Optionally, in embodiments of the present application, the data processing module is further configured to match corresponding interaction actions for the interaction elements in the application page to obtain interaction data; and process the interaction data and match it with the corresponding interface configuration data.

[0022] Optionally, in embodiments of the present application, the application classification module is further configured to, through an application classifier, match a corresponding application type among multiple application types according to the interface design diagram, obtain the basic code of the matched application type; and modify the configuration parameters in the basic code of the matched application type according to the page configuration information to obtain the application code corresponding to the interface design diagram.

[0023] Optionally, in embodiments of the present application, the application generation module is further configured to compile and package the application code according to the application type to generate an application deployment file; wherein, the application deployment file includes an installation package and a remote deployment file, the installation package is used to generate an application through download, and the remote deployment file is used to deploy the application on a remote server.

[0024] In a third aspect, an embodiment of the present application further provides an electronic device, including: a processor and a memory, where the memory stores machine-readable instructions executable by the processor, and when the machine-readable instructions are executed by the processor, the methods described above are executed.

[0025] In a fourth aspect, an embodiment of the present application further provides a computer-readable storage medium, on which a computer program is stored, and when the computer program is run by a processor, the methods described above are executed.

[0026] By using the application generation method, device, electronic device, and storage medium provided by the present application, a page is automatically generated by obtaining a design effect diagram and an original material diagram, and interface configuration data, interaction data, etc. are integrated, stored, and processed. A basic code template is provided through an application classifier, which can be developed once, used multiple times, iteratively updated, and the application template library and the basic code template can be extended. An application is generated according to the application code. There is no need to consider the interface design tool, which optimizes and simplifies the application development process. BRIEF DESCRIPTION OF THE DRAWINGS

[0027] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings required to be used in the embodiments of the present application will be briefly introduced below. It should be understood that the following drawings only show some embodiments of the present application, and therefore should not be regarded as limiting the scope. For those of ordinary skill in the art, other related drawings can be obtained based on these drawings without creative efforts.

[0028] Figure 1 It is a schematic flowchart of an application generation method provided by an embodiment of the present application;

[0029] Figure 2 It is a schematic flowchart of an application generation method provided by the first embodiment of the present application;

[0030] Figure 3 It is a schematic flowchart of processing an interface design diagram provided by an embodiment of the present application;

[0031] Figure 4 It is a schematic structural diagram of an application generation device provided by an embodiment of the present application;

[0032] Figure 5 It is a schematic structural diagram of an electronic device provided by an embodiment of the present application. DETAILED DESCRIPTION OF THE EMBODIMENTS

[0033] The embodiments of the technical solutions of the present application will be described in detail below with reference to the drawings. The following embodiments are only used to more clearly illustrate the technical solutions of the present application, and therefore are only examples and cannot be used to limit the protection scope of the present application.

[0034] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the technical field to which this application belongs; the terms used herein are for the purpose of describing specific embodiments only and are not intended to limit this application.

[0035] In the description of the embodiments of this application, technical terms such as "first" and "second" are only used to distinguish different objects and cannot be understood as indicating or implying relative importance or implicitly specifying the quantity, specific order or primary-secondary relationship of the indicated technical features. In the description of the embodiments of this application, "a plurality" means more than two unless otherwise specifically defined.

[0036] Please refer to Figure 1 the flowchart showing a method for generating an application provided by an embodiment of this application.

[0037] Step S110: Obtain an interface design diagram.

[0038] The implementation manner of the above step S110 includes: a user uploads an interface design diagram, and the interface design diagram includes the overall design of the human-computer interaction, operation logic, and interface aesthetics of the software. The interface design diagram can be a high-fidelity rendering diagram, specifically, it can be a static picture made using the PS software. Among them, the interface design diagram includes a design effect diagram and an original material diagram.

[0039] After step S110, execute step S120: Generate interface configuration data according to the interface design diagram, and generate an application page corresponding to the interface design diagram according to the interface configuration data.

[0040] The implementation manner of the above step S120 includes: performing image processing on the interface design diagram to generate interface configuration data, and the image processing includes: image matching, text matching, and style matching. The interface configuration data includes image position information, text position information, and style information. Generate interface configuration data through image processing and automatically generate an application page corresponding to the interface design diagram, where the application page can be an HTML5 page.

[0041] After step S120, execute step S130: Correspondingly match the interaction data of the application page with the interface configuration data to obtain page configuration information.

[0042] The implementation manner of the above step S130 includes: corresponding and matching the interaction data of the application page with the interface configuration data. The interaction data includes interaction action data and interface data. Corresponding and matching the interaction action data and the interface data with the interface configuration data of the current application page to obtain page configuration information. Specifically, the user previews the application page online, edits the application page online, binds and edits the interaction elements and interaction actions in the application page to obtain interaction action data; then edits the application page online, binds and edits the interface data for the dynamic data in the application page to obtain interface data, formats the interaction action data and the interface data and binds them to the interface configuration data of the current application page to obtain page configuration information.

[0043] After step S130, step S140 is executed: through an application classifier, call the basic code according to the interface design diagram, and modify the configuration parameters in the basic code according to the page configuration information to obtain application code.

[0044] The implementation manner of the above step S140 includes: through the application template library provided by the application classifier, match the closest application template in the application template library according to the interface design diagram. Each application template has corresponding basic code; call the basic code in the matched closest application template; modify the configuration parameters in the basic code according to the page configuration information to obtain application code.

[0045] After step S140, step S150 is executed: generate an application deployment file according to the application code; wherein, the application deployment file is used to generate an application.

[0046] The implementation manner of the above step S150 includes: compiling and packaging the application code to generate an application installation package for downloading to generate an application, or compiling the application code into a remote deployment file of the server for remote deployment of the application.

[0047] In the above implementation process, obtain the design effect diagram and the original material diagram to automatically generate a page, fuse, store and process interface configuration data, interaction data, etc. Provide a basic code template through the application classifier, which can be developed once, used multiple times, iteratively updated, and the application template library and the basic code template can be extended. Generate an application according to the application code. There is no need to consider the interface design tool, which optimizes and simplifies the application development process.

[0048] Optionally, in the embodiment of the present application, the interface configuration data includes: picture position information, text position information, and style information; generating interface configuration data according to the interface design diagram includes: generating picture position information according to the picture information of the interface design diagram; generating text position information according to the text information of the interface design diagram; matching style information according to the interface design diagram.

[0049] Embodiments of the above steps are as follows: The user inputs an interface design drawing including a design effect drawing and an original material drawing, and the position information of the original material drawing is generated by matching the original material drawing; the text information in the interface design drawing is recognized by an OCR library for text recognition, and the text position information is generated; the interface design drawing generates style information through a style matching library. In a preferred embodiment, css styles (cascading style sheets) can be generated through an HTML5 style matching library.

[0050] In the above implementation process, by inputting the interface design drawing, an application page is automatically generated according to the picture position information, text position information, and matching styles in the interface configuration data of the interface design drawing, without considering the interface design tool, simplifying the process of generating the page.

[0051] Optionally, in the embodiment of the present application, after generating the interface configuration data according to the interface design drawing and generating the application page corresponding to the interface design drawing according to the interface configuration data, the method further includes: previewing the application page, matching and verifying the picture of the application page with the interface design drawing to obtain a matching verification result, and adjusting the interface configuration data according to the matching verification result.

[0052] Embodiments of the above steps are as follows: By previewing the generated application page, the picture of the application page and the interface design drawing are matched and verified to obtain a matching verification result, and the configuration parameters of the interface design drawing are adjusted according to the matching verification result. Specifically, after generating multiple application pages, each application page is previewed online. Multiple screenshots of the application pages can be obtained by taking screenshots of each application page, and the screenshots of the multiple application pages are compared with the corresponding interface design drawings one by one. The configuration parameters of the interface design drawing are adjusted according to the matching verification of the interface design drawing and the corresponding application page.

[0053] In the above implementation process, by comparing the generated application page with the original drawing of the interface design drawing, a matching verification result is generated, and the differences between the application page and the interface design drawing are adjusted until the application page and the interface design drawing reach an ideal matching degree, then the adjustment is completed. By visually adjusting the application page, it is possible to avoid repeated processes such as annotation data and cut image sizes in application development, and the adjustment of the application page is more rapid and simplified.

[0054] Optionally, in the embodiment of the present application, the interface design drawing includes a design effect drawing and an original material drawing; adjusting the interface configuration data according to the matching verification result includes: adjusting the position of the original material drawing in the picture of the application page and the hierarchical relationship in the interface design drawing according to the matching verification result.

[0055] Embodiments of the above steps are as follows: The interface design diagram includes a design effect diagram and an original material diagram. By comparing the generated application page with the original diagram of the interface design diagram, a matching verification result is generated. The matching verification result includes the screen matching degree between the interface design diagram and the corresponding application page, and the hierarchical relationship matching degree of the interface design diagram. According to the matching verification result, the local position of the original material diagram of the screen of the application page is adjusted, and the hierarchical relationship in the interface design diagram is adjusted according to the matching verification result to make the matching verification result reach an ideal matching degree.

[0056] In the above implementation process, the obtained interface design diagram includes a design effect diagram and an original material diagram. By comparing the generated application page with the original diagram of the interface design diagram, a proofreading result is generated, and the differences between the application page and the interface design diagram are adjusted until the application page and the interface design diagram reach an ideal matching degree, then the adjustment is completed.

[0057] Optionally, in the embodiments of the present application, the interaction data of the application page is correspondingly matched with the interface configuration data to obtain page configuration information, including: matching the interaction elements in the application page with corresponding interaction actions to obtain interaction data; and processing the interaction data and matching it with the corresponding interface configuration data.

[0058] Embodiments of the above steps are as follows: Through manual editing, the interaction elements are bound and edited with interaction actions, that is, the components used to jump to other pages in the application page are bound with interaction actions to obtain interaction data. The interaction data includes interaction settings. The interaction settings are formatted and bound with the interface configuration data of the current application page. Specifically, select the components of the application page, add interaction parameters, select the application page to be jumped to, add jump parameters and the animation effect between jumps, and save the above settings, that is, complete the matching of the interaction data with the corresponding interface configuration data.

[0059] It is also possible to add the return route of the page by online editing the application page. First, select the current application page, modify the return route information of the current application page, select the target application page to be returned to, add jump parameters and the animation effect between jumps, and save the settings to complete the return setting of the page.

[0060] It should be noted that after the interaction data and the interface configuration data are correspondingly matched, that is, after the interaction action data and the interface data are formatted and bound with the interface configuration data of the current application page, page configuration information is obtained. The page configuration information and the interface configuration data are stored in the database, and a data interface is automatically generated. The data interface is used for application calls, and the data interface can be a restfull interface.

[0061] In the above implementation process, by online previewing and editing the application page, the interactive elements and interactive actions are bound to obtain interactive data; the interactive data is formatted and bound and matched with the corresponding interface configuration data to achieve interactive association among multiple pages, thereby realizing the switching between pages.

[0062] Optionally, in the embodiment of the present application, wherein, through an application classifier, the basic code is called according to the interface design drawing, and the configuration parameters in the basic code are modified according to the page configuration information to obtain the application code, including: through the application classifier, the corresponding application type is matched among multiple application types according to the interface design drawing, and the basic code of the matched application type is obtained; the configuration parameters in the basic code of the matched application type are modified according to the page configuration information to obtain the application code corresponding to the interface design drawing.

[0063] The implementation manner of the above steps is, for example: through a preset application template library, application classification data is provided for the application classifier, wherein the application template library includes application templates of multiple application types, and the application classification data includes application template data of each application type; according to the interface design drawing and the application template data of each application type, the application type closest to the interface design drawing is matched in the application template library, and the application template data of the application type is obtained and called, and the application template data includes the basic code; the configuration parameters in the basic code of the matched application type are modified according to the page configuration information to obtain the application code corresponding to the interface design drawing.

[0064] In a preferred embodiment, the application templates corresponding to the application types in the preset application template library, and the basic codes in each template, can be extended according to actual needs, and the supported application types can be conveniently increased according to actual needs.

[0065] In the above implementation process, through the application classifier, the application template closest to the design effect drawing is matched in the application template library, the basic code in the application template is modified according to the page configuration information to obtain the application code, and the application is generated according to the application code. Different classification applications provide basic code templates, which can be developed once, used multiple times, iteratively updated, and the application template library and the basic code template can be extended. Using the application template can avoid situations such as different code qualities of different developers and uncontrollable terminal transplantation processes.

[0066] Optionally, in the embodiment of the present application, wherein, generating an application deployment file according to the application code includes: compiling and packaging the application code according to the application type to generate an application deployment file; wherein, the application deployment file includes an installation package and a remote deployment file, the installation package is used to generate the application by downloading, and the remote deployment file is used to deploy the application on the remote server.

[0067] Embodiments of the above steps are as follows: The system automatically generates an application installation package or a remote deployment file. The installation package is used to generate an application through downloading, and the remote deployment file is used to deploy the application on a remote server, adapting to various requirements.

[0068] Please refer to Figure 2 the flowchart of the application generation method provided by the first embodiment of the present application shown in

[0069] As Figure 2 shown, obtain an interface design diagram, which includes a design effect diagram and an original material diagram. According to the interface design diagram, match the original materials through a picture pattern library to generate picture position information; for the text information in the interface design diagram, perform text recognition through an OCR library for text recognition and generate text position information; the interface design diagram generates css style information through an H5 style matching library, and automatically generates an application page according to the picture position information, text position information, and matching style in the interface configuration data of the interface design diagram.

[0070] Edit the application page through online preview and store the interface configuration data; match the interaction data of the application page with the interface configuration data to obtain page configuration information. For example, click on a component of the application page to specify jumping to a target application page. Store the page configuration information and the interface configuration data in a database.

[0071] In a preferred embodiment, through online editing, perform interface data binding editing on the dynamic data in the page, format the interface settings, and match them with the interface configuration data of the current application page. Specifically, select a component of the page, add the interface data to be bound, input the business interface address, the system automatically requests and displays the returned application page interface information, compare the information with a preset standard interface data format, display the corresponding relationship of the interface data fields, and the user manually adjusts the corresponding relationship according to the displayed corresponding relationship of the interface data fields to complete the formatting of the interface settings and match them with the interface configuration data of the current application page.

[0072] Pass the generated application page through an application classifier to match the corresponding application type according to the interface design diagram, call the preset basic code corresponding to the application type, modify the configuration parameters in the basic code of the matched application type according to the page configuration information, and obtain the application code corresponding to the interface design diagram; then compile and package the application code according to the application type to generate an application deployment file, where the application deployment file includes an installation package and a remote deployment file. The installation package is used to generate an application through downloading, and the remote deployment file is used to deploy the application on a remote server.

[0073] Please refer to Figure 3 the flowchart of processing the interface design diagram provided by the embodiment of the present application shown in

[0074] As Figure 3 shown, obtain the interface design drawing, which includes the design effect drawing and the original material drawing. According to the interface design drawing, match the original materials through the picture mode library to generate picture position information; for the text information in the interface design drawing, perform text recognition through the OCR library for text recognition and generate text position information; the interface design drawing generates CSS style information through the H5 style matching library, and automatically generates an initial H5 application page according to the picture position information, text position information, and matching style in the interface configuration data of the interface design drawing.

[0075] For the H5 application page generated through preview, take a screenshot of the screen of the H5 application page and compare it with the design effect drawing in the interface design drawing. According to the local differences after comparison, adjust the positions of local text and pictures. After that, the corrected application page can be screenshot again and compared with the design effect drawing of the interface design drawing until the comparison result reaches an ideal matching degree, generating the final H5 application page and the page data of this application page.

[0076] Please refer to Figure 4 the structural schematic diagram of the application generation device provided by the embodiment of the present application shown; the embodiment of the present application provides an application generation device 200, including:

[0077] An acquisition module 210, configured to acquire an interface design drawing;

[0078] A page generation module 220, configured to generate interface configuration data according to the interface design drawing, and generate an application page corresponding to the interface design drawing according to the interface configuration data;

[0079] A data processing module 230, configured to correspondingly match the interaction data of the application page with the interface configuration data to obtain page configuration information;

[0080] An application classification module 240, configured to call basic code according to the interface design drawing through an application classifier, and modify the configuration parameters in the basic code according to the page configuration information to obtain application code; and

[0081] An application generation module 250, configured to generate an application deployment file according to the application code; wherein, the application deployment file is used to generate an application.

[0082] It should be understood that this device corresponds to the above-mentioned application generation method embodiment and can execute each step involved in the above method embodiment. The specific functions of this device can be referred to the above description. To avoid repetition, the detailed description is appropriately omitted here. This device includes at least one software function module that can be stored in a memory in the form of software or firmware or solidified in the operating system (OS) of the device.

[0083] Please refer to Figure 5 the schematic structural diagram of the electronic device provided by the embodiment of the present application shown. An electronic device 300 provided by an embodiment of the present application includes: a processor 310 and a memory 320. The memory 320 stores machine-readable instructions executable by the processor 310. When the machine-readable instructions are executed by the processor 310, the above method is executed.

[0084] An embodiment of the present application also provides a storage medium. A computer program is stored on the storage medium. When the computer program is run by a processor, the above method is executed.

[0085] Among them, the storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (Static Random Access Memory, abbreviated as SRAM), electrically erasable programmable read-only memory (Electrically Erasable Programmable Read-Only Memory, abbreviated as EEPROM), erasable programmable read-only memory (Erasable Programmable Read Only Memory, abbreviated as EPROM), programmable read-only memory (Programmable Red-Only Memory, abbreviated as PROM), read-only memory (Read-OnlyMemory, abbreviated as ROM), magnetic memory, flash memory, magnetic disk or optical disk.

[0086] In several embodiments provided by the embodiments of the present application, it should be understood that the disclosed devices and methods can also be implemented in other ways. The device embodiments described above are merely illustrative. For example, the flowcharts and block diagrams in the drawings show the possible architectures, functions, and operations of the devices, methods, and computer program products according to multiple embodiments of the present application. In this regard, each block in the flowchart or block diagram may represent a module, a program segment, or a part of code. A module, a program segment, or a part of code contains one or more executable instructions for implementing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the blocks may occur in a different order than marked in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in the reverse order, depending on the functions involved. It should also be noted that each block in the block diagram and / or flowchart, as well as the combination of blocks in the block diagram and / or flowchart, can be implemented by a dedicated hardware-based system for performing the specified functions or actions, or can be implemented by a combination of dedicated hardware and computer instructions.

[0087] In addition, each functional module in the embodiments of the present application may be integrated together to form an independent part, or each module may exist alone, or two or more modules may be integrated to form an independent part.

[0088] The above description is only an optional implementation manner of the embodiments of the present application, but the protection scope of the embodiments of the present application is not limited thereto. Any person skilled in the art within the technical scope disclosed by the embodiments of the present application can easily think of changes or substitutions, which should all be covered within the protection scope of the embodiments of the present application.

Claims

1. A method for generating an application, characterized in that, Including: Obtaining an interface design diagram; Generating interface configuration data according to the interface design diagram, and generating an application page corresponding to the interface design diagram according to the interface configuration data; Correspondingly matching the interaction data of the application page with the interface configuration data to obtain page configuration information; Through an application classifier, calling basic code according to the interface design diagram, and modifying configuration parameters in the basic code according to the page configuration information to obtain application code; And Generating an application deployment file according to the application code; wherein, the application deployment file is used to generate an application; Wherein, the step of through an application classifier, calling basic code according to the interface design diagram, and modifying configuration parameters in the basic code according to the page configuration information to obtain application code includes: Providing application classification data for the application classifier through a preset application template library, wherein the application template library includes application templates of multiple application types, and the application classification data includes application template data of each application type; Through the application classifier, matching a corresponding application type among multiple application types in the application template library according to the interface design diagram, and obtaining application template data of the matching application type, the application template data including basic code; Modifying configuration parameters in the basic code of the matching application type according to the page configuration information to obtain application code corresponding to the interface design diagram.

2. The method according to claim 1, wherein Wherein, The interface configuration data includes: picture position information, text position information, and style information; the step of generating interface configuration data according to the interface design diagram includes: Generating picture position information according to the picture information of the interface design diagram; generating text position information according to the text information of the interface design diagram; matching style information according to the interface design diagram.

3. The method according to claim 1, wherein After generating the interface configuration data according to the interface design diagram and generating an application page corresponding to the interface design diagram according to the interface configuration data, the method further includes: By previewing the application page, matching and verifying the screen of the application page with the interface design diagram to obtain a matching verification result, and adjusting the interface configuration data according to the matching verification result.

4. The method according to claim 3, wherein Wherein, The interface design diagram includes a design effect diagram and an original material diagram; the step of adjusting the interface configuration data according to the matching verification result includes: Adjusting the position of the original material diagram of the screen of the application page and the hierarchical relationship in the interface design diagram according to the matching verification result.

5. The method according to claim 1, characterized in that, Wherein, The step of correspondingly matching the interaction data of the application page with the interface configuration data to obtain page configuration information includes: Matching corresponding interaction actions for interaction elements in the application page to obtain interaction data; and Processing the interaction data and matching it with the corresponding interface configuration data.

6. The method according to claim 1, characterized in that, Wherein, The step of generating an application deployment file according to the application code includes: Compiling and packaging the application code according to the application type to generate the application deployment file; Among them, the application deployment file includes an installation package and a remote deployment file. The installation package is used to generate an application by downloading, and the remote deployment file is used to deploy the application on a remote server.

7. An application generation device, characterized in that, Including: An acquisition module, configured to acquire an interface design diagram; A page generation module, configured to generate interface configuration data according to the interface design diagram, and generate an application page corresponding to the interface design diagram according to the interface configuration data; A data processing module, configured to correspondingly match the interaction data of the application page with the interface configuration data to obtain page configuration information; An application classification module, configured to, through an application classifier, call basic code according to the interface design diagram, and modify configuration parameters in the basic code according to the page configuration information to obtain application code; And An application generation module, configured to generate an application deployment file according to the application code; among them, the application deployment file is used to generate an application; The application classification module is configured to, through a preset application template library, provide application classification data for the application classifier. Among them, the application template library includes application templates of multiple application types, and the application classification data includes application template data of each application type; through the application classifier, match a corresponding application type among multiple application types in the application template library according to the interface design diagram, and obtain application template data of the matched application type. The application template data includes basic code; modify configuration parameters in the basic code of the matched application type according to the page configuration information to obtain application code corresponding to the interface design diagram.

8. An electronic device, characterized in that, Including: A processor and a memory. The memory stores machine-readable instructions executable by the processor. When the machine-readable instructions are executed by the processor, the method according to any one of claims 1 to 6 is executed.

9. A computer-readable storage medium, characterized in that, A computer program is stored on the computer-readable storage medium. When the computer program is run by a processor, the method according to any one of claims 1 to 6 is executed.

Citation Information

Patent Citations

  • Front-end and back-end CRUD code generation method and device

    CN112416363A