CN111459488B - 表单页面的渲染方法、装置、***和可读介质 - Google Patents
表单页面的渲染方法、装置、***和可读介质 Download PDFInfo
- Publication number
- CN111459488B CN111459488B CN202010562739.7A CN202010562739A CN111459488B CN 111459488 B CN111459488 B CN 111459488B CN 202010562739 A CN202010562739 A CN 202010562739A CN 111459488 B CN111459488 B CN 111459488B
- Authority
- CN
- China
- Prior art keywords
- form page
- data
- cells
- rendering
- rendered
- Prior art date
- Legal status (The legal status 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 status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G16—INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR SPECIFIC APPLICATION FIELDS
- G16H—HEALTHCARE INFORMATICS, i.e. INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR THE HANDLING OR PROCESSING OF MEDICAL OR HEALTHCARE DATA
- G16H20/00—ICT specially adapted for therapies or health-improving plans, e.g. for handling prescriptions, for steering therapy or for monitoring patient compliance
- G16H20/10—ICT specially adapted for therapies or health-improving plans, e.g. for handling prescriptions, for steering therapy or for monitoring patient compliance relating to drugs or medications, e.g. for ensuring correct administration to patients
-
- G—PHYSICS
- G16—INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR SPECIFIC APPLICATION FIELDS
- G16H—HEALTHCARE INFORMATICS, i.e. INFORMATION AND COMMUNICATION TECHNOLOGY [ICT] SPECIALLY ADAPTED FOR THE HANDLING OR PROCESSING OF MEDICAL OR HEALTHCARE DATA
- G16H50/00—ICT specially adapted for medical diagnosis, medical simulation or medical data mining; ICT specially adapted for detecting, monitoring or modelling epidemics or pandemics
- G16H50/70—ICT specially adapted for medical diagnosis, medical simulation or medical data mining; ICT specially adapted for detecting, monitoring or modelling epidemics or pandemics for mining of medical data, e.g. analysing previous cases of other patients
Landscapes
- Engineering & Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Public Health (AREA)
- Medical Informatics (AREA)
- Epidemiology (AREA)
- Data Mining & Analysis (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Primary Health Care (AREA)
- General Health & Medical Sciences (AREA)
- General Physics & Mathematics (AREA)
- Medicinal Chemistry (AREA)
- Bioinformatics & Cheminformatics (AREA)
- Chemical & Material Sciences (AREA)
- Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Biomedical Technology (AREA)
- Databases & Information Systems (AREA)
- Pathology (AREA)
- Image Generation (AREA)
Abstract
本发明提供了一种表单页面的渲染方法,包括如下步骤,从服务器获取待渲染的表单页面的数据;根据获取的待渲染的表单页面的数据建立数据模型;确定待渲染的表单页面的单元格数量;当待渲染的表单页面的单元格数量小于或等于一门限值时,将全部数据渲染,形成第一表单页面;当待渲染的表单页面的单元格数量大于该门限值时,将部分数据渲染,形成第二表单页面;根据数据模型中的单元格数量和用户可见区的可见单元格数量设置第二表单页面的横向和/或纵向的虚拟滚动条长度;当监测到所述第二表单页面横向或纵向的虚拟滚动条滚动时,确定应在所述第二表单页面的用户可见区中展示的所述数据模型中的数据;将数据更新至所述第二表单页面的对应单元格。
Description
技术领域
本发明主要涉及数据处理,尤其涉及一种表单页面的渲染方法和渲染装置。
背景技术
临床试验数据的采集是药物临床研究中的核心内容。真实、准确、及时、规范的数据采集能够显著提高临床试验的质量,缩短研究周期。在传统模式中,临床试验主要依靠纸质的病例报告表(Case Report Form, CRF) 来完成数据的采集和管理过程。纸质CRF无法保证数据的可靠性和安全性,而且数据采集和管理周期较长,影响临床研究进程。
电子数据采集(Electronic Data Capture,EDC)是一种基于计算机网络的临床数据采集技术,通过软件、硬件、标准操作程序和人员配置的有机结合,以电子化的形式采集和传递临床数据。
在临床实验数据采集EDC***中,受试者CRF表通常会有一种表单数据展示方式,它以表格元素作为载体,每个单元格是一个带有输入框组件及数据监听的元素。当该表单为不良事件或合并用药等表单时,会出现数据量很大的情形,数据量较大时,页面元素变多,数据交互更加复杂,业务逻辑增多,处理数据的复杂程度也会受到数据量的影响,导致页面卡顿,影响用户体验,极大地影响了用户操作感受和增加录入数据的时间成本。同时,在保存表单数据时,传输给服务器的请求数据长度可超过160万字节,接口的响应时间可达到40s以上。此时将可导致页面崩溃,程序卡死,从而造成数据录入失败。
发明内容
本发明要解决的技术问题是提供一种表单页面的渲染方法和渲染装置,能够将页面渲染的时间开销大幅缩短。
为解决上述技术问题,本发明提供了一种表单页面的渲染方法,包括如下步骤,从服务器获取待渲染的表单页面的数据,所述表单页面包括多个单元格;根据获取的所述待渲染的表单页面的数据建立数据模型;确定所述待渲染的表单页面的单元格数量;当所述待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面;当所述待渲染的表单页面的单元格数量大于所述门限值时,将数据模型中的部分数据渲染,形成第二表单页面,所述第二表单页面所包含的单元格数量至少足以布满所述第二表单页面的用户可见区;所述门限值为正整数;根据所述数据模型中的单元格数量和所述用户可见区的单元格数量设置所述第二表单页面的横向和纵向的虚拟滚动条长度;
所述将数据模型中的部分数据渲染,形成第二表单页面的步骤包括,设置所述单元格的宽度值和高度值;根据所述用户可见区的尺寸,设置所述第二表单页面的总宽度值和总高度值;确定所述第二表单页面包含的单元格的数量;将所述数据模型中的部分数据渲染在所述第二表单页面中对应的单元格上;
当监测到所述第二表单页面横向或纵向的滚动条滚动时,确定应在所述第二表单页面的表格中展示的所述数据模型中的数据;将计算得到的应展示的所述数据模型中的数据更新至所述第二表单页面的用户可见区中的对应单元格。
在本发明的一实施例中,根据获取所述待渲染的表单页面的数据建立数据模型的步骤包括:获取所述待渲染的表单页面的数据中的字段组、字段、字段组的属性值和字段的属性值;所述字段组与所述待渲染的表单页面中单元格的列数相关;字段组的个数决定单元格的列数;字段与所述待渲染的表单页面中单元格的行相关;字段的个数决定单元格的行数;字段组的属性值决定列相关的数据的处理;字段的属性值决定行相关的数据的处理。
在本发明的一实施例中,确定所述待渲染的表单页面的单元格数量是根据所述字段组的个数和所述字段的个数相乘得到。
在本发明的一实施例中,所述第二表单页面还包括预留显示区。
在本发明的一实施例中,响应于所述单元格中进行的数据录入和/或切换操作,对所述第一表单页面或第二表单页面中的单元格进行渲染。
在本发明的一实施例中,表单页面的渲染方法还包括:在将所述单元格中的数据更新完成后,将数据发送至服务器端,并根据所述服务器端的返回结果,重新渲染形成表单页面,所述表单页面为全部数据对应的表单页面或部分数据对应的第二表单页面;其中,当发送至所述服务器端的数据的字节数大于阈值时,将数据压缩后发送至服务器端;当数据的字节数小于或等于阈值时,将数据直接发送至服务器端;所述阈值为正整数。
本发明还提供一种表单页面的渲染装置,包括,数据获取模块,被配置为从服务器获取待渲染的表单页面的数据,所述表单页面包括多个单元格;数据模型建立模块;被配置为根据获取的所述待渲染的表单页面的数据建立数据模型;表单页面渲染模块,被配置为执行如下操作:确定所述待渲染的表单页面的单元格数量;当所述待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面;当所述待渲染的表单页面的单元格数量大于所述门限值时,将数据模型中的部分数据渲染,形成第二表单页面,所述第二表单页面所包含的单元格数量至少足以布满所述第二表单页面的用户可见区;所述门限值为正整数;根据所述数据模型中的单元格数量和所述用户可见区的单元格数量设置所述第二表单页面的横向和/或纵向的虚拟滚动条长度;
所述将数据模型中的部分数据渲染,形成第二表单页面的步骤包括,设置所述单元格的宽度值和高度值;根据所述用户可见区的尺寸,设置所述第二表单页面的总宽度值和总高度值;确定所述第二表单页面包含的单元格的数量;将所述数据模型中的部分数据渲染在所述第二表单页面中对应的单元格上;
当监测到所述第二表单页面横向或纵向的滚动条滚动时,确定应在所述第二表单页面的表格中展示的所述数据模型中的数据;将计算得到的应展示的所述数据模型中的数据更新至所述第二表单页面的用户可见区中的对应单元格。
本发明还提供一种表单页面的渲染***,包括,存储器,用于存储可由处理器执行的指令;以及处理器,用于执行所述指令以实现上述的方法。
本发明还提供一种存储有计算机程序代码的计算机可读介质,所述计算机程序代码在由处理器执行时实现如上述的方法。
与现有技术相比,本发明通过检测表单页面的单元格数量,根据单元格数量采取不同渲染方式。其中,对大数据量表单页面采取加载部分数据进行虚拟渲染的方式,将页面渲染的时间开销大幅缩短。因此本发明可以降低用户输入引起的卡顿或程序卡死的风险,提高表单页面的可交互性。
另外,本发明通过在客户端对大数据量数据的压缩传输,避免页面崩溃,实现数据有效录入。
附图说明
附图是为提供对本申请进一步的理解,它们被收录并构成本申请的一部分,附图示出了本申请的实施例,并与本说明书一起起到解释本发明原理的作用。附图中:
图1是本发明一实施例的表单页面的渲染方法的示例性流程图。
图2是本发明一实施例的表单页面的渲染的示意图。
图3是本发明一实施例的第二表单页面的渲染的示意图。
图4是本发明一实施例的表单页面的渲染方法形成第二表单页面的流程图。
图5是本发明一实施例的表单页面的渲染方法的示例性流程图。
具体实施方式
为让本发明的上述目的、特征和优点能更明显易懂,以下结合附图对本发明的具体实施方式作详细说明。
在下面的描述中阐述了很多具体细节以便于充分理解本发明,但是本发明还可以采用其它不同于在此描述的其它方式来实施,因此本发明不受下面公开的具体实施例的限制。
本申请中使用了流程图用来说明根据本申请的实施例的***所执行的操作。应当理解的是,前面或下面操作不一定按照顺序来精确地执行。相反,可以按照倒序或同时处理各种步骤。同时,或将其他操作添加到这些过程中,或从这些过程移除某一步或数步操作。
本发明的实施例描述一种表单页面的渲染方法和渲染装置。这一渲染方法和渲染装置可以应用在例如EDC***的客户端中,用于渲染表单页面。
图1是本发明一实施例的表单页面的渲染方法的示例性流程图。如图1所示,本发明的表单页面的渲染方法包括以下步骤。步骤101,从服务器获取待渲染的表单页面的数据。步骤102,根据获取的待渲染的表单页面的数据建立数据模型。步骤103,确定待渲染的表单页面的单元格数量。步骤104,当待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面。步骤105,当待渲染的表单页面的单元格数量大于门限值时,将数据模型中的部分数据渲染,形成第二表单页面,第二表单页面所包含的单元格数量至少足以布满第二表单页面的用户可见区。步骤106根据数据模型中的单元格数量和用户可见区的单元格数量设置第二表单页面的横向和/或纵向的虚拟滚动条长度。
在步骤101,从服务器获取待渲染的表单页面的数据。此时待渲染的表单页面的数据,例如可展示在浏览器页面。为方便采集受试者信息,将用户输入和表单渲染结合起来,拉取服务器数据。同时实时获取表单信息,方便用户编辑,且实现将数据分类和分组,使数据扁平化以及按表格形式排列。表格形式排列亦可称为按单元格形式排列。待渲染的数据可对应为每一个单元格中的输入、点选、勾选、下拉列表和按钮等控件。
在步骤102,根据获取的待渲染的表单页面的数据建立数据模型。具体地,可获取从服务器端接收的待渲染的表单页面的数据中的字段组、字段、字段组的属性值和字段的属性值。字段组与待渲染的表单页面中单元格的列数相关;字段组的个数决定单元格的列数;字段与待渲染的表单页面中单元格的行相关;字段的个数决定单元格的行数;字段组的属性值决定列相关的数据的处理;字段的属性值决定行相关的数据的处理。例如,根据字段的属性值生成表单控件,可挂载事件监听,形成与实验数据采集的业务逻辑相关的底层单元。字段的属性值是用户交互的主要操作对象。操作的数据经保存后,可传递给服务器端进行处理。
在步骤103,确定待渲染的表单页面的单元格数量。具体地,单元格数量可通过根据字段组的个数和字段的个数相乘得到。在步骤104,如图2所示,当待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面200。门限值为一正整数,例如门限值为1200,即待渲染的表单页面的单元格数量的门限值为1200。此时的第一表单页面200包括全部的待渲染数据。第一表单页面200包括用户可见区201和用户不可见区202。
在步骤105,如图3所示,当待渲染的表单页面的单元格数量大于该门限值时,将数据模型中的部分数据渲染,形成第二表单页面。该第二表单页面所包含的单元格数量至少布满表格显示区301。门限值为一正整数,例如门限值为1200,即待渲染的表单页面的单元格数量的门限值为1200。例如,横向有40个单元格,纵向有31个单元格。此时,单元格的总个数超过1200个。或横向有40个单元格,纵向有50个单元格。此时,单元格的总个数为2000个,亦超过1200个。则采用第二表单页面渲染方式。
图4为本发明一实施例的表单页面的渲染方法形成第二表单页面的流程图。形成第二表单页面包括,步骤401,设置单元格的宽度值和高度值。步骤402,根据用户可见区的尺寸,设置第二表单页面的总宽度值和总高度值。步骤403,得到第二表单页面包含的单元格的数量。步骤404,将数据模型中的部分数据渲染在第二表单页面对应的单元格上。
在步骤401,设置单元格(例如图3所示单元格311)的宽度值和高度值。例如单元格的宽度为100像素值,高度为80像素值。也可设置单元格的宽度为160像素值,高度为48像素值等。实际的高度和宽度值可根据需要,例如需要展示的元素的属性和特点进行设置。
在步骤402,根据用户可见区301的尺寸,设置第二表单页面的总宽度值和总高度值。例如对于分辨率为1360×768的屏幕,设屏幕宽度的70%可用于展示第二表单页面的单元格,则1360*70%=952个像素值。除去单元格之间的适当间隔,在单元格的宽度为100像素值时,在横向上可设置显示9个单元格。在纵向上,设屏幕高度的80%可用于展示第二表单页面的单元格,则768*80%=614.4,取整数614。除去单元格之间的适当间隔,在单元格的高度为80像素值时,在纵向上可设置显示7个单元格。页面上其他区域,例如可设置有页面的保存或刷新按钮等。
在步骤403,确定第二表单页面包含的单元格的数量。参考图3第二表单页面的渲染区域包括用户可见区301和预留显示区302(图3中虚线格子)。预留显示区302与用户可见区301相邻。另外,预留显示区302的单元格数量小于用户可见区301的单元格数量。通常而言,预留显示区302的单元格数量与滚动条小幅滚动所对应的行数和列数有关。例如,在横向上设置显示10个单元格,则用户可见区301为10列单元格,预留显示区302可设置有与10列单元格相邻的2列单元格。当在纵向上可设置显示5个单元格,则用户可见区为5行单元格,预留显示区可设置有与7行单元格相邻的2行单元格。因此,在用户可见区将需要渲染10×5=50个单元格。加上预留显示区,共需渲染(10+2)×(5+2)=84个单元格。
在一实施例中,当横向有40列单元格,纵向有31行单元格(与前述的横向有40个单元格,纵向有31个单元格的表述的含义对应),采用第二表单页面渲染方式,在初始渲染页面,只渲染左侧和上侧的12列单元格,9行单元格。
在步骤404,将数据模型中的部分数据渲染在第二表单页面对应的单元格上。如前述,在确定第二表单页面需渲染84个单元格,其中用户可见区为50个单元格,预留显示区为34个单元格后,将数据模型中与此84个单元格对应的数据渲染在第二表单页面对应的单元格上。
继续参考图1,在步骤105,渲染第二表单页面的单元格后,进行步骤106,根据数据模型中的单元格数量和第二表单页面的可见单元格数量设置第二表单页面的横向和纵向的虚拟滚动条长度。例如,对于横向有40个单元格,纵向有31个单元格,单元格的总个数超过1200个的情形,而第二表单页面的可见单元格,即用户可见区的单元格共有50个,即横向有10个,纵向有5个。此时根据横向和纵向的可见单元格,在数据模型中的全部单元格303的数量的占比计算得到第二表单页面的横向滚动条303和纵向滚动条304的长度。例如横向占比为9/40=22.5%,纵向占比7/31 ≈ 22.6%。而后基于侧边栏的长度得到横向的虚拟滚动条303和纵向的虚拟滚动条304的长度。侧边栏的长度亦与屏幕的显示区域的尺寸相关。图3与图2的展示方式相比,尽管每次渲染的单元格数量大为减少,但是滚动条的长度是相似的。这样,根据虚拟滚动条的长度,用户可以预知要展示的单元格的总数。相比之下,如果按照常规的方式,根据已渲染的单元格数量(用户可见区301和预留显示区302的单元格总数,例如84个)和用户可见区301的单元格数量(例如50个)设置第二表单页面的横向和纵向滚动条长度,那么滚动条的长度将大大增加,导致用户无法正确预知要展示的单元格的总数。
前述的预留显示区的设置,使得用户在作滚动条(即为虚拟滚动条)的小幅度滚动时,可直接显示本次已渲染的第二表单页面的单元格,而无任何页面卡顿和显示异常。
图5是本发明一实施例的表单页面的渲染方法的示例性流程图。参考图5,在一些实施例中,本发明的表单页面的渲染方法除包括如图1所例示的步骤101至步骤106对应的步骤501至步骤506外,还包括步骤507,当监测到第二表单页面横向或纵向的虚拟滚动条滚动时,计算应在用户可见区中展示的数据模型中的数据。步骤508将计算得到的应展示的数据模型中的数据更新至第二表单页面的用户可见区中的对应单元格。
具体地,在步骤507,当监测到第二表单页面横向或纵向的虚拟滚动条滚动时,计算应在第二表单页面的用户可见区中展示的数据模型中的数据。例如,当滚动条向下滚定一定位置或向右滚动一定位置,将计算滚动条在侧边栏的位置。例如滚动后,滚动条位于侧边栏的中间位置或后1/3的位置,则将计算数据模型中应在相应的第二表单页面中展示的数据。
在步骤508,将计算得到的应展示的数据模型中的数据更新至第二表单页面的用户可见区中的对应单元格,即重新渲染在相应区域的单元格上。
在一非限制性实施例中,当用户在第一或第二表单页面的单元格中进行数据录入和/或切换操作时,响应于这一操作,客户端对第一或第二表单页面中的单元格进行渲染。此时第二表单页面的渲染方式,在单元格进行数据、录入切换操作,即对单元格数据进行更新时,需更新渲染的页面内容只限制在第一或第二表单页面上,而无需对与数据模型中的全部数据对应的表单页面进行更新,从而避免页面在更新渲染时的卡顿和异常,或较长的响应等待时间。避免页面更新时给用户带来的页面阻塞和滞后感。
在一非限制性实施例中,本发明的表单页面的渲染方法,在将单元格中的数据更新完成后,将数据发送至服务器端。该确认更新完成的环节例如可通过对保存按钮和确认提交按钮的点选完成。这样的设置可尽量少的触发表单页面的更新,将更新操作打包汇总,统一处理,提升用户体验。
在数据发送至服务器端后,根据服务器端的返回结果,重新渲染形成表单页面。例如图1的表单页面的渲染方法所示,当待渲染的表单页面的单元格数量小于或等于门限值时,将数据模型中的全部数据渲染,形成第一表单页面。当待渲染的表单页面的单元格数量大于门限值时,将数据模型中的部分数据渲染,形成第二表单页面。再根据数据模型中的单元格数量和第二表单页面的用户可见区的单元格数量设置第二表单页面的横向和纵向滚动条长度。因此,重新渲染形成的表单页面为全部数据对应的第一表单页面或部分数据对应的第二表单页面。
对于将数据发送至服务器的环节,当数据的字节数大于阈值时,将数据压缩后发送至服务器端。当数据的字节数小于或等于阈值时,将数据直接发送至服务器端。例如,阈值可设置为40万字节。即当待发送的数据小于或等于40万字节时,将数据直接发送至服务器端。当待发送的数据大于40万字节时,将数据压缩后发送至服务器端。对数据的压缩例如可采用gzip方式或其他压缩方式。压缩的数据发送至服务器端后,可再进行解压,进行一系列的校验或核查流程。并返回结果至客户端的表单页面。经过此客户端压缩,服务器端解压的过程,可避免长时间的等待和缓存时间,避免页面崩溃,实现数据有效录入。
本发明的表单页面的渲染方法通过检测表单页面的单元格数量,根据单元格数量采取不同渲染方式。其中,对大数据量表单页面采取加载部分数据进行虚拟渲染的方式,将页面渲染的时间开销大幅缩短。因此,本发明的实施例避免用户输入引起的卡顿或程序卡死,提高表单页面的可交互性。
与将页面分页或拆解页面层级,得到嵌套的页面的渲染方法相比,本发明的表单页面的渲染方法,避免了页面的拆分和多层级嵌套带来的单元格被拆分。对于页面被拆分或多层级嵌套带来的单元格被拆分的情形,当单元格中的数据通过控件进行更新时,如果表单页面被拆分成多个页面或拆解为多个嵌套页面,此时如果不同区域的单元格的数据更新之间存在关联或逻辑关系,将使得数据的录入变得繁复,需要在不同页面进行额外的核对和确认。本发明的表单页面的渲染方法避免了将表单页面作拆分或拆解页面层级,从而可避免此缺陷。
本发明还提供一种表单页面的渲染装置,包括,数据获取模块,被配置为从服务器获取待渲染的表单页面的数据,所述表单页面包括多个单元格。数据模型建立模块;被配置为根据获取的待渲染的表单页面的数据建立数据模型。表单页面渲染模块,被配置为执行如下操作:确定所述待渲染的表单页面的单元格数量;当待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面;当待渲染的表单页面的单元格数量大于门限值时,将数据模型中的部分数据渲染,形成第二表单页面,第二表单页面所包含的单元格数量至少足以布满所述第二表单页面的用户可见区;门限值为正整数;根据数据模型中的单元格数量和所述用户可见区的单元格数量设置第二表单页面的横向和/或纵向的虚拟滚动条长度。其中,将数据模型中的部分数据渲染,形成第二表单页面的流程如前述步骤401至步骤404及步骤501至步骤508中的相应步骤所记载,在此不再赘述。
本发明还提供一种表单页面的渲染***,包括存储器,用于存储可由处理器执行的指令;以及处理器,用于执行指令以实现前述的表单页面的渲染方法。
本发明还提供一种存储有计算机程序代码的计算机可读介质,所述计算机程序代码在由处理器执行时实现如所述的表单页面的渲染方法。
上文已对基本概念做了描述,显然,对于本领域技术人员来说,上述发明披露仅仅作为示例,而并不构成对本申请的限定。虽然此处并没有明确说明,本领域技术人员可能会对本申请进行各种修改、改进和修正。该类修改、改进和修正在本申请中被建议,所以该类修改、改进、修正仍属于本申请示范实施例的精神和范围。
同时,本申请使用了特定词语来描述本申请的实施例。如“一个实施例”、“一实施例”、和/或“一些实施例”意指与本申请至少一个实施例相关的某一特征、结构或特点。因此,应强调并注意的是,本说明书中在不同位置两次或多次提及的“一实施例”或“一个实施例”或“一替代性实施例”并不一定是指同一实施例。此外,本申请的一个或多个实施例中的某些特征、结构或特点可以进行适当的组合。
本申请的一些方面可以完全由硬件执行、可以完全由软件(包括固件、常驻软件、微码等)执行、也可以由硬件和软件组合执行。以上硬件或软件均可被称为“数据块”、“模块”、“引擎”、“单元”、“组件”或“***”。处理器可以是一个或多个专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理器件(DAPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、处理器、控制器、微控制器、微处理器或者其组合。此外,本申请的各方面可能表现为位于一个或多个计算机可读介质中的计算机产品,该产品包括计算机可读程序编码。例如,计算机可读介质可包括,但不限于,磁性存储设备(例如,硬盘、软盘、磁带……)、光盘(例如,压缩盘CD、数字多功能盘DVD……)、智能卡以及闪存设备(例如,卡、棒、键驱动器……)。
计算机可读介质可能包含一个内含有计算机程序编码的传播数据信号,例如在基带上或作为载波的一部分。该传播信号可能有多种表现形式,包括电磁形式、光形式等等、或合适的组合形式。计算机可读介质可以是除计算机可读存储介质之外的任何计算机可读介质,该介质可以通过连接至一个指令执行***、装置或设备以实现通讯、传播或传输供使用的程序。位于计算机可读介质上的程序编码可以通过任何合适的介质进行传播,包括无线电、电缆、光纤电缆、射频信号、或类似介质、或任何上述介质的组合。
同理,应当注意的是,为了简化本申请披露的表述,从而帮助对一个或多个发明实施例的理解,前文对本申请实施例的描述中,有时会将多种特征归并至一个实施例、附图或对其的描述中。但是,这种披露方法并不意味着本申请对象所需要的特征比权利要求中提及的特征多。实际上,实施例的特征要少于上述披露的单个实施例的全部特征。
虽然本申请已参照当前的具体实施例来描述,但是本技术领域中的普通技术人员应当认识到,以上的实施例仅是用来说明本申请,在没有脱离本申请精神的情况下还可作出各种等效的变化或替换,因此,只要在本申请的实质精神范围内对上述实施例的变化、变型都将落在本申请的权利要求书的范围内。
Claims (9)
1.一种表单页面的渲染方法,包括如下步骤:
从服务器获取待渲染的表单页面的数据,所述表单页面包括多个单元格;
根据获取的所述待渲染的表单页面的数据建立数据模型;
确定所述待渲染的表单页面的单元格数量;
当所述待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面;
当所述待渲染的表单页面的单元格数量大于所述门限值时,将数据模型中的部分数据渲染,形成第二表单页面,所述第二表单页面所包含的单元格数量至少足以布满所述第二表单页面的用户可见区;所述门限值为正整数;
根据所述数据模型中的单元格数量和所述用户可见区的单元格数量设置所述第二表单页面的横向和/或纵向的虚拟滚动条长度;
所述将数据模型中的部分数据渲染,形成第二表单页面的步骤包括:
设置所述单元格的宽度值和高度值;
根据所述用户可见区的尺寸,设置所述第二表单页面的总宽度值和总高度值;
确定所述第二表单页面包含的单元格的数量;
将所述数据模型中的部分数据渲染在所述第二表单页面中对应的单元格上;
当监测到所述第二表单页面横向或纵向的虚拟滚动条滚动时,确定应在所述第二表单页面的用户可见区中展示的所述数据模型中的数据;
将计算得到的应展示的所述数据模型中的数据更新至所述第二表单页面的用户可见区中的对应单元格。
2.根据权利要求1所述的表单页面的渲染方法,其特征在于,根据获取所述待渲染的表单页面的数据建立数据模型的步骤包括:获取所述待渲染的表单页面的数据中的字段组、字段、字段组的属性值和字段的属性值;所述字段组与所述待渲染的表单页面中单元格的列数相关;字段组的个数决定单元格的列数;字段与所述待渲染的表单页面中单元格的行相关;字段的个数决定单元格的行数;字段组的属性值决定列相关的数据的处理;字段的属性值决定行相关的数据的处理。
3.根据权利要求2所述的表单页面的渲染方法,其特征在于,确定所述待渲染的表单页面的单元格数量是根据所述字段组的个数和所述字段的个数相乘得到。
4.根据权利要求1所述的表单页面的渲染方法,其特征在于,所述第二表单页面还包括预留显示区。
5.根据权利要求1至4中任一项所述的表单页面的渲染方法,其特征在于,响应于在所述单元格中进行的数据录入和/或切换操作,对所述第一表单页面或第二表单页面中的单元格进行渲染。
6.根据权利要求1所述的表单页面的渲染方法,其特征在于,还包括:
在将所述单元格中的数据更新完成后,将数据发送至服务器端,并根据所述服务器端的返回结果,重新渲染形成表单页面,所述表单页面为全部数据对应的第一表单页面或部分数据对应的第二表单页面;
其中,当发送至所述服务器端数据的字节数大于阈值时,将数据压缩后发送至服务器端;
当数据的字节数小于或等于阈值时,将数据直接发送至服务器端;
所述阈值为正整数。
7.一种表单页面的渲染装置,包括:
数据获取模块,被配置为从服务器获取待渲染的表单页面的数据,所述表单页面包括多个单元格;
数据模型建立模块;被配置为根据获取的所述待渲染的表单页面的数据建立数据模型;
表单页面渲染模块,被配置为执行如下操作:
确定所述待渲染的表单页面的单元格数量;
当所述待渲染的表单页面的单元格数量小于或等于一门限值时,将数据模型中的全部数据渲染,形成第一表单页面;
当所述待渲染的表单页面的单元格数量大于所述门限值时,将数据模型中的部分数据渲染,形成第二表单页面,所述第二表单页面所包含的单元格数量至少足以布满所述第二表单页面的用户可见区;所述门限值为正整数;
根据所述数据模型中的单元格数量和所述用户可见区的单元格数量设置所述第二表单页面的横向和/或纵向的虚拟滚动条长度;
所述将数据模型中的部分数据渲染,形成第二表单页面的步骤包括:
设置所述单元格的宽度值和高度值;
根据所述用户可见区的尺寸,设置所述第二表单页面的总宽度值和总高度值;
确定所述第二表单页面包含的单元格的数量;
将所述数据模型中的部分数据渲染在所述第二表单页面中对应的单元格上;
当监测到所述第二表单页面横向或纵向的虚拟滚动条滚动时,确定应在所述第二表单页面的用户可见区中展示的所述数据模型中的数据;
将计算得到的应展示的所述数据模型中的数据更新至所述第二表单页面的用户可见区中的对应单元格。
8.一种表单页面的渲染***,包括:
存储器,用于存储可由处理器执行的指令;以及
处理器,用于执行所述指令以实现如权利要求1-6任一项所述的方法。
9.一种存储有计算机程序代码的计算机可读介质,所述计算机程序代码在由处理器执行时实现如权利要求1-6任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010562739.7A CN111459488B (zh) | 2020-06-19 | 2020-06-19 | 表单页面的渲染方法、装置、***和可读介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010562739.7A CN111459488B (zh) | 2020-06-19 | 2020-06-19 | 表单页面的渲染方法、装置、***和可读介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN111459488A CN111459488A (zh) | 2020-07-28 |
CN111459488B true CN111459488B (zh) | 2020-09-18 |
Family
ID=71682071
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202010562739.7A Active CN111459488B (zh) | 2020-06-19 | 2020-06-19 | 表单页面的渲染方法、装置、***和可读介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN111459488B (zh) |
Families Citing this family (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111931472B (zh) * | 2020-08-11 | 2023-10-20 | 抖音视界有限公司 | 页面表格渲染方法、装置、电子设备及计算机可读介质 |
CN112596835A (zh) * | 2020-12-23 | 2021-04-02 | 深圳集智数字科技有限公司 | 一种页面中显示阶梯数据的方法、装置、设备及介质 |
CN113343144A (zh) * | 2021-05-31 | 2021-09-03 | 北京达佳互联信息技术有限公司 | 数据的显示方法、装置及设备 |
CN114356087A (zh) * | 2021-12-30 | 2022-04-15 | 北京绵白糖智能科技有限公司 | 一种基于增强现实的交互方法、装置、设备及存储介质 |
CN114491364A (zh) * | 2022-01-17 | 2022-05-13 | 广州市玄武无线科技股份有限公司 | 一种基于状态管理的高性能表单的实现方法及*** |
Family Cites Families (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US10621210B2 (en) * | 2016-11-27 | 2020-04-14 | Amazon Technologies, Inc. | Recognizing unknown data objects |
CN110503703B (zh) * | 2019-08-27 | 2023-10-13 | 北京百度网讯科技有限公司 | 用于生成图像的方法和装置 |
CN110908879B (zh) * | 2019-10-16 | 2023-10-20 | 陕西合友网络科技有限公司 | 埋点数据的上报方法、装置、终端和存储介质 |
CN110738185B (zh) * | 2019-10-23 | 2023-07-07 | 腾讯科技(深圳)有限公司 | 表单对象的识别方法、装置及存储介质 |
-
2020
- 2020-06-19 CN CN202010562739.7A patent/CN111459488B/zh active Active
Also Published As
Publication number | Publication date |
---|---|
CN111459488A (zh) | 2020-07-28 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN111459488B (zh) | 表单页面的渲染方法、装置、***和可读介质 | |
US11949759B2 (en) | Adaptive computation and faster computer operation | |
US9355081B2 (en) | Transforming HTML forms into mobile native forms | |
CN100592245C (zh) | 用于预览文件的方法和*** | |
US9805074B2 (en) | Compressed representation of a transaction token | |
CN108228861B (zh) | 用于执行机器学习的特征工程的方法及*** | |
US20100138775A1 (en) | Method, device and system, for extracting dynamic content from a running computer application | |
JP5668078B2 (ja) | サーバサイドレンダリング | |
CN111026470A (zh) | 用于输入数据的验证和转换的***和方法 | |
US20230115491A1 (en) | Information presentation method and apparatus, electronic device, and storage medium | |
CN103348321A (zh) | 用于检测不活动的浏览器窗口的技术 | |
US20140297317A1 (en) | Extracting key action patterns from patient event data | |
CN110781427A (zh) | 一种首屏时间的计算方法、装置、设备和存储介质 | |
RU2611961C2 (ru) | Способ и система регрессионного тестирования функциональности веб-страницы, машиночитаемый носитель информации | |
US9351046B2 (en) | Replacing an image with a media player | |
US9275685B2 (en) | Smooth playing of video | |
CN111814086A (zh) | 一种用于对网页进行截图方法和*** | |
CN114201615B (zh) | 基于数据快照的科研数据变动回顾方法及服务器 | |
US20210365406A1 (en) | Method and apparatus for processing snapshot, device, medium and product | |
US20240104694A1 (en) | Fluid and resolution-friendly view of large volumes of time series data | |
US20160275063A1 (en) | Transforming html forms into mobile native forms | |
CN110618797B (zh) | 生成文字走马灯的方法、装置及终端设备 | |
CN115952762B (zh) | 一种芯片仿真功能覆盖率检测方法、装置及检测*** | |
CN111026945A (zh) | 多平台爬虫调度方法、装置和存储介质 | |
US20220245120A1 (en) | Automated generation of audit log with application-level metadata using replication log of a database |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant | ||
CP03 | "change of name, title or address" |
Address after: 314000 3 storeys, Building 9, Intelligent Industry Innovation Park, 36 Changshengnan Road, Jiaxing Economic and Technological Development Zone, Zhejiang Province Patentee after: Zhejiang Taimei Medical Technology Co., Ltd Address before: 314001 3rd floor, building 9, smart industry innovation park, 36 Changsheng South Road, Jiaxing City, Zhejiang Province Patentee before: MOBILEMD SYSTEM (JIAXING) Co.,Ltd. |
|
CP03 | "change of name, title or address" |