WO2023082994A1 - Page rendering method and apparatus, and terminal device and computer storage medium - Google Patents

Page rendering method and apparatus, and terminal device and computer storage medium Download PDF

Info

Publication number
WO2023082994A1
WO2023082994A1 PCT/CN2022/127561 CN2022127561W WO2023082994A1 WO 2023082994 A1 WO2023082994 A1 WO 2023082994A1 CN 2022127561 W CN2022127561 W CN 2022127561W WO 2023082994 A1 WO2023082994 A1 WO 2023082994A1
Authority
WO
WIPO (PCT)
Prior art keywords
data
control
style
page
rendering
Prior art date
Application number
PCT/CN2022/127561
Other languages
French (fr)
Chinese (zh)
Inventor
丁磊
贺海林
Original Assignee
华人运通(上海)云计算科技有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 华人运通(上海)云计算科技有限公司 filed Critical 华人运通(上海)云计算科技有限公司
Publication of WO2023082994A1 publication Critical patent/WO2023082994A1/en

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking

Definitions

  • the present invention relates to the technical field of data rendering, in particular to a page rendering method, device, terminal equipment and computer storage medium.
  • the technical problem to be solved by the embodiments of the present invention is to provide a page rendering method, device, terminal equipment and computer storage medium, which supports multi-terminal different data, and is applicable to modules containing complex data sources and complex control style combinations, and can be used for Different control styles from multiple data sources are rendered, and the page rendering methods are diverse and changeable, which is more convenient for promotion.
  • an embodiment of the present invention provides a page rendering method, including:
  • the target page includes at least one control
  • each control data is loaded into the corresponding control style template, and the control renders Finish;
  • the data type of the control data is multi-terminal data
  • the corresponding control style template is matched from the preset control style template library, which also includes :
  • the method also includes:
  • the matching of the corresponding control style templates from the preset control style template library according to each of the control data specifically includes:
  • the acquisition of the style ID of each control is specifically:
  • the calculation of the style ID according to the length of the control data of the control specifically includes:
  • the style of the control is a text box, and then the style ID is obtained through data feature analysis and data selection analysis;
  • the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control
  • the style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
  • the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
  • the preset control style template library supports dynamic addition or deletion of control style templates.
  • An embodiment of the present invention also provides a page rendering device, including:
  • An acquisition module configured to acquire page data of a target page; wherein, the target page includes at least one control;
  • a parsing module configured to parse the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
  • a loading module configured to match each control data from a preset control style template library to a corresponding control style template, and load each control data to the corresponding control style template, Then the rendering of the control is completed;
  • Judging module used to judge whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, return to the step of parsing the page data, and render the next control until all the controls are rendered completed, the rendering of the target page is completed.
  • An embodiment of the present invention also provides a terminal device, including a processor, a memory, and a computer program stored in the memory and configured to be executed by the processor.
  • a terminal device including a processor, a memory, and a computer program stored in the memory and configured to be executed by the processor.
  • the processor executes the computer program, the above-mentioned The page rendering method described in any one.
  • An embodiment of the present invention also provides a computer-readable storage medium, the computer-readable storage medium includes a stored computer program, wherein, when the computer program is running, the device where the computer-readable storage medium is located is controlled to perform any of the above tasks.
  • a described page rendering method is also provided.
  • the beneficial effects of the page rendering method, device, terminal device and computer storage medium are: by acquiring the page data of the target page; wherein, the target page includes at least one control; Parsing the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data; Match the control style template corresponding to it, load each control data to the control style template corresponding to it, then the rendering of the control is completed; judge whether the disassembly of the page data is completed, if so, then the The rendering of the target page is completed; if not, return to the step of parsing the data of the page, and render the next control until all controls are rendered, then the rendering of the target page is completed.
  • the embodiment of the present invention supports multi-terminal different data, is applicable to modules containing complex data sources and complex control style combinations, and can render different control styles of multiple data sources, and the page rendering methods are diverse and changeable, which is more convenient for promotion
  • FIG. 1 is a schematic flowchart of a preferred embodiment of a page rendering method provided by the present invention
  • Fig. 2 is a schematic flow chart of multi-terminal data fusion in a page rendering method provided by the present invention
  • Fig. 3 is a schematic flow chart of control style matching in a page rendering method provided by the present invention.
  • Fig. 4 is a schematic flow chart of calculating a control style ID in a page rendering method provided by the present invention
  • Fig. 5 is a schematic structural diagram of a preferred embodiment of a page rendering device provided by the present invention.
  • Fig. 6 is a schematic structural diagram of a preferred embodiment of a terminal device provided by the present invention.
  • FIG. 1 is a schematic flowchart of a preferred embodiment of a page rendering method provided by the present invention.
  • the page rendering method includes:
  • S1 acquiring page data of a target page; wherein, the target page includes at least one control;
  • control data type of the control data includes multi-terminal data and cloud data
  • this embodiment first obtains the overall page data of the target page from the cloud.
  • the target page includes at least one control.
  • the page data is analyzed to obtain the control data of at least one control.
  • the data types of the control data include multi-terminal data and cloud data. data. If the data type of the control data is multi-terminal data, the multi-terminal data is loaded from the multi-terminal data loader, and the multi-terminal data can be used together with cloud data or not. If the data type of the control data is cloud data, fusion processing is not required. Then, according to each control data is matched from the preset control style template library to its corresponding control style template, each control data is loaded into its corresponding control style template, and the rendering of the control is completed.
  • control data can be pre-delivered through the cloud and then rendered to the control; it can also be obtained from each data source module and then rendered to the control; The data sent by the configuration is fused with the data obtained from each data source module, and then rendered to the control.
  • This embodiment supports multi-terminal different data, is applicable to modules with complex data sources and complex control style combinations, and can render different control styles of multiple data sources.
  • the page rendering methods are diverse and changeable, which is more convenient for promotion.
  • the data source and the control style template are loaded separately, the coupling between the data and the control can be greatly reduced.
  • control style template is matched from the preset control style template library, before Also includes:
  • the method also includes:
  • FIG. 2 is a schematic flowchart of multi-terminal data fusion in a page rendering method provided by the present invention.
  • the control data can be pre-delivered through the cloud, and then rendered to the control; it can also be obtained from each data source module, and then rendered to the control; at the same time, the data can also be pre-delivered by the cloud It is fused with the data obtained from each data source module, and then rendered to the control. If the data type of the control data is multi-terminal data, match the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data, and load the data in the data source module.
  • each data source module Since the data structure on each data source module is different, it is necessary to analyze the data in the data source module according to the unified multi-terminal data template issued by the cloud, and load the data into the multi-terminal data template after the analysis is completed. After the loading of the multi-terminal data is completed, it is judged whether the multi-terminal data needs to be fused; if so, the multi-terminal data and the cloud data are fused to obtain the fused data; and the legality of the fused data is verified. If the verification passes, the fused data is legal data. If the verification fails, the fused data is abnormal data.
  • data source modules in the multi-terminal data loader in this embodiment can be expanded, and are not limited to navigation modules, music modules, telephone modules and fragrance modules.
  • the matching from the preset control style template library to the corresponding control style template according to each control data specifically includes:
  • FIG. 3 is a schematic flowchart of control style matching in a page rendering method provided by the present invention. Firstly, analyze the data structure of each control data, and obtain the style ID of each control. Then enter the control style template selector, and match the corresponding control style template from the preset control style template library according to the style ID. Then dynamically preload the control style, and finally load the page data and page style in sequence to complete the page rendering.
  • the acquisition of the style ID of each control is specifically:
  • the style ID of the control supports two generation methods, one is cloud preset, and the other is dynamically generated according to control data. If the control specifies a style ID, the style ID specified by the control is obtained directly from the cloud; if the control does not specify a style ID, the style ID is calculated according to the length of the control data of the control.
  • the calculating the style ID according to the length of the control data of the control specifically includes:
  • the style of the control is a text box, and then the style ID is obtained through data characteristic analysis and data selected item analysis;
  • the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control
  • the style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
  • the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
  • FIG. 4 is a schematic flowchart of calculating a control style ID in a page rendering method provided by the present invention.
  • the control data may consist of one piece or multiple pieces, which is an array, so the control template can be preliminarily determined according to the length of the data.
  • the style of the control is a text box, and then the style ID is obtained through data feature analysis and data selection analysis; if the length of the control data meets the second preset Length condition, that is, if the length is greater than 2 and less than or equal to 5, the style of the control is tab or drag bar; continue to judge whether the size of the control data is greater than the width of the control, if so, determine the style of the control as a sliding list, drag bar or Multi-selection box, and then obtain the style ID through data feature analysis and data selected item analysis; if not, directly obtain the style ID through data feature analysis and data selected item analysis; if the data length of the control data satisfies the third preset length condition, That is, if the length is greater than 5 and less than or equal to 10, the style of the control is a sliding list, drag bar or multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
  • the third preset length condition That is, if the length is greater than 5 and less than or equal
  • Data feature analysis that is, if the data is in a time format, it is a time control, and if it is a pure number, it is a drag bar, etc. If the data option is multi-selection, it is a multi-selection box, otherwise it may be a sliding list or a scrolling list.
  • the preset control style template library supports dynamic addition or deletion of control style templates.
  • control style template library provides a wealth of control templates, such as: text boxes, scrolling lists, tabs, drag bars, time, multi-select boxes, sliding lists, etc., and data can be displayed in different control templates. data content.
  • control style template library supports dynamic addition or deletion of control template styles, which has good scalability.
  • the present invention also provides a page rendering device capable of implementing all processes of the page rendering method in the foregoing embodiments.
  • FIG. 5 is a schematic structural diagram of a preferred embodiment of a page rendering device provided by the present invention.
  • the page rendering device includes:
  • An acquisition module 501 configured to acquire page data of a target page; wherein, the target page includes at least one control;
  • a parsing module 502 configured to parse the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
  • the loading module 503 is configured to match each of the control data from the preset control style template library to the corresponding control style template, and load each of the control data to the corresponding control style template , the rendering of the control is completed;
  • Judgment module 504 for judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then return to the step of parsing the page data, and perform the rendering of the next control until all controls After the rendering is completed, the rendering of the target page is completed.
  • the loading module 503 matches the control style template corresponding to it from the preset control style template library according to each of the control data. include:
  • the device is also used for:
  • the loading module 503 matches the corresponding control style template from the preset control style template library according to each control data, specifically including:
  • the acquiring the style ID of each control is specifically:
  • the calculating the style ID according to the length of the control data of the control specifically includes:
  • the style of the control is a text box, and then the style ID is obtained through data characteristic analysis and data selected item analysis;
  • the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control
  • the style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
  • the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
  • the preset control style template library supports dynamic addition or deletion of control style templates.
  • FIG. 6 is a schematic structural diagram of a preferred embodiment of a terminal device provided by the present invention.
  • the terminal device includes a processor 601, a memory 602, and a computer program stored in the memory 602 and configured to be executed by the processor 601.
  • the processor 601 executes the computer program, any of the above-mentioned implementations can be realized
  • the computer program can be divided into one or more modules/units (such as computer program 1, computer program 2, ...), and the one or more modules/units are stored in the memory 602, And be executed by the processor 601 to complete the present invention.
  • the one or more modules/units may be a series of computer program instruction segments capable of accomplishing specific functions, and the instruction segments are used to describe the execution process of the computer program in the terminal device.
  • the processor 601 can be a central processing unit (Central Processing Unit, CPU), and can also be other general-purpose processors, digital signal processors (Digital Signal Processor, DSP), application specific integrated circuits (Application Specific Integrated Circuit, ASIC), Field-Programmable Gate Array (Field-Programmable GateArray, FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc.
  • the general-purpose processor can be a microprocessor, or the processor 601 can also be Any conventional processor, the processor 601 is the control center of the terminal device, and uses various interfaces and lines to connect various parts of the terminal device.
  • the memory 602 mainly includes a program storage area and a data storage area, wherein the program storage area can store an operating system, an application program required by at least one function, etc., and the data storage area can store related data and the like.
  • the memory 602 can be a high-speed random access memory, or a non-volatile memory, such as a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card and a flash memory Card (Flash Card), etc., or the memory 602 may also be other volatile solid-state storage devices.
  • the above-mentioned terminal device may include, but not limited to, a processor and a memory.
  • a processor may include, but not limited to, a central processing unit (CPU)
  • a memory may include, but not limited to, a central processing unit (CPU)
  • FIG. 6 is only an example of the above-mentioned terminal device, and does not constitute a limitation on the above-mentioned terminal device. More or fewer components than shown, or combinations of certain components, or different components may be included.
  • An embodiment of the present invention also provides a computer-readable storage medium, the computer-readable storage medium includes a stored computer program, wherein, when the computer program is running, the device where the computer-readable storage medium is located is controlled to perform any of the above tasks.
  • Embodiments of the present invention provide a page rendering method, device, terminal equipment, and computer storage medium, by obtaining page data of a target page; wherein, the target page includes at least one control; and parsing the page data to obtain at least A control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data; according to each control data, it is matched to the corresponding control style template from the preset control style template library, Loading each of the control data to the corresponding control style template, the rendering of the control is completed; judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then In the return step, the page data is analyzed, and the next control is rendered until all controls are rendered, and the target page is rendered.
  • the embodiment of the present invention supports multi-terminal different data, is applicable to modules containing complex data sources and complex control style combinations, and can render different control styles of multiple data sources, and the page rendering methods are diverse and change
  • the system embodiments described above are only illustrative, and the units described as separate components may or may not be physically separated, and the components shown as units may or may not be physically separated.
  • a unit can be located in one place, or it can be distributed to multiple network units. Part or all of the modules can be selected according to actual needs to achieve the purpose of the solution of this embodiment.
  • the connection relationship between the modules indicates that they have communication connections, which can be specifically implemented as one or more communication buses or signal lines. It can be understood and implemented by those skilled in the art without creative effort.

Landscapes

  • Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Data Mining & Analysis (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Document Processing Apparatus (AREA)
  • Record Information Processing For Printing (AREA)

Abstract

Disclosed in the present invention are a page rendering method and apparatus, and a terminal device and a computer storage medium. The method comprises: acquiring page data of a target page; parsing the page data to obtain control data of at least one control, wherein the data type of the control data comprises multi-terminal data and cloud data; according to each piece of control data, matching, in a preset control style template library, a control style template corresponding to each piece of control data, and loading each piece of control data to the control style template corresponding thereto, thus completing the rendering of the control; and determining whether the disassembly of the page data is completed, and if so, completing the rendering of the target page, and if not, returning to the step of parsing the page data, and rendering the next control until the rendering of all the controls is completed, thus completing the rendering of the target page. The present invention can be applicable to modules including complicated data sources and complicated control style combinations, and can render different control styles of various data sources, such that page rendering modes are diversified and changeable.

Description

一种页面渲染方法、装置、终端设备及计算机存储介质A page rendering method, device, terminal equipment and computer storage medium 技术领域technical field
本发明涉及数据渲染技术领域，尤其涉及一种页面渲染方法、装置、终端设备及计算机存储介质。The present invention relates to the technical field of data rendering, in particular to a page rendering method, device, terminal equipment and computer storage medium.
背景技术Background technique
目前在对页面进行渲染时，通常是对云端预置的数据直接渲染或者是对本地一个功能模块的数据进行渲染，且数据页面渲染方式单一不可更改，使得不能基于多种数据源的不同控件样式进行渲染，故需要一种基于多种数据源的不同控件样式的页面渲染方法。At present, when rendering a page, it usually renders the data preset in the cloud directly or renders the data of a local functional module, and the data page rendering method is single and cannot be changed, so that different control styles based on multiple data sources cannot be used. Therefore, a page rendering method with different control styles based on multiple data sources is required.
发明内容Contents of the invention
本发明实施例所要解决的技术问题在于，提供一种页面渲染方法、装置、终端设备及计算机存储介质，支持多端的不同数据，可适用于含有复杂数据源以及复杂控件样式组合的模块，可对多种数据源的不同控件样式进行渲染，页面渲染方式多样且可更改，更便于推广。The technical problem to be solved by the embodiments of the present invention is to provide a page rendering method, device, terminal equipment and computer storage medium, which supports multi-terminal different data, and is applicable to modules containing complex data sources and complex control style combinations, and can be used for Different control styles from multiple data sources are rendered, and the page rendering methods are diverse and changeable, which is more convenient for promotion.
为了实现上述目的，本发明实施例提供了一种页面渲染方法，包括：In order to achieve the above purpose, an embodiment of the present invention provides a page rendering method, including:
获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；Obtain page data of the target page; wherein, the target page includes at least one control;
对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；Analyzing the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；According to the matching of each control data from the preset control style template library to the corresponding control style template, each control data is loaded into the corresponding control style template, and the control renders Finish;
判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。Judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then return to the step of parsing the page data, and perform the rendering of the next control until all the control rendering is completed, then the The target page is rendered.
作为上述方案的改进，若所述控件数据的数据类型为多端数据，则所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，之前还包括：As an improvement of the above solution, if the data type of the control data is multi-terminal data, then according to each of the control data, the corresponding control style template is matched from the preset control style template library, which also includes :
根据所述多端数据的唯一标识符从多端数据加载器中匹配相对应的数据源模块；matching the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data;
加载所述数据源模块中的数据，并根据预设的多端数据模板对所述数据源模块中的数据进行解析和装载。Load the data in the data source module, and analyze and load the data in the data source module according to the preset multi-terminal data template.
作为上述方案的改进，所述方法还包括：As an improvement of the above scheme, the method also includes:
判断所述多端数据是否需要融合；judging whether the multi-terminal data needs to be fused;
若是，则将所述多端数据和云端数据进行数据融合，得到融合数据；If so, performing data fusion on the multi-terminal data and cloud data to obtain fusion data;
对所述融合数据的合法性进行校验。Check the validity of the fusion data.
作为上述方案的改进，所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，具体包括：As an improvement to the above solution, the matching of the corresponding control style templates from the preset control style template library according to each of the control data specifically includes:
对每一所述控件数据进行数据结构解析；Analyzing the data structure of each control data;
获取每一所述控件的样式ID；Acquiring the style ID of each said control;
根据所述样式ID从预设的控件样式模板库中匹配相对应的控件样式模板。Match the corresponding control style template from the preset control style template library according to the style ID.
作为上述方案的改进，所述获取每一所述控件的样式ID，具体为：As an improvement of the above solution, the acquisition of the style ID of each control is specifically:
判断所述控件是否指定样式ID，若是，则从云端直接获取所述控件指定的样式ID，若否，则根据所述控件的控件数据的长度计算样式ID。Judging whether the control specifies a style ID, if yes, directly obtain the style ID specified by the control from the cloud, if not, calculate the style ID according to the length of the control data of the control.
作为上述方案的改进，所述根据所述控件的控件数据的长度计算样式ID，具体包括：As an improvement of the above solution, the calculation of the style ID according to the length of the control data of the control specifically includes:
若所述控件数据的长度满足第一预设长度条件，则所述控件的样式为文本框， 再通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the first preset length condition, the style of the control is a text box, and then the style ID is obtained through data feature analysis and data selection analysis;
若所述控件数据的长度满足第二预设长度条件，则所述控件的样式为tab或拖动条；判断所述控件数据的尺寸是否大于所述控件的宽度，若是，则判定所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID；若否，则直接通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the second preset length condition, the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control The style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
若所述控件数据的数据长度满足第三预设长度条件，则所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID。If the data length of the control data satisfies the third preset length condition, the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
作为上述方案的改进，所述预设的控件样式模板库支持动态的增添或删除控件样式模板。As an improvement to the above solution, the preset control style template library supports dynamic addition or deletion of control style templates.
本发明实施例还提供了一种页面渲染装置，包括：An embodiment of the present invention also provides a page rendering device, including:
获取模块，用于获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；An acquisition module, configured to acquire page data of a target page; wherein, the target page includes at least one control;
解析模块，用于对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；A parsing module, configured to parse the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
装载模块，用于根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；A loading module, configured to match each control data from a preset control style template library to a corresponding control style template, and load each control data to the corresponding control style template, Then the rendering of the control is completed;
判断模块，用于判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。Judging module, used to judge whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, return to the step of parsing the page data, and render the next control until all the controls are rendered completed, the rendering of the target page is completed.
本发明实施例还提供了一种终端设备，包括处理器、存储器以及存储在所述存储器中且被配置为由所述处理器执行的计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述的页面渲染方法。An embodiment of the present invention also provides a terminal device, including a processor, a memory, and a computer program stored in the memory and configured to be executed by the processor. When the processor executes the computer program, the above-mentioned The page rendering method described in any one.
本发明实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质包括存储的计算机程序，其中，在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行上述任一项所述的页面渲染方法。An embodiment of the present invention also provides a computer-readable storage medium, the computer-readable storage medium includes a stored computer program, wherein, when the computer program is running, the device where the computer-readable storage medium is located is controlled to perform any of the above tasks. A described page rendering method.
相对于现有技术，本发明实施例提供的一种页面渲染方法、装置、终端设备及计算机存储介质的有益效果在于：通过获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。本发明实施例支持多端的不同数据，可适用于含有复杂数据源以及复杂控件样式组合的模块，可对多种数据源的不同控件样式进行渲染，页面渲染方式多样且可更改，更便于推广。Compared with the prior art, the beneficial effects of the page rendering method, device, terminal device and computer storage medium provided by the embodiments of the present invention are: by acquiring the page data of the target page; wherein, the target page includes at least one control; Parsing the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data; Match the control style template corresponding to it, load each control data to the control style template corresponding to it, then the rendering of the control is completed; judge whether the disassembly of the page data is completed, if so, then the The rendering of the target page is completed; if not, return to the step of parsing the data of the page, and render the next control until all controls are rendered, then the rendering of the target page is completed. The embodiment of the present invention supports multi-terminal different data, is applicable to modules containing complex data sources and complex control style combinations, and can render different control styles of multiple data sources, and the page rendering methods are diverse and changeable, which is more convenient for promotion.
附图说明Description of drawings
图1是本发明提供的一种页面渲染方法的一个优选实施例的流程示意图；FIG. 1 is a schematic flowchart of a preferred embodiment of a page rendering method provided by the present invention;
图2是本发明提供的一种页面渲染方法中多端数据融合的流程示意图；Fig. 2 is a schematic flow chart of multi-terminal data fusion in a page rendering method provided by the present invention;
图3是本发明提供的一种页面渲染方法中控件样式匹配的流程示意图；Fig. 3 is a schematic flow chart of control style matching in a page rendering method provided by the present invention;
图4是本发明提供的一种页面渲染方法中计算控件样式ID的流程示意图；Fig. 4 is a schematic flow chart of calculating a control style ID in a page rendering method provided by the present invention;
图5是本发明提供的一种页面渲染装置的一个优选实施例的结构示意图；Fig. 5 is a schematic structural diagram of a preferred embodiment of a page rendering device provided by the present invention;
图6是本发明提供的一种终端设备的一个优选实施例的结构示意图。Fig. 6 is a schematic structural diagram of a preferred embodiment of a terminal device provided by the present invention.
具体实施方式Detailed ways
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的 实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。The following will clearly and completely describe the technical solutions in the embodiments of the present invention in conjunction with the accompanying drawings in the embodiments of the present invention. Obviously, the described embodiments are only some of the embodiments of the present invention, not all of them. Based on the embodiments of the present invention, all other embodiments obtained by persons of ordinary skill in the art without creative efforts fall within the protection scope of the present invention.
请参阅图1，图1是本发明提供的一种页面渲染方法的一个优选实施例的流程示意图。所述页面渲染方法，包括：Please refer to FIG. 1 . FIG. 1 is a schematic flowchart of a preferred embodiment of a page rendering method provided by the present invention. The page rendering method includes:
S1，获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；S1, acquiring page data of a target page; wherein, the target page includes at least one control;
S2，对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；S2, analyzing the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
S3，根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；S3. According to matching each control data from the preset control style template library to the corresponding control style template, loading each control data to the corresponding control style template, then the Control rendering is complete;
S4，判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。S4, judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, return to the step of parsing the page data, and render the next control until all the control rendering is completed, then The rendering of the target page is completed.
具体的，本实施例首先从云端获取目标页面的整体页面数据，该目标页面包括至少一个控件，对该页面数据进行解析，得到至少一个控件的控件数据，控件数据的数据类型包括多端数据和云端数据。若控件数据的数据类型为多端数据，则从多端数据加载器中加载多端数据，该多端数据可以选择与云端数据一起融合使用，也可以不融合使用。若控件数据的数据类型为云端数据，则不需要融合处理。然后，根据每一控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一控件数据装载至与其相对应的控件样式模板，则控件渲染完成。最后，判断页面数据是否拆解完成，若是，则目标页面渲染完成；若否，则返回步骤对页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则目标页面渲染完成。Specifically, this embodiment first obtains the overall page data of the target page from the cloud. The target page includes at least one control. The page data is analyzed to obtain the control data of at least one control. The data types of the control data include multi-terminal data and cloud data. data. If the data type of the control data is multi-terminal data, the multi-terminal data is loaded from the multi-terminal data loader, and the multi-terminal data can be used together with cloud data or not. If the data type of the control data is cloud data, fusion processing is not required. Then, according to each control data is matched from the preset control style template library to its corresponding control style template, each control data is loaded into its corresponding control style template, and the rendering of the control is completed. Finally, it is judged whether the disassembly of the page data is completed. If yes, the rendering of the target page is completed; if not, return to the step of parsing the page data, and render the next control until all controls are rendered, then the rendering of the target page is completed.
需要说明的是，本实施例中控件数据可以单一通过云端预置下发，然后渲染到控件上；也可以单一通过从各个数据源模块上获取，然后渲染到控件上；同时 还可以由云端预置下发的数据和从各个数据源模块上获取的数据融合，然后渲染到控件上。It should be noted that in this embodiment, the control data can be pre-delivered through the cloud and then rendered to the control; it can also be obtained from each data source module and then rendered to the control; The data sent by the configuration is fused with the data obtained from each data source module, and then rendered to the control.
本实施例支持多端的不同数据，可适用于含有复杂数据源以及复杂控件样式组合的模块，可对多种数据源的不同控件样式进行渲染，页面渲染方式多样且可更改，更便于推广。并且，由于数据源和控件样式模板是分开加载的，因此可以使得数据和控件之间的耦合性大大降低。This embodiment supports multi-terminal different data, is applicable to modules with complex data sources and complex control style combinations, and can render different control styles of multiple data sources. The page rendering methods are diverse and changeable, which is more convenient for promotion. Moreover, since the data source and the control style template are loaded separately, the coupling between the data and the control can be greatly reduced.
在另一个优选实施例中，若所述控件数据的数据类型为多端数据，则所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，之前还包括：In another preferred embodiment, if the data type of the control data is multi-terminal data, then according to each of the control data, the corresponding control style template is matched from the preset control style template library, before Also includes:
根据所述多端数据的唯一标识符从多端数据加载器中匹配相对应的数据源模块；matching the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data;
加载所述数据源模块中的数据，并根据预设的多端数据模板对所述数据源模块中的数据进行解析和装载。Load the data in the data source module, and analyze and load the data in the data source module according to the preset multi-terminal data template.
在另一个优选实施例中，所述方法还包括：In another preferred embodiment, the method also includes:
判断所述多端数据是否需要融合；judging whether the multi-terminal data needs to be fused;
若是，则将所述多端数据和云端数据进行数据融合，得到融合数据；If so, performing data fusion on the multi-terminal data and cloud data to obtain fusion data;
对所述融合数据的合法性进行校验。Check the validity of the fusion data.
具体的，请参阅图2，图2是本发明提供的一种页面渲染方法中多端数据融合的流程示意图。本实施例中控件数据可以单一通过云端预置下发，然后渲染到控件上；也可以单一通过从各个数据源模块上获取，然后渲染到控件上；同时还可以由云端预置下发的数据和从各个数据源模块上获取的数据融合，然后渲染到控件上。若控件数据的数据类型为多端数据，则根据多端数据的唯一标识符从多端数据加载器中匹配相对应的数据源模块，加载该数据源模块中的数据。由于每个数据源模块上的数据结构不一样，因此，需要按照云端下发的统一的多端数据模板对数据源模块中的数据进行解析，解析完成后将数据装载到多端数据模板中。 多端数据装载完成后，判断该多端数据是否需要融合；若是，则将多端数据和云端数据进行数据融合，得到融合数据；并对融合数据的合法性进行校验。若校验通过，则该融合数据为合法的数据。若校验未通过，则该融合数据为异常数据。Specifically, please refer to FIG. 2 . FIG. 2 is a schematic flowchart of multi-terminal data fusion in a page rendering method provided by the present invention. In this embodiment, the control data can be pre-delivered through the cloud, and then rendered to the control; it can also be obtained from each data source module, and then rendered to the control; at the same time, the data can also be pre-delivered by the cloud It is fused with the data obtained from each data source module, and then rendered to the control. If the data type of the control data is multi-terminal data, match the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data, and load the data in the data source module. Since the data structure on each data source module is different, it is necessary to analyze the data in the data source module according to the unified multi-terminal data template issued by the cloud, and load the data into the multi-terminal data template after the analysis is completed. After the loading of the multi-terminal data is completed, it is judged whether the multi-terminal data needs to be fused; if so, the multi-terminal data and the cloud data are fused to obtain the fused data; and the legality of the fused data is verified. If the verification passes, the fused data is legal data. If the verification fails, the fused data is abnormal data.
需要说明的是，本实施例中多端数据加载器中的数据源模块是可以扩展的，不限于导航模块、音乐模块、电话模块和香氛模块。It should be noted that the data source modules in the multi-terminal data loader in this embodiment can be expanded, and are not limited to navigation modules, music modules, telephone modules and fragrance modules.
在又一个优选实施例中，所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，具体包括：In yet another preferred embodiment, the matching from the preset control style template library to the corresponding control style template according to each control data specifically includes:
对每一所述控件数据进行数据结构解析；Analyzing the data structure of each control data;
获取每一所述控件的样式ID；Acquiring the style ID of each said control;
根据所述样式ID从预设的控件样式模板库中匹配相对应的控件样式模板。Match the corresponding control style template from the preset control style template library according to the style ID.
具体的，请参阅图3，图3是本发明提供的一种页面渲染方法中控件样式匹配的流程示意图。首先，对每一控件数据进行数据结构解析，并获取每一控件的样式ID。之后输入控件样式模板选择器，根据样式ID从预设的控件样式模板库中匹配相对应的控件样式模板。再进行控件样式动态预加载，最后依次进行页面数据装载、页面样式装载，即可完成页面渲染。Specifically, please refer to FIG. 3 . FIG. 3 is a schematic flowchart of control style matching in a page rendering method provided by the present invention. Firstly, analyze the data structure of each control data, and obtain the style ID of each control. Then enter the control style template selector, and match the corresponding control style template from the preset control style template library according to the style ID. Then dynamically preload the control style, and finally load the page data and page style in sequence to complete the page rendering.
在又一个优选实施例中，所述获取每一所述控件的样式ID，具体为：In yet another preferred embodiment, the acquisition of the style ID of each control is specifically:
判断所述控件是否指定样式ID，若是，则从云端直接获取所述控件指定的样式ID，若否，则根据所述控件的控件数据的长度计算样式ID。Judging whether the control specifies a style ID, if yes, directly obtain the style ID specified by the control from the cloud, if not, calculate the style ID according to the length of the control data of the control.
具体的，控件的样式ID支持支持两种生成方式，一种是云端预置，另一种是根据控件数据动态生成。若控件指定样式ID，则从云端直接获取该控件指定的样式ID；若控件未指定样式ID，则根据该控件的控件数据的长度计算样式ID。Specifically, the style ID of the control supports two generation methods, one is cloud preset, and the other is dynamically generated according to control data. If the control specifies a style ID, the style ID specified by the control is obtained directly from the cloud; if the control does not specify a style ID, the style ID is calculated according to the length of the control data of the control.
在又一个优选实施例中，所述根据所述控件的控件数据的长度计算样式ID，具体包括：In yet another preferred embodiment, the calculating the style ID according to the length of the control data of the control specifically includes:
若所述控件数据的长度满足第一预设长度条件，则所述控件的样式为文本框，再通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the first preset length condition, the style of the control is a text box, and then the style ID is obtained through data characteristic analysis and data selected item analysis;
若所述控件数据的长度满足第二预设长度条件，则所述控件的样式为tab或拖动条；判断所述控件数据的尺寸是否大于所述控件的宽度，若是，则判定所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID；若否，则直接通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the second preset length condition, the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control The style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
若所述控件数据的数据长度满足第三预设长度条件，则所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID。If the data length of the control data satisfies the third preset length condition, the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
具体的，请参阅图4，图4是本发明提供的一种页面渲染方法中计算控件样式ID的流程示意图。控件数据可能是一条，也可能是由多条组成，是一个数组，因此可以根据数据的长度初步判定控件模板。若控件数据的长度满足第一预设长度条件，即长度等于1，则控件的样式为文本框，再通过数据特征分析和数据选中项分析得到样式ID；若控件数据的长度满足第二预设长度条件，即长度大于2且小于等于5，则控件的样式为tab或拖动条；继续判断控件数据的尺寸是否大于控件的宽度，若是，则判定控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到样式ID；若否，则直接通过数据特征分析和数据选中项分析得到样式ID；若控件数据的数据长度满足第三预设长度条件，即长度大于5且小于等于10，则控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到样式ID。数据特征分析，即如数据是时间格式，则是时间控件，如果是纯数字，则是拖动条等。如果数据选项是多选方式，则为多选框，否则可能为滑动列表或者滚动列表等。Specifically, please refer to FIG. 4 . FIG. 4 is a schematic flowchart of calculating a control style ID in a page rendering method provided by the present invention. The control data may consist of one piece or multiple pieces, which is an array, so the control template can be preliminarily determined according to the length of the data. If the length of the control data meets the first preset length condition, that is, the length is equal to 1, then the style of the control is a text box, and then the style ID is obtained through data feature analysis and data selection analysis; if the length of the control data meets the second preset Length condition, that is, if the length is greater than 2 and less than or equal to 5, the style of the control is tab or drag bar; continue to judge whether the size of the control data is greater than the width of the control, if so, determine the style of the control as a sliding list, drag bar or Multi-selection box, and then obtain the style ID through data feature analysis and data selected item analysis; if not, directly obtain the style ID through data feature analysis and data selected item analysis; if the data length of the control data satisfies the third preset length condition, That is, if the length is greater than 5 and less than or equal to 10, the style of the control is a sliding list, drag bar or multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis. Data feature analysis, that is, if the data is in a time format, it is a time control, and if it is a pure number, it is a drag bar, etc. If the data option is multi-selection, it is a multi-selection box, otherwise it may be a sliding list or a scrolling list.
作为优选方案，所述预设的控件样式模板库支持动态的增添或删除控件样式模板。As a preferred solution, the preset control style template library supports dynamic addition or deletion of control style templates.
具体的，控件样式模板库提供了丰富的控件模板，例如：文本框、滚动列表、tab、拖动条、时间、多选框、滑动列表等，数据可以通过在不同的控件模板上展 示不同的数据内容。同时，控件样式模板库支持动态的增添或删除控件模板样式，具有良好的扩展性。Specifically, the control style template library provides a wealth of control templates, such as: text boxes, scrolling lists, tabs, drag bars, time, multi-select boxes, sliding lists, etc., and data can be displayed in different control templates. data content. At the same time, the control style template library supports dynamic addition or deletion of control template styles, which has good scalability.
相应地，本发明还提供一种页面渲染装置，能够实现上述实施例中的页面渲染方法的所有流程。Correspondingly, the present invention also provides a page rendering device capable of implementing all processes of the page rendering method in the foregoing embodiments.
请参阅图5，图5是本发明提供的一种页面渲染装置的一个优选实施例的结构示意图。所述页面渲染装置，包括：Please refer to FIG. 5 . FIG. 5 is a schematic structural diagram of a preferred embodiment of a page rendering device provided by the present invention. The page rendering device includes:
获取模块501，用于获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；An acquisition module 501, configured to acquire page data of a target page; wherein, the target page includes at least one control;
解析模块502，用于对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；A parsing module 502, configured to parse the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
装载模块503，用于根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；The loading module 503 is configured to match each of the control data from the preset control style template library to the corresponding control style template, and load each of the control data to the corresponding control style template , the rendering of the control is completed;
判断模块504，用于判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。 Judgment module 504, for judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then return to the step of parsing the page data, and perform the rendering of the next control until all controls After the rendering is completed, the rendering of the target page is completed.
优选地，若所述控件数据的数据类型为多端数据，则所述装载模块503中根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，之前还包括：Preferably, if the data type of the control data is multi-terminal data, the loading module 503 matches the control style template corresponding to it from the preset control style template library according to each of the control data. include:
根据所述多端数据的唯一标识符从多端数据加载器中匹配相对应的数据源模块；matching the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data;
加载所述数据源模块中的数据，并根据预设的多端数据模板对所述数据源模块中的数据进行解析和装载。Load the data in the data source module, and analyze and load the data in the data source module according to the preset multi-terminal data template.
优选地，所述装置还用于：Preferably, the device is also used for:
判断所述多端数据是否需要融合；judging whether the multi-terminal data needs to be fused;
若是，则将所述多端数据和云端数据进行数据融合，得到融合数据；If so, performing data fusion on the multi-terminal data and cloud data to obtain fusion data;
对所述融合数据的合法性进行校验。Check the validity of the fusion data.
优选地，所述装载模块503中根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，具体包括：Preferably, the loading module 503 matches the corresponding control style template from the preset control style template library according to each control data, specifically including:
对每一所述控件数据进行数据结构解析；Analyzing the data structure of each control data;
获取每一所述控件的样式ID；Acquiring the style ID of each said control;
根据所述样式ID从预设的控件样式模板库中匹配相对应的控件样式模板。Match the corresponding control style template from the preset control style template library according to the style ID.
优选地，所述获取每一所述控件的样式ID，具体为：Preferably, the acquiring the style ID of each control is specifically:
判断所述控件是否指定样式ID，若是，则从云端直接获取所述控件指定的样式ID，若否，则根据所述控件的控件数据的长度计算样式ID。Judging whether the control specifies a style ID, if yes, directly obtain the style ID specified by the control from the cloud, if not, calculate the style ID according to the length of the control data of the control.
优选地，所述根据所述控件的控件数据的长度计算样式ID，具体包括：Preferably, the calculating the style ID according to the length of the control data of the control specifically includes:
若所述控件数据的长度满足第一预设长度条件，则所述控件的样式为文本框，再通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the first preset length condition, the style of the control is a text box, and then the style ID is obtained through data characteristic analysis and data selected item analysis;
若所述控件数据的长度满足第二预设长度条件，则所述控件的样式为tab或拖动条；判断所述控件数据的尺寸是否大于所述控件的宽度，若是，则判定所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID；若否，则直接通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the second preset length condition, the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control The style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, then the style ID is obtained directly through data feature analysis and data selection item analysis;
若所述控件数据的数据长度满足第三预设长度条件，则所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID。If the data length of the control data satisfies the third preset length condition, the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
优选地，所述预设的控件样式模板库支持动态的增添或删除控件样式模板。Preferably, the preset control style template library supports dynamic addition or deletion of control style templates.
请参阅图6，图6是本发明提供的一种终端设备的一个优选实施例的结构示意图。所述终端设备包括处理器601、存储器602以及存储在所述存储器602中且被配置为由所述处理器601执行的计算机程序，所述处理器601执行所述计算 机程序时实现上述任一实施例所述的基于多种数据源的不同控件样式的渲染方法。Please refer to FIG. 6 . FIG. 6 is a schematic structural diagram of a preferred embodiment of a terminal device provided by the present invention. The terminal device includes a processor 601, a memory 602, and a computer program stored in the memory 602 and configured to be executed by the processor 601. When the processor 601 executes the computer program, any of the above-mentioned implementations can be realized The rendering method of different control styles based on multiple data sources described in the example.
优选地，所述计算机程序可以被分割成一个或多个模块/单元(如计算机程序1、计算机程序2、……)，所述一个或者多个模块/单元被存储在所述存储器602中，并由所述处理器601执行，以完成本发明。所述一个或多个模块/单元可以是能够完成特定功能的一系列计算机程序指令段，该指令段用于描述所述计算机程序在所述终端设备中的执行过程。Preferably, the computer program can be divided into one or more modules/units (such as computer program 1, computer program 2, ...), and the one or more modules/units are stored in the memory 602, And be executed by the processor 601 to complete the present invention. The one or more modules/units may be a series of computer program instruction segments capable of accomplishing specific functions, and the instruction segments are used to describe the execution process of the computer program in the terminal device.
所述处理器601可以是中央处理单元(Central Processing Unit，CPU)，还可以是其他通用处理器、数字信号处理器(Digital Signal Processor，DSP)、专用集成电路(Application Specific Integrated Circuit，ASIC)、现场可编程门阵列(Field-Programmable GateArray，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等，通用处理器可以是微处理器，或者所述处理器601也可以是任何常规的处理器，所述处理器601是所述终端设备的控制中心，利用各种接口和线路连接所述终端设备的各个部分。The processor 601 can be a central processing unit (Central Processing Unit, CPU), and can also be other general-purpose processors, digital signal processors (Digital Signal Processor, DSP), application specific integrated circuits (Application Specific Integrated Circuit, ASIC), Field-Programmable Gate Array (Field-Programmable GateArray, FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc., the general-purpose processor can be a microprocessor, or the processor 601 can also be Any conventional processor, the processor 601 is the control center of the terminal device, and uses various interfaces and lines to connect various parts of the terminal device.
所述存储器602主要包括程序存储区和数据存储区，其中，程序存储区可存储操作系统、至少一个功能所需的应用程序等，数据存储区可存储相关数据等。此外，所述存储器602可以是高速随机存取存储器，还可以是非易失性存储器，例如插接式硬盘，智能存储卡(Smart Media Card，SMC)、安全数字(Secure Digital，SD)卡和闪存卡(Flash Card)等，或所述存储器602也可以是其他易失性固态存储器件。The memory 602 mainly includes a program storage area and a data storage area, wherein the program storage area can store an operating system, an application program required by at least one function, etc., and the data storage area can store related data and the like. In addition, the memory 602 can be a high-speed random access memory, or a non-volatile memory, such as a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card and a flash memory Card (Flash Card), etc., or the memory 602 may also be other volatile solid-state storage devices.
需要说明的是，上述终端设备可包括，但不仅限于，处理器、存储器，本领域技术人员可以理解，图6的结构示意图仅仅是上述终端设备的示例，并不构成对上述终端设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件。It should be noted that the above-mentioned terminal device may include, but not limited to, a processor and a memory. Those skilled in the art can understand that the schematic structural diagram in FIG. 6 is only an example of the above-mentioned terminal device, and does not constitute a limitation on the above-mentioned terminal device. More or fewer components than shown, or combinations of certain components, or different components may be included.
本发明实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质 包括存储的计算机程序，其中，在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行上述任一实施例所述的基于多种数据源的不同控件样式的渲染方法。An embodiment of the present invention also provides a computer-readable storage medium, the computer-readable storage medium includes a stored computer program, wherein, when the computer program is running, the device where the computer-readable storage medium is located is controlled to perform any of the above tasks. The rendering method of different control styles based on multiple data sources described in an embodiment.
本发明实施例提供了一种页面渲染方法、装置、终端设备及计算机存储介质，通过获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。本发明实施例支持多端的不同数据，可适用于含有复杂数据源以及复杂控件样式组合的模块，可对多种数据源的不同控件样式进行渲染，页面渲染方式多样且可更改，更便于推广。Embodiments of the present invention provide a page rendering method, device, terminal equipment, and computer storage medium, by obtaining page data of a target page; wherein, the target page includes at least one control; and parsing the page data to obtain at least A control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data; according to each control data, it is matched to the corresponding control style template from the preset control style template library, Loading each of the control data to the corresponding control style template, the rendering of the control is completed; judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then In the return step, the page data is analyzed, and the next control is rendered until all controls are rendered, and the target page is rendered. The embodiment of the present invention supports multi-terminal different data, is applicable to modules containing complex data sources and complex control style combinations, and can render different control styles of multiple data sources, and the page rendering methods are diverse and changeable, which is more convenient for promotion.
需说明的是，以上所描述的系统实施例仅仅是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。另外，本发明提供的系统实施例附图中，模块之间的连接关系表示它们之间具有通信连接，具体可以实现为一条或多条通信总线或信号线。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。It should be noted that the system embodiments described above are only illustrative, and the units described as separate components may or may not be physically separated, and the components shown as units may or may not be physically separated. A unit can be located in one place, or it can be distributed to multiple network units. Part or all of the modules can be selected according to actual needs to achieve the purpose of the solution of this embodiment. In addition, in the drawings of the system embodiments provided by the present invention, the connection relationship between the modules indicates that they have communication connections, which can be specifically implemented as one or more communication buses or signal lines. It can be understood and implemented by those skilled in the art without creative effort.
以上所述是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也视为本发明的保护范围。The above description is a preferred embodiment of the present invention, and it should be pointed out that for those skilled in the art, without departing from the principle of the present invention, some improvements and modifications can also be made, and these improvements and modifications are also considered Be the protection scope of the present invention.

Claims (10)

  1. 一种页面渲染方法，其特征在于，包括：A page rendering method, characterized in that, comprising:
    获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；Obtain page data of the target page; wherein, the target page includes at least one control;
    对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；Analyzing the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
    根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；According to the matching of each control data from the preset control style template library to the corresponding control style template, each control data is loaded into the corresponding control style template, and the control renders Finish;
    判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。Judging whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, then return to the step of parsing the page data, and perform the rendering of the next control until all the control rendering is completed, then the The target page is rendered.
  2. 如权利要求1所述的页面渲染方法，其特征在于，若所述控件数据的数据类型为多端数据，则所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，之前还包括：The page rendering method according to claim 1, wherein if the data type of the control data is multi-terminal data, then according to each of the control data, the preset control style template library is matched to the corresponding The corresponding control style template also includes:
    根据所述多端数据的唯一标识符从多端数据加载器中匹配相对应的数据源模块；matching the corresponding data source module from the multi-terminal data loader according to the unique identifier of the multi-terminal data;
    加载所述数据源模块中的数据，并根据预设的多端数据模板对所述数据源模块中的数据进行解析和装载。Load the data in the data source module, and analyze and load the data in the data source module according to the preset multi-terminal data template.
  3. 如权利要求2所述的页面渲染方法，其特征在于，所述方法还包括：The page rendering method according to claim 2, further comprising:
    判断所述多端数据是否需要融合；judging whether the multi-terminal data needs to be fused;
    若是，则将所述多端数据和云端数据进行数据融合，得到融合数据；If so, performing data fusion on the multi-terminal data and cloud data to obtain fusion data;
    对所述融合数据的合法性进行校验。Check the validity of the fusion data.
  4. 如权利要求1所述的页面渲染方法，其特征在于，所述根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，具体包括：The page rendering method according to claim 1, wherein, according to each of the control data, matching the corresponding control style template from the preset control style template library specifically includes:
    对每一所述控件数据进行数据结构解析；Analyzing the data structure of each control data;
    获取每一所述控件的样式ID；Acquiring the style ID of each said control;
    根据所述样式ID从预设的控件样式模板库中匹配相对应的控件样式模板。Match the corresponding control style template from the preset control style template library according to the style ID.
  5. 如权利要求4所述的页面渲染方法，其特征在于，所述获取每一所述控件的样式ID，具体为：The page rendering method according to claim 4, wherein said obtaining the style ID of each said control is specifically:
    判断所述控件是否指定样式ID，若是，则从云端直接获取所述控件指定的样式ID，若否，则根据所述控件的控件数据的长度计算样式ID。Judging whether the control specifies a style ID, if yes, directly obtain the style ID specified by the control from the cloud, if not, calculate the style ID according to the length of the control data of the control.
  6. 如权利要求5所述的页面渲染方法，其特征在于，所述根据所述控件的控件数据的长度计算样式ID，具体包括：The page rendering method according to claim 5, wherein the calculating the style ID according to the length of the control data of the control specifically includes:
    若所述控件数据的长度满足第一预设长度条件，则所述控件的样式为文本框，再通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the first preset length condition, the style of the control is a text box, and then the style ID is obtained through data feature analysis and data selection analysis;
    若所述控件数据的长度满足第二预设长度条件，则所述控件的样式为tab或拖动条；判断所述控件数据的尺寸是否大于所述控件的宽度，若是，则判定所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID；若否，则直接通过数据特征分析和数据选中项分析得到所述样式ID；If the length of the control data satisfies the second preset length condition, the style of the control is tab or drag bar; determine whether the size of the control data is greater than the width of the control, if so, determine the control The style is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection item analysis; if not, the style ID is obtained directly through data feature analysis and data selection item analysis;
    若所述控件数据的数据长度满足第三预设长度条件，则所述控件的样式为滑动列表、拖动条或多选框，再通过数据特征分析和数据选中项分析得到所述样式ID。If the data length of the control data satisfies the third preset length condition, the style of the control is a sliding list, a drag bar or a multi-selection box, and then the style ID is obtained through data feature analysis and data selection analysis.
  7. 如权利要求1至6中任一项所述的页面渲染方法，其特征在于，所述预设的控件样式模板库支持动态的增添或删除控件样式模板。The page rendering method according to any one of claims 1 to 6, wherein the preset control style template library supports dynamic addition or deletion of control style templates.
  8. 一种页面渲染装置，其特征在于，包括：A page rendering device, characterized in that it comprises:
    获取模块，用于获取目标页面的页面数据；其中，所述目标页面包括至少一个控件；An acquisition module, configured to acquire page data of a target page; wherein, the target page includes at least one control;
    解析模块，用于对所述页面数据进行解析，得到至少一个所述控件的控件数据；其中，所述控件数据的数据类型包括多端数据和云端数据；A parsing module, configured to parse the page data to obtain at least one control data of the control; wherein, the data type of the control data includes multi-terminal data and cloud data;
    装载模块，用于根据每一所述控件数据从预设的控件样式模板库中匹配到与其相对应的控件样式模板，将每一所述控件数据装载至与其相对应的所述控件样式模板，则所述控件渲染完成；A loading module, configured to match each control data from a preset control style template library to a corresponding control style template, and load each control data to the corresponding control style template, Then the rendering of the control is completed;
    判断模块，用于判断所述页面数据是否拆解完成，若是，则所述目标页面渲染完成；若否，则返回步骤对所述页面数据进行解析，进行下一个控件的渲染，直至所有控件渲染完成，则所述目标页面渲染完成。A judging module, used to judge whether the disassembly of the page data is completed, if yes, the rendering of the target page is completed; if not, return to the step of parsing the page data, and render the next control until all controls are rendered completed, the rendering of the target page is completed.
  9. 一种终端设备，其特征在于，包括处理器、存储器以及存储在所述存储器中且被配置为由所述处理器执行的计算机程序，所述处理器执行所述计算机程序时实现如权利要求1至7中任意一项所述的页面渲染方法。A terminal device, characterized by comprising a processor, a memory, and a computer program stored in the memory and configured to be executed by the processor, when the processor executes the computer program, the computer program according to claim 1 is implemented. The page rendering method described in any one of to 7.
  10. 一种计算机可读存储介质，其特征在于，所述计算机可读存储介质包括存储的计算机程序，其中，在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行如权利要求1至7中任意一项所述的页面渲染方法。A computer-readable storage medium, characterized in that the computer-readable storage medium includes a stored computer program, wherein, when the computer program is running, the device where the computer-readable storage medium is located is controlled to perform the tasks described in claims 1 to 1. The page rendering method described in any one of 7.
PCT/CN2022/127561 2021-11-15 2022-10-26 Page rendering method and apparatus, and terminal device and computer storage medium WO2023082994A1 (en)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202111348983.4 2021-11-15
CN202111348983.4A CN116127223A (en) 2021-11-15 2021-11-15 Page rendering method and device, terminal equipment and computer storage medium

Publications (1)

Publication Number Publication Date
WO2023082994A1 true WO2023082994A1 (en) 2023-05-19

Family

ID=86310573

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2022/127561 WO2023082994A1 (en) 2021-11-15 2022-10-26 Page rendering method and apparatus, and terminal device and computer storage medium

Country Status (2)

Country Link
CN (1) CN116127223A (en)
WO (1) WO2023082994A1 (en)

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110302485A1 (en) * 2010-06-07 2011-12-08 Quora, Inc. Component-based content rendering system
CN106648555A (en) * 2015-10-28 2017-05-10 阿里巴巴集团控股有限公司 Page generation method and device
CN111428170A (en) * 2020-03-20 2020-07-17 湖南快乐阳光互动娱乐传媒有限公司 Web page rendering method and device
CN113254819A (en) * 2021-05-27 2021-08-13 广东太平洋互联网信息服务有限公司 Page rendering method, system, equipment and storage medium

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110302485A1 (en) * 2010-06-07 2011-12-08 Quora, Inc. Component-based content rendering system
CN106648555A (en) * 2015-10-28 2017-05-10 阿里巴巴集团控股有限公司 Page generation method and device
CN111428170A (en) * 2020-03-20 2020-07-17 湖南快乐阳光互动娱乐传媒有限公司 Web page rendering method and device
CN113254819A (en) * 2021-05-27 2021-08-13 广东太平洋互联网信息服务有限公司 Page rendering method, system, equipment and storage medium

Also Published As

Publication number Publication date
CN116127223A (en) 2023-05-16

Similar Documents

Publication Publication Date Title
CN108519967B (en) Chart visualization method and device, terminal and storage medium
US20190251143A1 (en) Web page rendering method and related device
CN108073429B (en) Payment mode configuration method, device, equipment and storage medium
CN110941779B (en) Page loading method and device, storage medium and electronic equipment
CN111831542B (en) API application debugging method and device and storage medium
CN109582317B (en) Method and apparatus for debugging hosted applications
CN111881209A (en) Data synchronization method and device for heterogeneous database, electronic equipment and medium
WO2023179549A1 (en) Document block sharing method, apparatus and system, and storage medium
US20160078200A1 (en) Merchandising media based on ownership audit
WO2023082994A1 (en) Page rendering method and apparatus, and terminal device and computer storage medium
CN112799760A (en) Form rendering method and device
CN116483344A (en) Code generation method and device, terminal equipment and computer readable storage medium
US10649743B2 (en) Application developing method and system
CN112631949B (en) Debugging method and device, computer equipment and storage medium
CN112214704B (en) Page processing method and device
CN112737831A (en) Firmware upgrade package processing method and device, electronic equipment and storage medium
CN114048048A (en) Information sharing method and device, electronic equipment and storage medium
US9477448B2 (en) Screen-oriented computing program refactoring
CN112650763A (en) Configuration method of product quota, related equipment and storage medium
US20150113501A1 (en) Mobile computing program slicing
CN114564250B (en) Reading configuration method and device
US20240311097A1 (en) Cloud Technology-Based Graphics Program Online Development Method and System, and Related Device
CN113626409B (en) Test data processing method, device, equipment and storage medium
CN111831953B (en) Data processing method, device, equipment and storage medium
CN111414162B (en) Data processing method, device and equipment thereof

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 22891790

Country of ref document: EP

Kind code of ref document: A1