Document interface display method, device and equipment and storage medium thereof
By using dynamic style templates and dynamic rendering components in document display, the compatibility problem of document display on different terminal devices is solved, flexible display and automatic adaptation of documents are realized, and the consumption of development resources is reduced.
Patent Information
- Application Number
- CN202411923949.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-12-25
- Publication Date
- 2025-04-15
- Estimated Expiration
- 2044-12-25
AI Technical Summary
The existing technology has bottlenecks in the display of documents, especially in terms of mobile screen interface uniformity, interface interaction conversion and screen interface size compatibility, which leads to the need to be developed separately, and cannot be displayed flexibly and adapted automatically, and resource consumption is large.
A document interface display method is proposed. By receiving and analyzing the target document interface display request, dynamic style templates and dynamic rendering components are obtained, and the UI interface components are dynamically processed by using the template parser and dynamic rendering components to realize flexible display and automatic adaptation of documents from the provision end to the display end.
The flexible display and automatic adaptation of target documents on different terminal devices has been achieved, reducing the consumption of development resources and improving the uniformity and efficiency of document display.
Smart Images

Figure CN119829186A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of R&D and design technology, and is applied to scenarios in which multiple output terminals of documents are supported, and in particular, to a document interface display method, device, equipment and storage medium thereof. Background Art
[0002] The Internet has a huge user base. In order to improve service convenience and give full play to the advantages of the Internet, more and more industries have launched online services. For example, traditional document invoicing services are gradually developing towards online document services, including online invoicing services, online document data extraction services, online document statistics services, etc.
[0003] However, there are still many bottlenecks in the display of documents, mainly for the following reasons: First, there are many and diverse mobile screen interface service providers, and it is impossible to form a unified screen interface size; second, in terms of interface interaction, the business needs and functions expanded on the PC side involve the conversion of Windows system to Android or Apple system when converting to the mobile side, and cannot be directly transferred to mobile device applications; third, the screen interface sizes of various mobile terminals or mobile phone models are different, resulting in the document display being unable to be fully compatible with all models. Therefore, the development and implementation of the front-end display function requires the separate development of the PC and mobile terminals, which cannot be flexibly displayed and automatically adapted, and requires more resources. Summary of the invention
[0004] The purpose of the embodiments of the present application is to propose a document interface display method, device, equipment and storage medium thereof to solve the problem that the development and implementation of the existing front-end display function requires separate development of the PC and mobile terminals, cannot be flexibly displayed and automatically adapted, and requires a large investment of resources.
[0005] In order to solve the above technical problems, the embodiment of the present application provides a document interface display method, which adopts the following technical solutions:
[0006] A document interface display method includes the following steps:
[0007] Receive and parse the target document interface display request and obtain the corresponding parsing results;
[0008] Based on the analysis result, dynamic style templates predefined for different components in the target document structure are obtained;
[0009] Using a pre-built template parser to parse the dynamic style template to obtain various UI interface components after parsing;
[0010] Based on the analysis result, obtaining dynamic rendering components pre-packaged for different components in the target document structure;
[0011] Dynamically process the UI interface components corresponding to the different components in the target document structure using the corresponding dynamic rendering components respectively;
[0012] The dynamic processing results are mapped to a preset display interface to complete the interface display of the target document.
[0013] Furthermore, the step of receiving and parsing the target document interface display request to obtain the corresponding parsing result includes:
[0014] Receiving a target document interface display request sent by a target display terminal, wherein the target display terminal includes a target display terminal based on a mobile terminal and a target display terminal based on a PC terminal;
[0015] Parsing the interface display request to obtain the model information of the target display terminal and the model information of the document providing terminal;
[0016] Using the model information of the target display terminal as the index field, the interface size information of the target display terminal is identified through a preset model interface relationship mapping form;
[0017] The model information of the document providing end is used as an index field, and the interface size information of the document providing end is identified through the model interface relationship mapping form.
[0018] Furthermore, the different components in the target document structure include a title part, a content body part and an ending part, and the content body part includes form field content, picture description content, and functional buttons. Before executing the step of obtaining dynamic style templates predefined for different components in the target document structure based on the parsing result, the method further includes:
[0019] According to the interface size information of the document providing end, identifying the font size of the text content in the title part, the content body part and the ending part in the document providing end;
[0020] According to the interface size information of the document providing end, the display ratio relationship between the title part, the content main part and the ending part and the overall interface of the document providing end is identified;
[0021] According to the interface size information of the document providing end, identifying the number of display columns and layout information corresponding to the form field content, the picture description content and the functional buttons in the content body part;
[0022] The font size, the display ratio, the display column number and the layout information are used as template control conditions of the dynamic style template.
[0023] Furthermore, the step of obtaining dynamic style templates predefined for different components in the target document structure based on the parsing result specifically includes:
[0024] Determine, according to the interface size information of the target display terminal and the template control condition, the font size of the text content of the title part in the target document structure in the target display terminal and the display ratio relationship of the title part in the target display terminal;
[0025] Based on the font size of the text content of the title part in the target display terminal and the display ratio of the title part in the target display terminal, construct a dynamic style template corresponding to the title part;
[0026] According to the interface size information of the target display terminal and the template control condition, determine the font size of the text content of the content body part in the target document structure in the target display terminal, and the interface position information corresponding to the form field content, the picture description content and the functional button in the content body part in the target display terminal;
[0027] Constructing a dynamic style template corresponding to the main body of the content based on the font size of the text content of the main body of the content in the target display terminal, and the interface position information corresponding to the form field content, the picture description content, and the functional button in the main body of the content in the target display terminal;
[0028] Determine, according to the interface size information of the target display terminal and the template control condition, the font size of the text content of the ending part of the target document structure in the target display terminal and the display ratio relationship of the ending part in the target display terminal;
[0029] Based on the font size of the text content of the ending part in the target display terminal and the display ratio relationship of the ending part in the target display terminal, a dynamic style template corresponding to the ending part is constructed.
[0030] Furthermore, before executing the step of obtaining the pre-packaged dynamic rendering components for different components in the target document structure based on the parsing result, the method further includes:
[0031] According to the differences of various UI interface components, dynamic rendering components of different rendering types are set respectively, wherein the dynamic rendering components of different rendering types include dynamic rendering components based on conditional judgment, dynamic rendering components based on loading mode and dynamic rendering components based on routing;
[0032] The step of obtaining pre-packaged dynamic rendering components for different components in the target document structure based on the parsing result specifically includes:
[0033] According to the UI interface component corresponding to the title part, the dynamic rendering type of the title part is identified, and the dynamic rendering component corresponding to the title part in the target document structure is obtained;
[0034] According to the UI interface components corresponding to the form field content, the picture description content and the functional button in the content body part, the dynamic rendering types corresponding to the form field content, the picture description content and the functional button in the content body part are identified, and the dynamic rendering components corresponding to the form field content, the picture description content and the functional button in the content body part in the target document structure are obtained;
[0035] According to the UI interface component corresponding to the ending part, the dynamic rendering type of the ending part is identified, and the dynamic rendering component corresponding to the ending part in the target document structure is obtained.
[0036] Furthermore, the step of dynamically processing the UI interface components corresponding to the different components in the target document structure respectively by using the corresponding dynamic rendering components specifically includes:
[0037] Starting the dynamic rendering component corresponding to the title part in the target document structure, and judging whether the title part meets the specified dynamic rendering conditions according to the dynamic rendering type of the title part;
[0038] If the title part meets the specified dynamic rendering conditions, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the title part to complete the dynamic generation of the title part;
[0039] Starting the dynamic rendering components corresponding to the form field content, the picture description content and the functional buttons in the content body part of the target document structure, and judging whether the form field content, the picture description content and the functional buttons in the content body part meet the specified dynamic rendering conditions according to the dynamic rendering types corresponding to the form field content, the picture description content and the functional buttons in the content body part;
[0040] If the form field content, picture description content and functional buttons in the content body part meet the specified dynamic rendering conditions, the corresponding dynamic rendering components are used to dynamically render the UI interface components corresponding to the form field content, picture description content and functional buttons in the content body part, so as to complete the dynamic generation of the content body part;
[0041] Starting the dynamic rendering component corresponding to the ending part in the target document structure, and judging whether the ending part meets the specified dynamic rendering condition according to the dynamic rendering type of the ending part;
[0042] If the ending part meets the specified dynamic rendering conditions, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the ending part to complete the dynamic generation of the ending part.
[0043] Furthermore, the step of mapping the dynamic processing result to a preset display interface to complete the interface display of the target document specifically includes:
[0044] Obtaining the interface address information of the target display terminal;
[0045] The dynamically generated title part, content body part and ending part are sequentially sent to the display interface through the interface address information;
[0046] The dynamically generated title part, content main part and ending part are connected coherently in the order of sending to obtain the interface display result of the target document.
[0047] In order to solve the above technical problems, the embodiment of the present application also provides a document interface display device, which adopts the following technical solution:
[0048] A document interface display device, comprising:
[0049] The display request parsing module is used to receive and parse the target document interface display request and obtain the corresponding parsing result;
[0050] A dynamic style template acquisition module, used for acquiring dynamic style templates predefined for different components in the target document structure based on the parsing result;
[0051] A UI interface component acquisition module is used to parse the dynamic style template using a pre-built template parser to obtain each UI interface component after parsing;
[0052] A dynamic rendering component acquisition module, used for acquiring, based on the parsing result, dynamic rendering components pre-packaged for different components in the target document structure;
[0053] A UI interface component dynamic rendering module, used to dynamically process the UI interface components corresponding to different components in the target document structure using corresponding dynamic rendering components;
[0054] The interface mapping display module is used to map the dynamic processing results to a preset display interface to complete the interface display of the target document.
[0055] In order to solve the above technical problems, the embodiment of the present application further provides a computer device, which adopts the following technical solution:
[0056] A computer device includes a memory and a processor, wherein the memory stores computer-readable instructions, and the processor implements the steps of the document interface display method described above when executing the computer-readable instructions.
[0057] In order to solve the above technical problems, the embodiment of the present application further provides a computer-readable storage medium, which adopts the following technical solution:
[0058] A computer-readable storage medium stores computer-readable instructions, which, when executed by a processor, implement the steps of the document interface display method as described above.
[0059] Compared with the prior art, the embodiments of the present application have the following beneficial effects:
[0060] The document interface display method described in the embodiment of the present application receives and parses the target document interface display request to obtain the corresponding parsing result; based on the parsing result, obtains the dynamic style templates predefined for different components in the target document structure; uses a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, obtains the dynamic rendering components pre-packaged for different components in the target document structure; uses the corresponding dynamic rendering components to dynamically process the UI interface components corresponding to the different components in the target document structure; maps the dynamic processing results to the preset display interface to complete the interface display of the target document. The document interface display method described in the present application dynamically renders the UI interface component in combination with the dynamic rendering component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources. BRIEF DESCRIPTION OF THE DRAWINGS
[0061] In order to more clearly illustrate the scheme in the present application, a brief introduction is given below to the drawings required for use in the description of the embodiments of the present application. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.
[0062] Figure 1 is an exemplary system architecture diagram to which the present application may be applied;
[0063] Figure 2 It is a flow chart of an embodiment of the document interface display method according to the present application;
[0064] Figure 3 yes Figure 2 A flowchart of a specific embodiment of step 201 is shown;
[0065] Figure 4 It is a flowchart of a specific embodiment of obtaining template control conditions in the document interface display method described in this application;
[0066] Figure 5 yes Figure 2 A flowchart of a specific embodiment of step 202 is shown;
[0067] Figure 6 yes Figure 2 A flowchart of a specific embodiment of step 204 is shown;
[0068] Figure 7 yes Figure 2 A flowchart of a specific embodiment of step 205 is shown;
[0069] Figure 8 yes Figure 2 A flowchart of a specific embodiment of step 206 is shown;
[0070] Fig. 9 It is a structural schematic diagram of an embodiment of a document interface display device according to the present application;
[0071] Fig.10 It is a structural diagram of an embodiment of a computer device according to the present application. DETAILED DESCRIPTION
[0072] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by technicians in the technical field of the present application; the terms used in the specification of the application herein are only for the purpose of describing specific embodiments and are not intended to limit the present application; the terms "including" and "having" and any variations thereof in the specification and claims of the present application and the above-mentioned drawings are intended to cover non-exclusive inclusions. The terms "first", "second", etc. in the specification and claims of the present application or the above-mentioned drawings are used to distinguish different objects, not to describe a specific order.
[0073] Reference to "embodiments" herein means that a particular feature, structure, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those skilled in the art that the embodiments described herein may be combined with other embodiments.
[0074] In order to enable those skilled in the art to better understand the solution of the present application, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the accompanying drawings.
[0075] like Figure 1 As shown, the system architecture 100 may include a terminal device 101, a network 102 and a server 103. The terminal device 101 may be a laptop 1011, a tablet computer 1012 or a mobile phone 1013. The network 102 is used to provide a medium for a communication link between the terminal device 101 and the server 103. The network 102 may include various connection types, such as wired, wireless communication links or optical fiber cables.
[0076] The user can use the terminal device 101 to interact with the server 103 through the network 102 to receive or send messages, etc. Various communication client applications can be installed on the terminal device 101, such as web browser applications, shopping applications, search applications, instant messaging tools, email clients, social platform software, etc.
[0077] The terminal device 101 can be any electronic device with a display screen and supporting web browsing. In addition to a laptop computer 1011, a tablet computer 1012 or a mobile phone 1013, the terminal device 101 can also be an e-book reader, an MP3 player (Moving Picture Experts Group Audio Layer III), an MP4 (Moving Picture Experts Group Audio Layer IV), a laptop computer, a desktop computer, etc.
[0078] The server 103 may be a server that provides various services, such as a background server that provides support for a web page displayed on the terminal device 101 .
[0079] It should be noted that the document interface display method provided in the embodiment of the present application is generally executed by a server, and accordingly, the document interface display device is generally set in the server.
[0080] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.
[0081] Continue to refer Figure 2 , showing a flow chart of an embodiment of a document interface display method according to the present application. The document interface display method comprises the following steps:
[0082] Step 201, receiving and parsing a target document interface display request, and obtaining a corresponding parsing result.
[0083] In this embodiment, the target document interface display request refers to the interface display request issued by the document viewing end for the target document. The target document includes shopping documents, medical certificate documents, transfer and remittance documents and all other documents that can be displayed on the mobile terminal interface or PC terminal interface.
[0084] In this embodiment, the document interface display method is generally deployed on a software service provider that provides document display, and the software service provider uses the document interface display method to process the target document and display the target document on the document viewing end. That is, the document providing end only provides the document, and the document viewing end only sends a viewing request instruction and subsequently receives the processed document.
[0085] Step 202: based on the analysis result, obtain dynamic style templates predefined for different components in the target document structure.
[0086] In this embodiment, based on the analysis result, dynamic style templates predefined for different components in the target document structure are obtained, which fully combines the font size, display ratio relationship, number of display columns and layout information of the target document in the document providing end, and uses the font size, display ratio relationship, number of display columns and layout information of the target document in the document providing end as the template control conditions of the dynamic style template, and then combines the interface size information of the target display end to generate the dynamic style template.
[0087] Specifically, the font size, display ratio, number of display columns and layout information of the target document in the document providing end are used as template control conditions, and combined with the interface size information of the target display end, the dynamic style template is generated, taking into account the change of the target document from the providing end interface to the display end interface, so as to facilitate reasonable visual effect control of the entire display conversion.
[0088] Step 203: Use a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing.
[0089] Specifically, the pre-built template parser can obtain a UI interface component by parsing, wherein the UI interface component can be understood as a display component after adding a corresponding dynamic style template to the data content in the target document, so as to facilitate the subsequent combination with the UI interface component to display the target document to the target display end, thereby maximally reducing the impact of the dynamic style template on the document display.
[0090] It should be understood that in this embodiment, step 202 uses the font size, display ratio, number of display columns and layout information of the target document in the document providing end as template control conditions, and combines the interface size information of the target display end to generate the dynamic style template, taking into account the change of the target document from the providing end interface to the display end interface, so as to facilitate reasonable visual effect control of the entire display transformation, and step 203 is based on the visual effect control of step 202, and parses the dynamic template through the template parser to reduce the impact of the dynamic style template on the document display, and also facilitates the subsequent use of the UI interface components obtained by the analysis to render the target document to the target display end.
[0091] Step 204: based on the analysis result, obtain the pre-packaged dynamic rendering components for different components in the target document structure.
[0092] In this embodiment, dynamic rendering components are encapsulated for different components in the target document structure, ensuring that the various rendering components do not interfere with each other during subsequent dynamic rendering, thereby flexibly rendering.
[0093] Step 205: dynamically process the UI interface components corresponding to the different components in the target document structure using the corresponding dynamic rendering components.
[0094] Step 206, mapping the dynamic processing result to a preset display interface to complete the interface display of the target document.
[0095] In this embodiment, by receiving and parsing the interface display request of the target document, the corresponding parsing result is obtained; based on the parsing result, the dynamic style templates predefined for different components in the target document structure are obtained; a pre-built template parser is used to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, the dynamic rendering components pre-packaged for different components in the target document structure are obtained; the UI interface components corresponding to different components in the target document structure are dynamically processed using the corresponding dynamic rendering components; the dynamic processing results are mapped to the preset display interface to complete the interface display of the target document. The document interface display method described in the present application combines the dynamic rendering component to dynamically render the UI interface component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0096] Continue to refer Figure 3 , Figure 3 yes Figure 2 The flowchart of a specific embodiment of step 201 shown includes the following steps:
[0097] Step 301, receiving a target document interface display request sent by a target display terminal, wherein the target display terminal includes a target display terminal based on a mobile terminal and a target display terminal based on a PC terminal;
[0098] Step 302, parsing the interface display request to obtain the model information of the target display terminal and the model information of the document providing terminal;
[0099] Step 303, using the model information of the target display terminal as an index field, and identifying the interface size information of the target display terminal through a preset model interface relationship mapping form;
[0100] Step 304: using the model information of the document providing end as an index field, and identifying the interface size information of the document providing end through the model interface relationship mapping form.
[0101] Specifically, the interface display request includes the model information of the target display terminal and the model information of the document providing terminal, that is, the interface display request includes the model information of the document request terminal and the model information of the document providing terminal, and the document request terminal and the document providing terminal can be both mobile terminals and PC terminals at the same time, or one can be a mobile terminal and the other can be a PC terminal. By obtaining the model information of the target display terminal and the model information of the document providing terminal, the document display conversion between the mobile terminal and the PC terminal is realized.
[0102] In this embodiment, the different components in the target document structure include a title part, a content body part and an ending part. The content body part includes form field content, picture description content, and functional buttons.
[0103] Continue to refer Figure 4 In some optional implementations, a step of acquiring a template control condition is also included before step 202. Figure 4 This is a flowchart of a specific embodiment of obtaining template control conditions in the document interface display method described in this application, including the following steps:
[0104] Step 401, based on the interface size information of the document providing terminal, identifying the font size of the text content in the title part, the content body part and the ending part in the document providing terminal;
[0105] Step 402, based on the interface size information of the document providing end, identifying the display ratio relationship between the title part, the content body part and the ending part and the overall interface of the document providing end;
[0106] Step 403, identifying the number of display columns and layout information corresponding to the form field content, the picture description content and the functional buttons in the content body part according to the interface size information of the document providing end;
[0107] Step 404: Using the font size, the display ratio, the display column number and the layout information as template control conditions of the dynamic style template.
[0108] By combining the interface size information of the document provider, the font size information, display ratio, number of display columns and layout information of the target document at the document provider can be identified to ensure that the document results subsequently displayed to the target display end will not have large differences.
[0109] Continue to refer Figure 5 , Figure 5 yes Figure 2 The flowchart of a specific embodiment of step 202 shown includes the following steps:
[0110] Step 501, determining the font size of the text content of the title part in the target document structure in the target display end and the display ratio of the title part in the target display end according to the interface size information of the target display end and the template control condition;
[0111] Step 502: construct a dynamic style template corresponding to the title part based on the font size of the text content of the title part in the target display terminal and the display ratio of the title part in the target display terminal;
[0112] Step 503, according to the interface size information of the target display terminal and the template control condition, determine the font size of the text content of the content body part in the target document structure in the target display terminal, and the interface position information corresponding to the form field content, the picture description content and the functional button in the content body part in the target display terminal;
[0113] Step 504: construct a dynamic style template corresponding to the content body part based on the font size of the text content of the content body part in the target display terminal, and the interface position information corresponding to the form field content, picture description content and functional buttons in the content body part in the target display terminal;
[0114] Step 505, determining the font size of the text content of the end part of the target document structure in the target display end and the display ratio of the end part in the target display end according to the interface size information of the target display end and the template control condition;
[0115] Step 506: construct a dynamic style template corresponding to the ending part based on the font size of the text content of the ending part in the target display terminal and the display ratio of the ending part in the target display terminal.
[0116] By combining the interface size information of the target display end and the template control conditions obtained from the document providing end, a dynamic style template corresponding to the title part, a dynamic style template corresponding to the content body part and a dynamic style template corresponding to the ending part in the target document are generated, so as to ensure that the document results subsequently displayed to the target display end will not be significantly different from those of the document providing end.
[0117] In this embodiment, before executing the step of obtaining pre-packaged dynamic rendering components for different components in the target document structure based on the parsing results, the method also includes: setting dynamic rendering components of different rendering types according to the differences of each UI interface component, wherein the dynamic rendering components of different rendering types include dynamic rendering components based on conditional judgment, dynamic rendering components based on loading method and dynamic rendering components based on routing.
[0118] Specifically, the dynamic rendering component based on conditional judgment, for example, rendering is performed only when a certain condition is met; the dynamic rendering component based on loading method, for example, when a certain condition is met, some parts are asynchronously loaded; the dynamic rendering component based on routing, for example, in large page display, the rendering of different pages and components is managed through the Router routing method.
[0119] Continue to refer Figure 6 , Figure 6 yes Figure 2 The flowchart of a specific embodiment of step 204 shown includes the following steps:
[0120] Step 601, identifying the dynamic rendering type of the title part according to the UI interface component corresponding to the title part, and obtaining the dynamic rendering component corresponding to the title part in the target document structure;
[0121] Step 602: According to the UI interface components corresponding to the form field content, the image description content and the functional button in the content body, the dynamic rendering types corresponding to the form field content, the image description content and the functional button in the content body are identified, and the dynamic rendering components corresponding to the form field content, the image description content and the functional button in the content body in the target document structure are obtained;
[0122] Step 603: Identify the dynamic rendering type of the ending part according to the UI interface component corresponding to the ending part, and obtain the dynamic rendering component corresponding to the ending part in the target document structure.
[0123] In this embodiment, the dynamic rendering components and dynamic rendering types corresponding to different components in the target document structure are used to facilitate the subsequent dynamic rendering of the corresponding UI interface components using the dynamic rendering components.
[0124] Continue to refer Figure 7 , Figure 7 yes Figure 2 The flowchart of a specific embodiment of step 205 shown includes the following steps:
[0125] Step 701, starting the dynamic rendering component corresponding to the title part in the target document structure, and judging whether the title part meets the specified dynamic rendering condition according to the dynamic rendering type of the title part;
[0126] Step 702: If the title part meets the specified dynamic rendering condition, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the title part to complete the dynamic generation of the title part;
[0127] Correspondingly, if the title part does not meet the specified dynamic rendering conditions, the dynamic rendering component will not be used to dynamically render the UI interface component corresponding to the title part temporarily, and the rendering wait will continue.
[0128] Step 703, starting the dynamic rendering components corresponding to the form field content, the picture description content and the functional button in the content body part of the target document structure, and judging whether the form field content, the picture description content and the functional button in the content body part meet the specified dynamic rendering conditions according to the dynamic rendering types corresponding to the form field content, the picture description content and the functional button in the content body part;
[0129] Step 704: If the form field content, the image description content, and the functional buttons in the content body part meet the specified dynamic rendering conditions, the corresponding dynamic rendering components are used to dynamically render the UI interface components corresponding to the form field content, the image description content, and the functional buttons in the content body part, so as to complete the dynamic generation of the content body part;
[0130] Correspondingly, if the main body of the content does not meet the specified dynamic rendering conditions, the dynamic rendering component is not used to dynamically render the UI interface component corresponding to the main body of the content, and the rendering wait is continued.
[0131] Step 705, starting the dynamic rendering component corresponding to the ending part in the target document structure, and judging whether the ending part meets the specified dynamic rendering condition according to the dynamic rendering type of the ending part;
[0132] Step 706: If the ending part meets the specified dynamic rendering conditions, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the ending part to complete the dynamic generation of the ending part.
[0133] Correspondingly, if the ending part does not meet the specified dynamic rendering conditions, the dynamic rendering component is not used to dynamically render the UI interface component corresponding to the ending part temporarily, and the rendering wait is continued.
[0134] Continue to refer Figure 8, Figure 8 yes Figure 2 The flowchart of a specific embodiment of step 206 shown includes the following steps:
[0135] Step 801, obtaining the interface address information of the target display terminal;
[0136] Step 802, sending the dynamically generated title part, content body part and ending part to the display interface in sequence through the interface address information;
[0137] Step 803, the dynamically generated title part, content body part and ending part are connected coherently in the order of sending, so as to obtain the interface display result of the target document.
[0138] By combining the interface address information of the target display terminal, the dynamically generated title part, content body part and ending part are sent to the display interface in sequence, and the dynamically generated title part, content body part and ending part are spliced in a top-down and bottom-down coherent manner in the order of sending, so as to obtain the interface display result of the target document, thereby achieving sending and displaying in accordance with the user's browsing habits, that is, browsing from the title part, content body part and ending part of the document in sequence.
[0139] The present application receives and parses the interface display request of the target document to obtain the corresponding parsing result; based on the parsing result, obtains the dynamic style templates predefined for different components in the target document structure; uses a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, obtains the dynamic rendering components pre-packaged for different components in the target document structure; uses the corresponding dynamic rendering components to dynamically process the UI interface components corresponding to the different components in the target document structure; maps the dynamic processing results to the preset display interface to complete the interface display of the target document. The document interface display method described in the present application combines the dynamic rendering component to dynamically render the UI interface component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0140] The embodiments of the present application can acquire and process relevant data based on artificial intelligence technology. Among them, artificial intelligence (AI) is the theory, method, technology and application system that uses digital computers or machines controlled by digital computers to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results.
[0141] AI basic technologies generally include sensors, dedicated AI chips, cloud computing, distributed storage, big data processing technology, operation / interaction systems, mechatronics, etc. AI software technologies mainly include computer vision technology, robotics technology, biometrics technology, speech processing technology, natural language processing technology, and machine learning / deep learning.
[0142] In the embodiment of the present application, a corresponding parsing result is obtained by receiving and parsing a target document interface display request; based on the parsing result, a dynamic style template predefined for different components in the target document structure is obtained; a pre-built template parser is used to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, dynamic rendering components pre-packaged for different components in the target document structure are obtained; the UI interface components corresponding to different components in the target document structure are dynamically processed using corresponding dynamic rendering components; the dynamic processing results are mapped to a preset display interface to complete the interface display of the target document. The document interface display method described in the present application dynamically renders the UI interface component in combination with the dynamic rendering component, realizes flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0143] Further references Fig. 9 , as a response to the above Figure 2 In order to realize the method shown in the figure, the present application provides an embodiment of a document interface display device, which is similar to Figure 2 Corresponding to the method embodiment shown, the device can be specifically applied to various electronic devices.
[0144] like Fig. 9 As shown, the document interface display device 900 described in this embodiment includes: a display request parsing module 901, a dynamic style template acquisition module 902, a UI interface component acquisition module 903, a dynamic rendering component acquisition module 904, a UI interface component dynamic rendering module 905 and an interface mapping display module 906. Among them:
[0145] The display request parsing module 901 is used to receive and parse the target document interface display request to obtain the corresponding parsing result;
[0146] A dynamic style template acquisition module 902 is used to acquire dynamic style templates predefined for different components in the target document structure based on the parsing result;
[0147] A UI interface component obtaining module 903 is used to parse the dynamic style template using a pre-built template parser to obtain each UI interface component after parsing;
[0148] A dynamic rendering component acquisition module 904 is used to acquire, based on the parsing result, dynamic rendering components pre-packaged for different components in the target document structure;
[0149] A UI interface component dynamic rendering module 905, for dynamically processing the UI interface components corresponding to different components in the target document structure using corresponding dynamic rendering components;
[0150] The interface mapping and display module 906 is used to map the dynamic processing results to a preset display interface to complete the interface display of the target document.
[0151] The present application receives and parses the interface display request of the target document to obtain the corresponding parsing result; based on the parsing result, obtains the dynamic style templates predefined for different components in the target document structure; uses a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, obtains the dynamic rendering components pre-packaged for different components in the target document structure; uses the corresponding dynamic rendering components to dynamically process the UI interface components corresponding to the different components in the target document structure; maps the dynamic processing results to the preset display interface to complete the interface display of the target document. The document interface display method described in the present application combines the dynamic rendering component to dynamically render the UI interface component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0152] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiments can be implemented by instructing the relevant hardware through computer-readable instructions, and the computer-readable instructions can be stored in a computer-readable storage medium. When the program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, the aforementioned storage medium can be a non-volatile storage medium such as a disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).
[0153] It should be understood that, although the steps in the flowchart of the accompanying drawings are displayed in sequence as indicated by the arrows, these steps are not necessarily executed in sequence in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least a part of the steps in the flowchart of the accompanying drawings may include multiple sub-steps or multiple stages, and these sub-steps or stages are not necessarily executed at the same time, but can be executed at different times, and their execution order is not necessarily sequential, but can be executed in turn or alternately with other steps or at least a part of the sub-steps or stages of other steps.
[0154] To solve the above technical problems, the present application also provides a computer device. Fig.10 , Fig.10 This is a basic structural block diagram of the computer device in this embodiment.
[0155] The computer device 10 includes a memory 10a, a processor 10b, and a network interface 10c which are interconnected and communicated via a system bus. It should be noted that: Fig.10 Only a computer device 10 having a component memory 10a, a processor 10b, and a network interface 10c is shown, but it should be understood that it is not required to implement all the components shown, and more or fewer components may be implemented instead. Among them, those skilled in the art can understand that the computer device here is a device that can automatically perform numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes but is not limited to a microprocessor, an application specific integrated circuit (ASIC), a field programmable gate array (FPGA), a digital processor (DSP), an embedded device, etc.
[0156] The computer device may be a computing device such as a desktop computer, a notebook, a PDA, a cloud server, etc. The computer device may interact with a user through a keyboard, a mouse, a remote controller, a touch pad, or a voice control device.
[0157] The memory 10a includes at least one type of readable storage medium, and the readable storage medium includes flash memory, hard disk, multimedia card, card-type memory (for example, SD or DX memory, etc.), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, magnetic disk, optical disk, etc. In some embodiments, the memory 10a can be an internal storage unit of the computer device 10, such as a hard disk or memory of the computer device 10. In other embodiments, the memory 10a can also be an external storage device of the computer device 10, such as a plug-in hard disk, smart memory card (Smart Media Card, SMC), secure digital (Secure Digital, SD) card, flash card (Flash Card), etc. equipped on the computer device 10. Of course, the memory 10a can also include both the internal storage unit of the computer device 10 and its external storage device. In this embodiment, the memory 10a is generally used to store the operating system and various application software installed on the computer device 10, such as a computer-readable instruction of a document interface display method, etc. In addition, the memory 10a can also be used to temporarily store various types of data that have been output or are to be output.
[0158] The processor 10b may be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chips in some embodiments. The processor 10b is generally used to control the overall operation of the computer device 10. In this embodiment, the processor 10b is used to run the computer-readable instructions stored in the memory 10a or process data, such as running the computer-readable instructions of the document interface display method.
[0159] The network interface 10c may include a wireless network interface or a wired network interface. The network interface 10c is generally used to establish a communication connection between the computer device 10 and other electronic devices.
[0160] The computer device proposed in this embodiment belongs to the field of research and development design technology, and is applied to document multi-output terminal output support scenarios. This application receives and parses the target document interface display request to obtain the corresponding parsing result; based on the parsing result, obtains the dynamic style templates predefined for different components in the target document structure; uses a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, obtains the dynamic rendering components pre-packaged for different components in the target document structure; uses the corresponding dynamic rendering components to dynamically process the UI interface components corresponding to the different components in the target document structure; maps the dynamic processing results to the preset display interface to complete the interface display of the target document. The document interface display method described in this application combines the dynamic rendering component to dynamically render the UI interface component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0161] The present application also provides another embodiment, namely, providing a computer-readable storage medium, wherein the computer-readable storage medium stores computer-readable instructions, and the computer-readable instructions can be executed by a processor to enable the processor to perform the steps of the document interface display method as described above.
[0162] The computer-readable storage medium proposed in this embodiment belongs to the field of research and development design technology, and is applied to document multi-output terminal output support scenarios. This application receives and parses the target document interface display request to obtain the corresponding parsing result; based on the parsing result, obtains the dynamic style templates predefined for different components in the target document structure; uses a pre-built template parser to parse the dynamic style template to obtain each UI interface component after parsing; based on the parsing result, obtains the dynamic rendering components pre-packaged for different components in the target document structure; uses the corresponding dynamic rendering components to dynamically process the UI interface components corresponding to the different components in the target document structure; maps the dynamic processing results to the preset display interface to complete the interface display of the target document. The document interface display method described in this application combines the dynamic rendering component to dynamically render the UI interface component, realizes the flexible display and automatic adaptation of the target document from the providing end to the display end, and reduces the consumption of development resources.
[0163] Through the description of the above implementation methods, those skilled in the art can clearly understand that the above-mentioned embodiment methods can be implemented by means of software plus a necessary general hardware platform, and of course by hardware, but in many cases the former is a better implementation method. Based on such an understanding, the technical solution of the present application, or the part that contributes to the prior art, can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk), and includes a number of instructions for a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in each embodiment of the present application.
[0164] Obviously, the embodiments described above are only some embodiments of the present application, rather than all embodiments. The preferred embodiments of the present application are given in the accompanying drawings, but they do not limit the patent scope of the present application. The present application can be implemented in many different forms. On the contrary, the purpose of providing these embodiments is to make the understanding of the disclosure of the present application more thorough and comprehensive. Although the present application is described in detail with reference to the aforementioned embodiments, for those skilled in the art, it is still possible to modify the technical solutions recorded in the aforementioned specific implementation methods, or to perform equivalent replacement of some of the technical features therein. Any equivalent structure made using the contents of the specification and drawings of this application, directly or indirectly used in other related technical fields, is similarly within the scope of patent protection of this application.
Claims
1. A document interface display method, characterized in that: The steps include: Receive and parse the target document interface display request and obtain the corresponding parsing results; Based on the analysis result, dynamic style templates predefined for different components in the target document structure are obtained; Using a pre-built template parser to parse the dynamic style template to obtain various UI interface components after parsing; Based on the analysis result, obtaining dynamic rendering components pre-packaged for different components in the target document structure; Dynamically process the UI interface components corresponding to the different components in the target document structure using the corresponding dynamic rendering components respectively; The dynamic processing results are mapped to a preset display interface to complete the interface display of the target document.
2. The document interface display method according to claim 1, characterized in that: The step of receiving and parsing the target document interface display request to obtain the corresponding parsing result includes: Receiving a target document interface display request sent by a target display terminal, wherein the target display terminal includes a target display terminal based on a mobile terminal and a target display terminal based on a PC terminal; Parsing the interface display request to obtain the model information of the target display terminal and the model information of the document providing terminal; Using the model information of the target display terminal as the index field, the interface size information of the target display terminal is identified through a preset model interface relationship mapping form; The model information of the document providing end is used as an index field, and the interface size information of the document providing end is identified through the model interface relationship mapping form.
3. The document interface display method according to claim 1, characterized in that: The different components in the target document structure include a title part, a content body part and an ending part, and the content body part includes form field content, picture description content, and functional buttons. Before executing the step of obtaining dynamic style templates predefined for different components in the target document structure based on the parsing result, the method further includes: According to the interface size information of the document providing end, identifying the font size of the text content in the title part, the content body part and the ending part in the document providing end; According to the interface size information of the document providing end, the display ratio relationship between the title part, the content main part and the ending part and the overall interface of the document providing end is identified; According to the interface size information of the document providing end, identifying the number of display columns and layout information corresponding to the form field content, the picture description content and the functional buttons in the content body part; The font size, the display ratio, the display column number and the layout information are used as template control conditions of the dynamic style template.
4. The document interface display method according to claim 3 is characterized in that: The step of obtaining dynamic style templates predefined for different components in the target document structure based on the parsing result specifically includes: Determine, according to the interface size information of the target display terminal and the template control condition, the font size of the text content of the title part in the target document structure in the target display terminal and the display ratio relationship of the title part in the target display terminal; Based on the font size of the text content of the title part in the target display terminal and the display ratio of the title part in the target display terminal, construct a dynamic style template corresponding to the title part; According to the interface size information of the target display terminal and the template control condition, determine the font size of the text content of the content body part in the target document structure in the target display terminal, and the interface position information corresponding to the form field content, the picture description content and the functional button in the content body part in the target display terminal; Constructing a dynamic style template corresponding to the main body of the content based on the font size of the text content of the main body of the content in the target display terminal, and the interface position information corresponding to the form field content, the picture description content, and the functional button in the main body of the content in the target display terminal; Determine, according to the interface size information of the target display terminal and the template control condition, the font size of the text content of the ending part of the target document structure in the target display terminal and the display ratio relationship of the ending part in the target display terminal; Based on the font size of the text content of the ending part in the target display terminal and the display ratio relationship of the ending part in the target display terminal, a dynamic style template corresponding to the ending part is constructed.
5. The document interface display method according to claim 1, characterized in that: Before executing the step of obtaining pre-packaged dynamic rendering components for different components in the target document structure based on the parsing result, the method further includes: According to the differences of various UI interface components, dynamic rendering components of different rendering types are set respectively, wherein the dynamic rendering components of different rendering types include dynamic rendering components based on conditional judgment, dynamic rendering components based on loading mode and dynamic rendering components based on routing; The step of obtaining pre-packaged dynamic rendering components for different components in the target document structure based on the parsing result specifically includes: According to the UI interface component corresponding to the title part, the dynamic rendering type of the title part is identified, and the dynamic rendering component corresponding to the title part in the target document structure is obtained; According to the UI interface components corresponding to the form field content, the picture description content and the functional button in the content body part, the dynamic rendering types corresponding to the form field content, the picture description content and the functional button in the content body part are identified, and the dynamic rendering components corresponding to the form field content, the picture description content and the functional button in the content body part in the target document structure are obtained; According to the UI interface component corresponding to the ending part, the dynamic rendering type of the ending part is identified, and the dynamic rendering component corresponding to the ending part in the target document structure is obtained.
6. The document interface display method according to claim 1 or 5, characterized in that: The step of dynamically processing the UI interface components corresponding to the different components in the target document structure by using the corresponding dynamic rendering components specifically includes: Starting the dynamic rendering component corresponding to the title part in the target document structure, and judging whether the title part meets the specified dynamic rendering conditions according to the dynamic rendering type of the title part; If the title part meets the specified dynamic rendering conditions, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the title part to complete the dynamic generation of the title part; Starting the dynamic rendering components corresponding to the form field content, the picture description content and the functional buttons in the content body part of the target document structure, and judging whether the form field content, the picture description content and the functional buttons in the content body part meet the specified dynamic rendering conditions according to the dynamic rendering types corresponding to the form field content, the picture description content and the functional buttons in the content body part; If the form field content, picture description content and functional buttons in the content body part meet the specified dynamic rendering conditions, the corresponding dynamic rendering components are used to dynamically render the UI interface components corresponding to the form field content, picture description content and functional buttons in the content body part, so as to complete the dynamic generation of the content body part; Starting the dynamic rendering component corresponding to the ending part in the target document structure, and judging whether the ending part meets the specified dynamic rendering condition according to the dynamic rendering type of the ending part; If the ending part meets the specified dynamic rendering conditions, the dynamic rendering component is used to dynamically render the UI interface component corresponding to the ending part to complete the dynamic generation of the ending part.
7. The document interface display method according to claim 2, characterized in that: The step of mapping the dynamic processing result to a preset display interface to complete the interface display of the target document specifically includes: Obtaining the interface address information of the target display terminal; The dynamically generated title part, content body part and ending part are sequentially sent to the display interface through the interface address information; The dynamically generated title part, content main part and ending part are connected coherently in the order of sending to obtain the interface display result of the target document.
8. A document interface display device, characterized in that: include: The display request parsing module is used to receive and parse the target document interface display request and obtain the corresponding parsing result; A dynamic style template acquisition module, used for acquiring dynamic style templates predefined for different components in the target document structure based on the parsing result; A UI interface component acquisition module is used to parse the dynamic style template using a pre-built template parser to obtain each UI interface component after parsing; A dynamic rendering component acquisition module, used for acquiring, based on the parsing result, dynamic rendering components pre-packaged for different components in the target document structure; A UI interface component dynamic rendering module, used to dynamically process the UI interface components corresponding to different components in the target document structure using corresponding dynamic rendering components; The interface mapping display module is used to map the dynamic processing results to a preset display interface to complete the interface display of the target document.
9. A computer device, characterized in that: It includes a memory and a processor, wherein the memory stores computer-readable instructions, and when the processor executes the computer-readable instructions, the steps of the document interface display method as described in any one of claims 1 to 7 are implemented.
10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-readable instructions, which, when executed by a processor, implement the steps of the document interface display method according to any one of claims 1 to 7.
Citation Information
Patent Citations
Method and device for displaying dynamic control bill interface
CN102819423A
Showing method and system of bills
CN103713901A
Interface generation method and device, electronic equipment and computer storage medium
CN111240669A
Interface display method and device and electronic equipment
CN115167729A
Interface adjustment method and apparatus, computer program, and computer readable medium
WO2022036917A1