CN116151191A

CN116151191A - 一种数据渲染方法、系统、电子设备及存储介质

Info

Publication number: CN116151191A
Application number: CN202310409548.0A
Authority: CN
Inventors: 柳雄; 胡新平; 张平; 郭杜
Original assignee: Wuhan Jingchen Wisdom Logo Technology Co ltd
Current assignee: Wuhan Jingchen Wisdom Logo Technology Co ltd
Priority date: 2023-04-18
Filing date: 2023-04-18
Publication date: 2023-05-23
Anticipated expiration: 2043-04-18
Also published as: CN116151191B

Abstract

本发明公开了一种数据渲染方法、系统、电子设备及存储介质。该方法包括步骤：获取用户输入的标签编辑信息，根据所述标签编辑信息生成基于Json数据格式的标签文件，所述标签文件包括若干个内容块的编辑信息，所述编辑信息包括内容块的位置布局信息；根据应用场景确定标签显示模式，所述标签显示模式为第一显示模式或第二显示模式中的任意一种；若所述标签显示模式为第一显示模式，则将所述标签文件中的位置布局信息进行删除处理，对所述标签文件的余下数据进行渲染，若所述标签显示模式为第二显示模式，则对所述标签文件进行渲染。本发明能够满足不同应用场景下的渲染需求。

Description

一种数据渲染方法、系统、电子设备及存储介质

技术领域

本发明属于计算机领域，更具体地，涉及一种数据渲染方法、系统、电子设备及存储介质。

背景技术

标签是指产品上的文字图形符号及一切的说明物。标签被广泛应用在商超零售、工业生产、快递、服装、办公管理等场景，例如价格标签、产品说明标签、货架标签、条码标签、服装标签、文件公文标签、档案保存标签、各种物品及文具标签、快递面单等。用户可以使用标签机配套的标签打印软件进行标签的编辑，编辑完成后发送给标签机进行打印。

当前市面上大多数标签打印软件使用HTML技术作为多端渲染的标准及方式，或者使用Markdown文档格式进行跨端渲染，其技术较为成熟和通用，且也易于传输。但是，但是其渲染方式较为单一，无法满足一些场景下的用户需求，需要为不同的渲染方式分别开发相应的程序，开发成本高。

发明内容

针对现有技术的缺陷，本发明提供了一种数据渲染方法、系统、电子设备及存储介质，能够满足不同应用场景下的渲染需求。

为实现上述目的，按照本发明的一个方面，提供了一种数据渲染方法，包括步骤：

获取用户输入的标签编辑信息，根据所述标签编辑信息生成基于Json数据格式的标签文件，所述标签文件包括若干个内容块的编辑信息，所述编辑信息包括内容块的位置布局信息；

根据应用场景确定标签显示模式，所述标签显示模式为第一显示模式或第二显示模式中的一种，第一显示模式为将所述标签文件中的内容块在显示窗口自上向下自适应布局展示，第二显示模式为将所述标签文件中的内容块基于所述位置布局信息展示；

若所述标签显示模式为第一显示模式，则对所述标签文件中的所述位置布局信息进行删除处理，对所述标签文件的余下数据进行渲染，若所述标签显示模式为第二显示模式，则对所述标签文件进行渲染。

进一步地，进行渲染前，根据当前的应用场景确定是否需要对所述标签文件的余下数据或所述标签文件进行格式转换，若需要进行格式转换，则调用对应的数据转换器进行格式转换，对格式转换后的数据进行渲染。

进一步地，若所述标签显示模式为第一显示模式，所述调用对应的数据转换器进行格式转换，包括步骤：

预先配置第一数据转换器和第二数据转换器，所述第一数据转换器用于将所述标签文件转换为HTML格式，所述第二数据转换器用于将所述标签文件转换为Markdown格式；

若需要将所述标签文件的余下数据或所述标签文件转换为HTML格式，则调用所述第一数据转换器；

若需要将所述标签文件的余下数据或所述标签文件转换为Markdown格式，则调用所述第二数据转换器。

进一步地，所述调用对应的数据转换器进行格式转换包括步骤：

提供用于添加自定义的第三数据转换器的标准数据接口，基于所述标准数据接口进行格式转换。

进一步地，所述标签文件包括多个内容块，所述第一数据转换器定义了每个内容块转换为HTML格式的函数，所述第二数据转换器定义了每个内容块转换为Markdown格式的函数。

进一步地，对所述标签文件的余下数据或所述标签文件进行渲染包括步骤：

预先配置第一渲染器、第二渲染器和第三渲染器，所述第一渲染器用于基于移动设备应用程序端数据协议规范进行渲染，所述第二渲染器用于基于移动设备小程序端数据协议规范进行渲染，所述第三渲染器用于基于Web网页端数据协议规范进行渲染；根据当前的应用场景调用所述第一渲染器、所述第二渲染器、所述第三渲染器中的任意一个进行渲染。

进一步地，所述根据应用场景确定标签显示模式，包括：若当前应用场景为画板编辑模式，则确定所述标签显示模式为第二显示模式。

按照本发明的第二方面，提供了一种数据渲染系统，包括：

生成模块，用于获取用户输入的标签编辑信息，根据所述标签编辑信息生成基于Json数据格式的标签文件，所述标签文件包括若干个内容块的编辑信息，所述编辑信息包括内容块的位置布局信息；

确定模块，根据应用场景确定标签显示模式，所述标签显示模式为第一显示模式或第二显示模式中的一种，第一显示模式为将所述标签文件中的内容块在显示窗口自上向下自适应布局展示，第二显示模式为将所述标签文件中的内容块基于所述位置布局信息展示；

渲染模块，用于根据所述标签显示模式进行渲染，若所述标签显示模式为第一显示模式，则对所述标签文件中的所述位置布局信息进行删除处理，对所述标签文件的余下数据进行渲染，若所述标签显示模式为第二显示模式，则对所述标签文件进行渲染。

按照本发明的第三方面，提供了一种电子设备，包括至少一个处理单元、以及至少一个存储单元，其中，所述存储单元存储有计算机程序，当所述计算机程序被所述处理单元执行时，使得所述处理单元执行任一数据渲染方法的步骤。

按照本发明的第四方面，提供了一种存储介质，其存储有可由访问认证设备执行的计算机程序，当所述计算机程序在访问认证设备上运行时，使得所述访问认证设备执行任一数据渲染方法的步骤。

总体而言，本发明所构思的以上技术方案与现有技术相比，能够取得下列有益效果：具有多种不同的渲染方式，能够根据应用场景确定标签显示模式，根据标签显示模式进行相应的处理后再进行渲染处理，渲染处理后能够按照相应的标签显示模式显示，其中，标签显示模式支持“将标签文件中的内容块在显示窗口自上向下自适应布局展示”，还支持“基于位置布局信息展示”，能够满足不同应用场景下的渲染需求。

附图说明

图1是本发明实施例的数据渲染方法的流程图；

图2是本发明实施例的第一显示模式的界面示意图；

图3是本发明实施例的第二显示模式的界面示意图；

图4是本发明实施例的数据渲染系统的示意图。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。此外，下面所描述的本发明各个实施方式中所涉及到的技术特征只要彼此之间未构成冲突就可以相互组合。

在本申请实施例的描述中，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括至少一个该特征。“多个”的含义是至少两个，例如两个，三个等，除非另有明确具体的限定。

本发明实施例中术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或模块的过程、方法、装置、产品或设备不必限于清楚地列出的那些步骤或模块，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或模块。

在本发明实施例中出现的对步骤进行的命名或者编号，并不意味着必须按照命名或者编号所指示的时间/逻辑先后顺序执行方法流程中的步骤，已经命名或者编号的流程步骤可以根据要实现的技术目的变更执行次序，只要能达到相同或者相类似的技术效果即可。

在本文中提及“实施例”意味着，结合实施例描述的特定特征、结构或特性可以包含在本发明的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是指相同的实施例，也不是与其它实施例互斥的独立的或备选的实施例。本领域技术人员显式地和隐式地理解的是，本文所描述的实施例可以与其它实施例相结合。

本发明提供了一种数据渲染方法、系统、电子设备及存储介质，以下分别进行说明。

如图1所示，本发明实施例的一种数据渲染方法，包括步骤S101至S103。

S101，获取用户输入的标签编辑信息，根据标签编辑信息生成基于Json数据格式的标签文件，标签文件包括若干个内容块的编辑信息，编辑信息包括内容块的位置布局信息。

用户可以使用标签机配套的标签打印软件进行标签的编辑，例如在编辑界面插入标题、文本、图片、列表、连接、视频等。

内容块是基于预先定义的数据结构描述的编辑插入对象。本发明实施例中，用户插入的标题、文本、图片、列表、链接、视频分别可以作为标题内容块、文本内容块、图片内容块、列表内容块、链接内容块、视频内容块，预先定义好每种类型内容块的数据结构，按照预先定义的数据结构在标签文件中分别记录每个内容块的编辑信息。例如，对于文本内容块，文本内容块的编辑信息包括文本内容块的具体文字内容，以及该内容块的位置布局信息。

位置布局信息可以是文本内容块的坐标、宽高、旋转角度等。

S102，根据应用场景确定标签显示模式，标签显示模式为第一显示模式或第二显示模式中的任意一种，第一显示模式为将标签文件中的内容块在显示窗口自上向下自适应布局展示，第二显示模式为将标签文件中的内容块基于位置布局信息展示。

标签显示模式支持“将标签文件中的内容块在显示窗口自上向下自适应布局展示”。如图2所示，标题、文本、图片这个内容块在显示窗口自上向下自适应布局展示，在该示例中，内容块的宽度与显示窗口宽度相同，高度自适应调整。

标签显示模式还支持基于位置布局信息展示，即所见即所得模式。如图3所示。每个内容块可以随意地放置在页面中的任意位置。每个内容块的宽、高、位置、旋转等均由用户设置，即在显示窗口上的显示与用户的设置保持一致。

根据应用场景确定标签显示模式。例如，若应用场景为画板编辑模式，如采用Google开源的构建用户界面工具包Flutter构建的画板编辑模式，则确定标签显示模式为第二显示模式。例如，若应用场景是需要提升用户进行标签编辑操作的便利性，而对其它设计要求不高时，可采用第一显示模式，此处不再列举应用场景。

S103，若标签显示模式为第一显示模式，则对标签文件中的位置布局信息进行删除处理，对标签文件的余下数据进行渲染，若标签显示模式为第二显示模式，则对标签文件进行渲染。若标签显示模式为第二显示模式，需要满足在显示窗口上的显示与用户的设置保持一致，因此标签文件中需要保留坐标、宽高等位置布局信息。

当确定标签显示模式为第一显示模式，则会忽略掉标签文件中的坐标、宽高等位置布局信息，传输更少的数据给渲染器。

渲染是指对输入的数据进行处理以在界面显示。

这样，本发明能够根据应用场景确定标签显示模式，根据标签显示模式进行渲染处理，标签显示模式支持“将标签文件中的内容块在显示窗口自上向下自适应布局展示”，还支持“基于位置布局信息展示”，能够满足不同应用场景下的渲染需求。

进一步地，进行渲染前，根据当前的应用场景确定是否需要对标签文件的余下数据或标签文件进行格式转换，若需要进行格式转换，则调用对应的数据转换器进行格式转换，对格式转换后的数据进行渲染。

不同应用场景下渲染器所支持的数据格式不同，例如若是在浏览器端进行渲染，则渲染器一般仅支持HTML格式，因此需要在渲染处理前将待渲染的数据转换为所需的格式。

进一步地，若标签显示模式为第一显示模式，调用对应的数据转换器进行格式转换包括步骤：

预先配置第一数据转换器和第二数据转换器，第一数据转换器用于将标签文件转换为HTML格式，第二数据转换器用于将标签文件转换为Markdown格式；若需要将标签文件的余下数据或标签文件转换为HTML格式，则调用第一数据转换器；若需要将标签文件的余下数据或标签文件转换为Markdown格式，则调用第二数据转换器。

本发明中，通过预先配置第一数据转换器和第二数据转换器，能够实现与通用解决方案HTML技术或Markdown技术之间的转换。进一步地，标签文件包括多个内容块，第一数据转换器定义了每个内容块转换为HTML格式的函数，第二数据转换器定义了每个内容块转换为Markdown格式的函数。

例如，若用户编辑标签时支持用户插入标题、文本、图片、列表、链接、视频等，则标签文件中可能包含标题内容块、文本内容块、图片内容块、列表内容块、链接内容块、视频内容块，并且每种内容块是以预先定义的数据结构存储，则第一数据转换器针对每种内容块分别定义了对应的函数。

举例说明，若在标签文件中，对标题内容块采用了多级标题的数据结构，通过一个字段来标识标题的级别，如一级标题、二级标题、三级标题等，通过另一个字段来标识标题的具体文字内容，则在第一数据转换器中将标题内容块的多级标题转换成多行HTML文本，每行对应一个标题的具体文字内容。

进一步地，调用对应的数据转换器进行格式转换包括步骤：

换而言之，通过提供标准数据接口，支持自定义数据转换器，渲染器需要哪种数据格式，就自定义相应的数据转换器，以将待渲染的数据转换为该需求的数据格式。数据转换器可以具体是功能性函数。

进一步地，还可以预先配置第四数据转换器和第五数据转换器，第四数据转换器用于将HTML格式的内容块转换为预定义数据结构的Json格式的内容块，第五数据转换器用于将Markdown格式的内容块转换为预定义数据结构的Json格式的内容块，在步骤S101中，若用户输入的标签编辑信息中包括基于HTML格式的内容，则调用第四数据转换器生成标签文件，若用户输入的标签编辑信息中包括基于Markdown格式的内容，则调用第五数据转换器生成标签文件。

进一步地，对标签文件的余下数据或标签文件进行渲染包括步骤：

预先配置第一渲染器、第二渲染器和第三渲染器，第一渲染器用于基于移动设备应用程序端数据协议规范进行渲染，第二渲染器用于基于移动设备小程序端数据协议规范进行渲染，第三渲染器用于基于Web网页端数据协议规范进行渲染，根据当前的应用场景调用第一渲染器、第二渲染器、第三渲染器中的任意一个进行渲染。

例如，若用户在移动设备应用程序端进行标签的编辑和显示，那么就基于安卓或IOS系统的数据协议规范进行渲染，若用户在Web网页端进行标签的编辑和显示，那么就基于Web网页端数据协议规范进行渲染。并且还会根据应用场景调整渲染设置，例如调整显示清晰度。

本发明实施例的一种数据渲染系统，包括：

生成模块201，用于获取用户输入的标签编辑信息，根据标签编辑信息生成基于Json数据格式的标签文件，标签文件包括若干个内容块的编辑信息，编辑信息包括内容块的位置布局信息；

确定模块202，根据应用场景确定标签显示模式，标签显示模式为第一显示模式或第二显示模式中的一种，第一显示模式为将标签文件中的内容块在显示窗口自上向下自适应布局展示，第二显示模式为将标签文件中的内容块基于位置布局信息展示；

渲染模块203，用于根据标签显示模式进行渲染，若标签显示模式为第一显示模式，则对标签文件中的位置布局信息进行删除处理，对标签文件的余下数据进行渲染，若标签显示模式为第二显示模式，则对标签文件进行渲染。

数据渲染系统的原理和效果与上述数据渲染方法相同，此处不再赘述。

本申请还提供一种电子设备，包括至少一个处理单元、以及至少一个存储单元，其中，存储单元存储有计算机程序，当计算机程序被处理单元执行时，使得处理单元执行上述数据渲染方法的步骤。

本申请还提供一种存储介质，存储有可由访问认证设备执行的计算机程序，当计算机程序在访问认证设备上运行时，使得访问认证设备执行时实现上述数据渲染方法的步骤。其中，存储介质可以包括但不限于任何类型的盘，包括软盘、光盘、DVD、CD-ROM、微型驱动器以及磁光盘、ROM、RAM、EPROM、EEPROM、DRAM、VRAM、闪速存储器设备、磁卡或光卡，或适合于存储指令和/或数据的任何类型的媒介或设备。

本领域的技术人员容易理解，以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等，均应包含在本发明的保护范围之内。

Claims

1.一种数据渲染方法，其特征在于，包括步骤：

2.如权利要求1所述的数据渲染方法，其特征在于，进行渲染前，根据当前的应用场景确定是否需要对所述标签文件的余下数据或所述标签文件进行格式转换，若需要进行格式转换，则调用对应的数据转换器进行格式转换，对格式转换后的数据进行渲染。

3.如权利要求2所述的数据渲染方法，其特征在于，若所述标签显示模式为第一显示模式，所述调用对应的数据转换器进行格式转换,包括步骤：

4.如权利要求3所述的数据渲染方法，其特征在于，所述调用对应的数据转换器进行格式转换,包括步骤：

5.如权利要求3所述的数据渲染方法，其特征在于，所述标签文件包括多个内容块，所述第一数据转换器定义了每个内容块转换为HTML格式的函数，所述第二数据转换器定义了每个内容块转换为Markdown格式的函数。

6.如权利要求1所述的数据渲染方法，其特征在于，对所述标签文件的余下数据或所述标签文件进行渲染，包括步骤：

预先配置第一渲染器、第二渲染器和第三渲染器，所述第一渲染器用于基于移动设备应用程序端数据协议规范进行渲染，所述第二渲染器用于基于移动设备小程序端数据协议规范进行渲染，所述第三渲染器用于基于Web网页端数据协议规范进行渲染；

根据当前的应用场景调用所述第一渲染器、所述第二渲染器、所述第三渲染器中的任意一个进行渲染。

7.如权利要求1所述的数据渲染方法，其特征在于，所述根据应用场景确定标签显示模式，包括步骤：若当前应用场景为画板编辑模式，则确定所述标签显示模式为第二显示模式。

8.一种数据渲染系统，其特征在于，包括：

确定模块，用于根据应用场景确定标签显示模式，所述标签显示模式为第一显示模式或第二显示模式中的一种，第一显示模式为将所述标签文件中的内容块在显示窗口自上向下自适应布局展示，第二显示模式为将所述标签文件中的内容块基于所述位置布局信息展示；

9.一种电子设备，其特征在于，包括至少一个处理单元、以及至少一个存储单元，其中，所述存储单元存储有计算机程序，当所述计算机程序被所述处理单元执行时，使得所述处理单元执行权利要求1～7任一项所述方法的步骤。

10.一种存储介质，其特征在于，其存储有可由访问认证设备执行的计算机程序，当所述计算机程序在访问认证设备上运行时，使得所述访问认证设备执行权利要求1～7任一项所述方法的步骤。