CN117648153B - 一种渲染展示方法、装置、电子设备和存储介质 - Google Patents
一种渲染展示方法、装置、电子设备和存储介质 Download PDFInfo
- Publication number
- CN117648153B CN117648153B CN202410115226.XA CN202410115226A CN117648153B CN 117648153 B CN117648153 B CN 117648153B CN 202410115226 A CN202410115226 A CN 202410115226A CN 117648153 B CN117648153 B CN 117648153B
- Authority
- CN
- China
- Prior art keywords
- node
- determining
- display
- rendering
- height
- 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
- 238000009877 rendering Methods 0.000 title claims abstract description 90
- 238000000034 method Methods 0.000 title claims abstract description 54
- 238000000547 structure data Methods 0.000 claims abstract description 30
- 230000000007 visual effect Effects 0.000 claims abstract description 24
- 238000004590 computer program Methods 0.000 claims description 16
- 230000004044 response Effects 0.000 claims description 6
- 230000008569 process Effects 0.000 abstract description 10
- 230000007547 defect Effects 0.000 abstract description 5
- 238000009960 carding Methods 0.000 abstract description 4
- 238000013479 data entry Methods 0.000 description 15
- 238000004891 communication Methods 0.000 description 8
- 230000003993 interaction Effects 0.000 description 8
- 238000012545 processing Methods 0.000 description 7
- 238000010586 diagram Methods 0.000 description 5
- 230000006870 function Effects 0.000 description 3
- 230000003287 optical effect Effects 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000005096 rolling process Methods 0.000 description 2
- 238000003491 array Methods 0.000 description 1
- 238000013473 artificial intelligence Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000001413 cellular effect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 239000011521 glass Substances 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 230000001953 sensory effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开了一种渲染展示方法、装置、电子设备和存储介质。具体包括:获取待渲染的虚拟树结构数据;根据虚拟树结构数据,确定各父节点在显示节点列表中的父节点序号;响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量;根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。本申请实施例,解决的现有技术中虚拟列表只处理数组结构,不支持树结构梳理的缺点,在可视区域中为树结构的数据提供便捷的展开展示,提高了树结构数据的渲染展示效率,提升了用户的使用体验。
Description
技术领域
本申请涉及数据处理技术领域,尤其涉及一种渲染展示方法、装置、电子设备和存储介质。
背景技术
随着互联网行业的飞速发展和网络设备的普及使用,越来越多的厂商和用户使用互联网技术和终端设备进行线上的业务,在使用各种终端设备例如计算机或手机进行业务浏览的过程中,必然会需要设备能够流畅的合理的渲染业务内容。随着技术的革新和服务的提高,业务内容的数据量越来越大,如何快速的渲染并且流畅的展示成为相关技术人员研究的问题之一。
当前,在渲染大量列表数据时,通常在界面内只渲染可视区域的节点,非可视区域节点不渲染,导致浏览时出现临时加载渲染使得观看体验不流畅,导致浏览效率降低。
发明内容
本申请提供了一种渲染展示方法、装置、电子设备和存储介质,以提高用户浏览的效率。
根据本申请的一方面,提供了一种渲染展示方法,所述方法包括:
获取待渲染的虚拟树结构数据;
根据虚拟树结构数据,确定各父节点的父节点序号;
响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;
根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量;
根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。
根据本申请的另一方面,提供了一种渲染展示装置,包括:
树结构获取模块,用于获取待渲染的虚拟树结构数据;
父节点序号确定模块,用于根据虚拟树结构数据,确定各父节点的父节点序号;
渲染位置确定模块,用于响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;
条目数量确定模块,用于根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量;
渲染展示模块,用于根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。
根据本申请的另一方面,提供了一种电子设备,所述电子设备包括:
至少一个处理器;以及
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的计算机程序,所述计算机程序被所述至少一个处理器执行,以使所述至少一个处理器能够执行本申请任一实施例所述的渲染展示方法。
根据本申请的另一方面,提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算机指令,所述计算机指令用于使处理器执行时实现本申请任一实施例所述的渲染展示方法。
本申请实施例的技术方案,根据虚拟树结构数据中的父节点的序号,确定该父节点下子节点的目标渲染位置;同时,通过可视区域高度和数据条目的单条显示高度确定可以展示的条目数量,将子节点在目标渲染位置渲染对应数目。本申请实施例的技术方案,解决的现有技术中虚拟列表只处理数组结构,不支持树结构梳理的缺点,在可视区域中为树结构的数据提供便捷的展开展示,提高了树结构数据的渲染展示效率,提升了用户的使用体验。
应当理解,本部分所描述的内容并非旨在标识本申请的实施例的关键或重要特征,也不用于限制本申请的范围。本申请的其它特征将通过以下的说明书而变得容易理解。
附图说明
为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是根据本申请实施例一提供的一种渲染展示方法的流程图;
图2是根据本申请实施例二提供的一种渲染展示方法的流程图;
图3是根据本申请实施例三提供的一种渲染展示装置的结构示意图;
图4是实现本申请实施例的渲染展示方法的电子设备的结构示意图。
具体实施方式
为了使本技术领域的人员更好地理解本申请方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分的实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。
需要说明的是,本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、***、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
实施例一
图1为本申请实施例一提供了一种渲染展示方法的流程图,本实施例可适用于对树结构数据进行渲染展示的情况,该方法可以由渲染展示装置来执行,该渲染展示装置可以采用硬件和/或软件的形式实现,该渲染展示装置可配置于电子设备中。如图1所示,该方法包括:
S110、获取待渲染的虚拟树结构数据。
其中,虚拟树结构数据可以是计算机软件***中存在的任何一种以树结构形式保存的数据。这些虚拟树结构数据需要通过终端的人机交互界面展示给用户,因此需要被渲染在人机交互界面中的可视区域中。这些虚拟树结构数据可以在计算机软件***中直接调用。本申请实施例对树结构和的具体形式和数据的具体内容不作限定。示例性的,在保险出单***中,各项数据是具备包含和被包含关系和层级的,例如A项包括B1、B2和B3,B1又包括C1和C2,B2又包括C3、C4和C5,B3又包括C6、C7、C8和C9,从而使得整理后的所有数据具备父子节点关系的树结构形态。
S120、根据虚拟树结构数据,确定各父节点的父节点序号。
其中,父节点可以是具备可以拆分内容(也即具备子节点)的数据信息。在人机交互界面中展示的各个节点都可以对应一个数据条目,父节点在展开后可以包括至少一个子节点,一个父节点可以对应一个数据条目,一个子节点也可以对应一个数据条目,子节点还可以继续展开并包括多个后代节点,以此类推,每个后代节点也均可以对应一个数据条目,各数据条目需要进行排列展示,那么按照顺序排列的各个父节点可以被赋予对应的编号,为了便于管理,编号可以连续。当然,父节点的数据条目在人机交互界面中是横向排列还是纵向排列,本申请实施例不作限定。本申请各实施方式将通过由上至下的纵向排列为例进行说明。
在一种可选实施方式中,所述根据虚拟树结构数据,确定各父节点的父节点序号,可以包括:根据虚拟树结构数据,确定显示节点列表;根据显示节点列表,确定父节点序号。
其中,显示节点列表可以是用于排列需要进行渲染展示的数据条目的缓存列表。可想而知,人机交互界面中的可视区域中的展示可以按照显示节点列表进行渲染。将虚拟树结构转化为数组格式,并填充到数据表格中从而生成显示节点列表。不同级别的节点可以分别存储在不同的列表中进行相互调用并在显示节点列表中穿插。由于父节点在显示节点列表中是按照顺序进行排列的,因此可以根据在显示节点列表中的排列顺序确定不同父节点的序号。
进一步的,所述根据显示节点列表,确定父节点序号,可以包括:根据单条显示高度和可视区域的高度,确定可视区域可展示的父节点数量;根据显示节点列表和父节点数量,确定父节点序号。
其中,通过可视区域的高度和单表显示高度的商,可以得到可是区域能够展示的父节点的数量,由于可视区域中所有节点均为整齐排列,所有按照排列顺序,即可确定任一父节点的序号。
S130、响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置。
其中,对父节点的展开操作可以是用户在人机交互界面进行的操作,通过打开父节点展示其下属的子节点的数据条目。可视区域可以是在人机交互界面中用于展示虚拟树结构数据的区域,例如可以是一个窗口。目标渲染位置可以是子节点的数据条目在可视区域中进行展示的位置。可以理解的是,当连续的多个父节点中的某一个被展开的时候,需要给予对应的各个子节点展示空间。那么,优选的,父节点下属的子节点可以紧随该父节点进行展示。那么根据该父节点的父节点序号,确定需要渲染展示的所有子节点应该***的位置,例如可以是紧随该父节点下方进行展示。
S140、根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量。
其中,单个节点数据条目的单条显示高度可以是在可视区域中每个数据条目在展示时需要占据的空间的高度值。单条显示高度可以由相关技术人员根据实际情况或者人工经验进行预先设定,本申请实施例对此不做限定。当然,父节点的数据条目的显示高度和子节点的数据条目的显示高度可以相同也可以不同。可以理解的是,用户在浏览的过程中,可视区域的高度一般预先定义好不随意改变,那么根据可视区域的高度和单条显示高度可以确定当前的可视区域可以同时展示多少条数据条目。从而确定待展示的数据条目的数量。
S150、根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。
前述步骤中确定了需要展示的子节点的目标渲染位置和数据条目数量,在可视区域的目标渲染位置进行已知数量的子节点的数据条目的渲染并通过人机交互界面展示给用户。可以理解的是,子节点的后代节点也同样可以通过上述方式进行渲染展示。需要说明的是,数据条目数量可能较多,经过高度的累计可能大于可视区域的高度,但是也可以预先进行渲染,便于用户在翻动查看过程中直接进行显示,以克服懒加载造成的显示延迟问题。
本申请实施例的技术方案,根据虚拟树结构数据中的父节点的序号,确定该父节点下子节点的目标渲染位置;同时,通过可视区域高度和数据条目的单条显示高度确定可以展示的条目数量,将子节点在目标渲染位置渲染对应数目。本申请实施例的技术方案,解决的现有技术中虚拟列表只处理数组结构,不支持树结构梳理的缺点,在可视区域中为树结构的数据提供便捷的展开展示,提高了树结构数据的渲染展示效率,提升了用户的使用体验。
实施例二
图2为本申请实施例二提供的一种渲染展示方法的流程图,本实施例是在上述实施例的基础上对子节点的收起操作进行的追加。如图2所示,该方法包括:
S210、获取待渲染的虚拟树结构数据。
S220、根据虚拟树结构数据,确定各父节点的父节点序号。
S230、响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置。
S240、根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量。
S250、根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。
S260、响应于对各子节点的收起操作,确定各子节点在显示节点列表中的子节点序号。
其中,子节点的收起操作可以是用户针对某父节点下所有子节点进行的合并操作,将展开的子节点收回父节点中,并还原原有各父节点的排列。由于父节点在展开后,各个子节点在显示节点列表中已经存在并且整齐排列,那么根据这些子节点在显示列表中的排列顺序,为每个子节点赋予一个序号,也即子节点序号。
S270、根据子节点序号,确定被收起子节点及被收起子节点的后代节点的被收起数量。
可以理解的是,父节点展开后展示子节点,有的子节点可以继续展开,展示的是后代节点,而不论展开多少次,各后代节点的序号确认和子节点确定的方式相同。也就是说可以根据当前正在展示的所有节点的排列顺序,确定各子节点和后代节点的序号。在可视区域中即可根据显示的首个节点和显示的最后一个节点的序号,计算出可视区域中展示了多少个节点,也就确定了需要被收起的子节点和后代节点的数量。
S280、根据被收起数量和单条显示高度,确定可视区域中的待展示条目进行渲染。
计算被收起的子节点和后代节点的数量与单条显示高度的乘积,即可得到被收起的子节点和后代节点的高度,此高度对应展示空间需要被父节点和未被收起的子节点补充,因此可以对这些待展示条目进行确定,一般的,按照展示顺序从被收起节点后面的各个节点作为待展示条目,进行渲染展示。
在另一种可选实施方式中,所述方法可以包括:响应于可视区域的滚动操作,确定被滚动的数据条目的滚动高度;根据滚动高度和单条显示高度,确定被滚动的数据条目的偏移数量;根据偏移数量,在显示节点列表中确定始末节点;根据始末节点,在显示节点列表中确定待展示条目进行渲染。
其中,滚动操作可以是用户在终端设备上通过人机交互界面对可视区域的各节点对应的数据条目进行翻看的操作,例如计算机界面中的滚动条操作或者手机终端中的滑动手势操作等。偏移数量可以是因为将节点在可视区域中滚动而造成的节点被滚动走的数量。始末节点可以包括起始节点和末尾节点,起始节点可以是在可视区域中滚动前出现的首个节点,确定该起始节点的序号;同理,末尾节点可以是在可视区域中滚动完成后出现的最后一个节点,确定该末尾节点的序号。在已知始末节点的序号后,在待显示的显示节点列表中按照序号确定这些滚动过程的节点对应的数据条目,作为待展示条目进行渲染和展示。
上述实施方式为用户提供了一种切实有效的滚动渲染方案,提升了用户的使用体验。需要说明的是,上述各实施方式中由于待展示条目可能超出可视区域的范围高度,因此对待展示条目进行预先的渲染有助于在展开节点、收起节点和滚动节点中快速的展示。
本申请实施例的技术方案,通过相应对子节点的收起操作,根据子节点在显示节点列表中的序号确定被收起子节点和后代节点的数量,从而根据单条数据高度确定后续应该被渲染展示的数据条目的量,并针对这些即将被展示的节点的数据条目进行渲染。这样做的好处在于能够提供对虚拟树结构数据进行展开和收起的操作功能,提高用户在对树结构数据进行浏览时的效率和灵活性。
实施例三
图3为本申请实施例三提供的一种渲染展示装置的结构示意图。如图3所示,该装置300包括:
树结构获取模块310,用于获取待渲染的虚拟树结构数据;
父节点序号确定模块320,用于根据虚拟树结构数据,确定各父节点的父节点序号;
渲染位置确定模块330,用于响应于对至少一个父节点的展开操作,针对任一父节点,根据父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;
条目数量确定模块340,用于根据预设的单个节点数据条目的单条显示高度和可视区域的高度,确定可视区域内待展示的数据条目数量;
渲染展示模块350,用于根据数据条目数量和目标渲染位置,对各子节点进行渲染展示。
本申请实施例的技术方案,根据虚拟树结构数据中的父节点的序号,确定该父节点下子节点的目标渲染位置;同时,通过可视区域高度和数据条目的单条显示高度确定可以展示的条目数量,将子节点在目标渲染位置渲染对应数目。本申请实施例的技术方案,解决的现有技术中虚拟列表只处理数组结构,不支持树结构梳理的缺点,在可视区域中为树结构的数据提供便捷的展开展示,提高了树结构数据的渲染展示效率,提升了用户的使用体验。
在一种可选实施方式中,所述父节点序号确定模块320,包括:
节点列表确定单元,用于根据虚拟树结构数据,确定显示节点列表;
序号确定单元,用于根据显示节点列表,确定父节点序号。
在一种可选实施方式中,所述序号确定单元,包括:
父节点数量确定子单元,用于根据单条显示高度和可视区域的高度,确定可视区域可展示的父节点数量;
父节点序号确定子单元,用于根据显示节点列表和父节点数量,确定父节点序号。
在一种可选实施方式中,所述渲染展示装置300还可以包括:
子节点序号确定模块,用于响应于对各子节点的收起操作,确定各子节点在显示节点列表中的子节点序号;
被收起数量确定模块,用于根据子节点序号,确定被收起子节点及被收起子节点的后代节点的被收起数量;
更新渲染模块,用于根据被收起数量和单条显示高度,确定可视区域中的待展示条目进行渲染。
在一种可选实施方式中,所述渲染展示装置300可以包括:
滚动高度确定模块,用于响应于可视区域的滚动操作,确定被滚动的数据条目的滚动高度;
偏移数量确定模块,用于根据滚动高度和单条显示高度,确定被滚动的数据条目的偏移数量;
始末节点确定模块,用于根据偏移数量,在显示节点列表中确定始末节点;
重新渲染模块,用于根据始末节点,在显示节点列表中确定待展示条目进行渲染。
本申请实施例所提供的渲染展示装置可执行本申请任意实施例所提供的渲染展示方法,具备执行各渲染展示方法相应的功能模块和有益效果。
实施例四
图4示出了可以用来实施本申请的实施例的电子设备10的结构示意图。电子设备旨在表示各种形式的数字计算机,诸如,膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装置,诸如,个人数字处理、蜂窝电话、智能电话、可穿戴设备(如头盔、眼镜、手表等)和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例,并且不意在限制本文中描述的和/或者要求的本申请的实现。
如图4所示,电子设备10包括至少一个处理器11,以及与至少一个处理器11通信连接的存储器,如只读存储器(ROM)12、随机访问存储器(RAM)13等,其中,存储器存储有可被至少一个处理器执行的计算机程序,处理器11可以根据存储在只读存储器(ROM)12中的计算机程序或者从存储单元18加载到随机访问存储器(RAM)13中的计算机程序,来执行各种适当的动作和处理。在RAM 13中,还可存储电子设备10操作所需的各种程序和数据。处理器11、ROM 12以及RAM 13通过总线14彼此相连。输入/输出(I/O)接口15也连接至总线14。
电子设备10中的多个部件连接至I/O接口15,包括:输入单元16,例如键盘、鼠标等;输出单元17,例如各种类型的显示器、扬声器等;存储单元18,例如磁盘、光盘等;以及通信单元19,例如网卡、调制解调器、无线通信收发机等。通信单元19允许电子设备10通过诸如因特网的计算机网络和/或各种电信网络与其他设备交换信息/数据。
处理器11可以是各种具有处理和计算能力的通用和/或专用处理组件。处理器11的一些示例包括但不限于中央处理单元(CPU)、图形处理单元(GPU)、各种专用的人工智能(AI)计算芯片、各种运行机器学习模型算法的处理器、数字信号处理器(DSP)、以及任何适当的处理器、控制器、微控制器等。处理器11执行上文所描述的各个方法和处理,例如渲染展示方法。
在一些实施例中,渲染展示方法可被实现为计算机程序,其被有形地包含于计算机可读存储介质,例如存储单元18。在一些实施例中,计算机程序的部分或者全部可以经由ROM 12和/或通信单元19而被载入和/或安装到电子设备10上。当计算机程序加载到RAM 13并由处理器11执行时,可以执行上文描述的渲染展示方法的一个或多个步骤。备选地,在其他实施例中,处理器11可以通过其他任何适当的方式(例如,借助于固件)而被配置为执行渲染展示方法。
本文中以上描述的***和技术的各种实施方式可以在数字电子电路***、集成电路***、场可编程门阵列(FPGA)、专用集成电路(ASIC)、专用标准产品(ASSP)、芯片上***的***(SOC)、负载可编程逻辑设备(CPLD)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括:实施在一个或者多个计算机程序中,该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程***上执行和/或解释,该可编程处理器可以是专用或者通用可编程处理器,可以从存储***、至少一个输入装置、和至少一个输出装置接收数据和指令,并且将数据和指令传输至该存储***、该至少一个输入装置、和该至少一个输出装置。
用于实施本申请的方法的计算机程序可以采用一个或多个编程语言的任何组合来编写。这些计算机程序可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器,使得计算机程序当由处理器执行时使流程图和/或框图中所规定的功能/操作被实施。计算机程序可以完全在机器上执行、部分地在机器上执行,作为独立软件包部分地在机器上执行且部分地在远程机器上执行或完全在远程机器或服务器上执行。
在本申请的上下文中,计算机可读存储介质可以是有形的介质,其可以包含或存储以供指令执行***、装置或设备使用或与指令执行***、装置或设备结合地使用的计算机程序。计算机可读存储介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体***、装置或设备,或者上述内容的任何合适组合。备选地,计算机可读存储介质可以是机器可读信号介质。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦除可编程只读存储器(EPROM或快闪存储器)、光纤、便捷式紧凑盘只读存储器(CD-ROM)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
为了提供与用户的交互,可以在电子设备上实施此处描述的***和技术,该电子设备具有:用于向用户显示信息的显示装置(例如,CRT(阴极射线管)或者LCD(液晶显示器)监视器);以及键盘和指向装置(例如,鼠标或者轨迹球),用户可以通过该键盘和该指向装置来将输入提供给电子设备。其它种类的装置还可以用于提供与用户的交互;例如,提供给用户的反馈可以是任何形式的传感反馈(例如,视觉反馈、听觉反馈、或者触觉反馈);并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
可以将此处描述的***和技术实施在包括后台部件的计算***(例如,作为数据服务器)、或者包括中间件部件的计算***(例如,应用服务器)、或者包括前端部件的计算***(例如,具有图形用户界面或者网络浏览器的用户计算机,用户可以通过该图形用户界面或者该网络浏览器来与此处描述的***和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算***中。可以通过任何形式或者介质的数字数据通信(例如,通信网络)来将***的部件相互连接。通信网络的示例包括:局域网(LAN)、广域网(WAN)、区块链网络和互联网。
计算***可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。服务器可以是云服务器,又称为云计算服务器或云主机,是云计算服务体系中的一项主机产品,以解决了传统物理主机与VPS服务中,存在的管理难度大,业务扩展性弱的缺陷。
应该理解,可以使用上面所示的各种形式的流程,重新排序、增加或删除步骤。例如,本申请中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行,只要能够实现本申请的技术方案所期望的结果,本文在此不进行限制。
上述具体实施方式,并不构成对本申请保护范围的限制。本领域技术人员应该明白的是,根据设计要求和其他因素,可以进行各种修改、组合、子组合和替代。任何在本申请的精神和原则之内所作的修改、等同替换和改进等,均应包含在本申请保护范围之内。
Claims (7)
1.一种渲染展示方法,其特征在于,所述方法包括:
获取待渲染的虚拟树结构数据;
根据所述虚拟树结构数据,确定显示节点列表;
根据所述显示节点列表,确定各父节点的父节点序号;
响应于对至少一个父节点的展开操作,针对任一父节点,根据所述父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;其中,所述父节点下属的子节点紧随该父节点进行展示;
根据预设的单个节点数据条目的单条显示高度和所述可视区域的高度,确定所述可视区域内待展示的数据条目数量;
根据所述数据条目数量和所述目标渲染位置,对各所述子节点进行渲染展示;
所述方法还包括:
响应于所述可视区域的滚动操作,确定被滚动的数据条目的滚动高度;
根据所述滚动高度和所述单条显示高度,确定所述被滚动的数据条目的偏移数量;
根据所述偏移数量,在所述显示节点列表中确定始末节点;所述始末节点包括起始节点和末尾节点;所述起始节点是在所述可视区域中滚动前出现的首个节点;所述末尾节点是在所述可视区域中滚动后出现的最后一个节点;
根据所述始末节点,在所述显示节点列表中确定待展示条目进行渲染。
2.根据权利要求1所述的方法,其特征在于,所述根据所述显示节点列表,确定所述父节点序号,包括:
根据所述单条显示高度和所述可视区域的高度,确定所述可视区域可展示的父节点数量;
根据所述显示节点列表和所述父节点数量,确定所述父节点序号。
3.根据权利要求1所述的方法,其特征在于,所述方法还包括:
响应于对各子节点的收起操作,确定各子节点在所述显示节点列表中的子节点序号;
根据所述子节点序号,确定被收起子节点及所述被收起子节点的后代节点的被收起数量;
根据所述被收起数量和所述单条显示高度,确定所述可视区域中的待展示条目进行渲染。
4.一种渲染展示装置,其特征在于,包括:
树结构获取模块,用于获取待渲染的虚拟树结构数据;
父节点序号确定模块,用于根据所述虚拟树结构数据,确定各父节点的父节点序号;
渲染位置确定模块,用于响应于对至少一个父节点的展开操作,针对任一父节点,根据所述父节点序号,确定该父节点对应子节点在可视区域的目标渲染位置;其中,所述父节点下属的子节点紧随该父节点进行展示;
条目数量确定模块,用于根据预设的单个节点数据条目的单条显示高度和所述可视区域的高度,确定所述可视区域内待展示的数据条目数量;
渲染展示模块,用于根据所述数据条目数量和所述目标渲染位置,对各所述子节点进行渲染展示;
其中,所述父节点序号确定模块,包括:
节点列表确定单元,用于根据所述虚拟树结构数据,确定显示节点列表;
序号确定单元,用于根据所述显示节点列表,确定所述父节点序号;
所述渲染展示装置还包括:
滚动高度确定模块,用于响应于可视区域的滚动操作,确定被滚动的数据条目的滚动高度;
偏移数量确定模块,用于根据滚动高度和单条显示高度,确定被滚动的数据条目的偏移数量;
始末节点确定模块,用于根据偏移数量,在显示节点列表中确定始末节点;所述始末节点包括起始节点和末尾节点;所述起始节点是在所述可视区域中滚动前出现的首个节点;所述末尾节点是在所述可视区域中滚动后出现的最后一个节点;
重新渲染模块,用于根据始末节点,在显示节点列表中确定待展示条目进行渲染。
5.根据权利要求4所述的装置,其特征在于,所述序号确定单元,包括:
父节点数量确定子单元,用于根据所述单条显示高度和所述可视区域的高度,确定所述可视区域可展示的父节点数量;
父节点序号确定子单元,用于根据所述显示节点列表和所述父节点数量,确定所述父节点序号。
6. 一种电子设备,其特征在于,所述电子设备包括:
至少一个处理器;以及
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的计算机程序,所述计算机程序被所述至少一个处理器执行,以使所述至少一个处理器能够执行权利要求1-3中任一项所述的渲染展示方法。
7.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质存储有计算机指令,所述计算机指令用于使处理器执行时实现权利要求1-3中任一项所述的渲染展示方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202410115226.XA CN117648153B (zh) | 2024-01-29 | 2024-01-29 | 一种渲染展示方法、装置、电子设备和存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202410115226.XA CN117648153B (zh) | 2024-01-29 | 2024-01-29 | 一种渲染展示方法、装置、电子设备和存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN117648153A CN117648153A (zh) | 2024-03-05 |
CN117648153B true CN117648153B (zh) | 2024-04-26 |
Family
ID=90045337
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202410115226.XA Active CN117648153B (zh) | 2024-01-29 | 2024-01-29 | 一种渲染展示方法、装置、电子设备和存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN117648153B (zh) |
Citations (13)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
WO2018103218A1 (zh) * | 2016-12-08 | 2018-06-14 | 武汉斗鱼网络科技有限公司 | 一种ui界面的显示处理方法及装置 |
CN110688531A (zh) * | 2019-08-26 | 2020-01-14 | 北京旷视科技有限公司 | 树组件渲染方法和装置、数据处理设备及介质 |
CN112650899A (zh) * | 2020-12-30 | 2021-04-13 | 中国平安人寿保险股份有限公司 | 数据可视化渲染方法、装置、计算机设备及存储介质 |
CN113626113A (zh) * | 2020-05-08 | 2021-11-09 | 北京沃东天骏信息技术有限公司 | 一种页面渲染方法和装置 |
CN113642292A (zh) * | 2021-07-14 | 2021-11-12 | 广州市玄武无线科技股份有限公司 | 一种树形列表的实现方法、***、设备及存储介质 |
CN113867880A (zh) * | 2021-10-15 | 2021-12-31 | 杭州安恒信息技术股份有限公司 | 树形结构展示方法、装置、***、电子装置和存储介质 |
CN115686509A (zh) * | 2022-09-27 | 2023-02-03 | 中银金融科技有限公司 | 一种基于vue框架的树形结构数据渲染方法、装置和介质 |
CN115793926A (zh) * | 2022-11-16 | 2023-03-14 | 深圳市亿图软件有限公司 | 列表的渲染方法、装置、电子设备及存储介质 |
CN116088966A (zh) * | 2023-02-21 | 2023-05-09 | 北京力控元通科技有限公司 | 一种高性能树形控件的加载方法及*** |
KR20230105534A (ko) * | 2022-01-04 | 2023-07-11 | 광운대학교 산학협력단 | 프레임 확장을 통한 렌더링 최소화 방법 및 프로그램과, 동 프로그램이 기록된, 컴퓨터 판독 가능한 기록 매체 |
CN116521629A (zh) * | 2023-05-10 | 2023-08-01 | 广州市迪士普音响科技有限公司 | 文件可视化方法、装置及设备 |
CN116719598A (zh) * | 2023-08-11 | 2023-09-08 | 北京久其金建科技有限公司 | 树形数据虚拟滚动处理方法及装置 |
CN116955863A (zh) * | 2023-05-30 | 2023-10-27 | 武汉依迅北斗时空技术股份有限公司 | 基于虚拟树的动态树形结构渲染方法及装置 |
Family Cites Families (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US8996987B2 (en) * | 2011-06-30 | 2015-03-31 | Apple Inc. | List view optimization |
-
2024
- 2024-01-29 CN CN202410115226.XA patent/CN117648153B/zh active Active
Patent Citations (13)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
WO2018103218A1 (zh) * | 2016-12-08 | 2018-06-14 | 武汉斗鱼网络科技有限公司 | 一种ui界面的显示处理方法及装置 |
CN110688531A (zh) * | 2019-08-26 | 2020-01-14 | 北京旷视科技有限公司 | 树组件渲染方法和装置、数据处理设备及介质 |
CN113626113A (zh) * | 2020-05-08 | 2021-11-09 | 北京沃东天骏信息技术有限公司 | 一种页面渲染方法和装置 |
CN112650899A (zh) * | 2020-12-30 | 2021-04-13 | 中国平安人寿保险股份有限公司 | 数据可视化渲染方法、装置、计算机设备及存储介质 |
CN113642292A (zh) * | 2021-07-14 | 2021-11-12 | 广州市玄武无线科技股份有限公司 | 一种树形列表的实现方法、***、设备及存储介质 |
CN113867880A (zh) * | 2021-10-15 | 2021-12-31 | 杭州安恒信息技术股份有限公司 | 树形结构展示方法、装置、***、电子装置和存储介质 |
KR20230105534A (ko) * | 2022-01-04 | 2023-07-11 | 광운대학교 산학협력단 | 프레임 확장을 통한 렌더링 최소화 방법 및 프로그램과, 동 프로그램이 기록된, 컴퓨터 판독 가능한 기록 매체 |
CN115686509A (zh) * | 2022-09-27 | 2023-02-03 | 中银金融科技有限公司 | 一种基于vue框架的树形结构数据渲染方法、装置和介质 |
CN115793926A (zh) * | 2022-11-16 | 2023-03-14 | 深圳市亿图软件有限公司 | 列表的渲染方法、装置、电子设备及存储介质 |
CN116088966A (zh) * | 2023-02-21 | 2023-05-09 | 北京力控元通科技有限公司 | 一种高性能树形控件的加载方法及*** |
CN116521629A (zh) * | 2023-05-10 | 2023-08-01 | 广州市迪士普音响科技有限公司 | 文件可视化方法、装置及设备 |
CN116955863A (zh) * | 2023-05-30 | 2023-10-27 | 武汉依迅北斗时空技术股份有限公司 | 基于虚拟树的动态树形结构渲染方法及装置 |
CN116719598A (zh) * | 2023-08-11 | 2023-09-08 | 北京久其金建科技有限公司 | 树形数据虚拟滚动处理方法及装置 |
Also Published As
Publication number | Publication date |
---|---|
CN117648153A (zh) | 2024-03-05 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN112540806B (zh) | 一种小程序页面渲染方法、装置、电子设备及存储介质 | |
CN110851058B (zh) | 一种页面虚拟滚动方法、装置及设备 | |
CN111177476B (zh) | 数据查询方法、装置、电子设备及可读存储介质 | |
CN113138827B (zh) | 展示数据的方法、装置、电子设备和介质 | |
CN114428902B (zh) | 信息搜索方法、装置、电子设备及存储介质 | |
CN117648153B (zh) | 一种渲染展示方法、装置、电子设备和存储介质 | |
CN112581589A (zh) | 一种视图列表布局方法、装置、设备及存储介质 | |
CN114564149B (zh) | 一种数据存储方法、装置、设备及存储介质 | |
CN116594709A (zh) | 用于获取数据的方法、装置及计算机程序产品 | |
CN116451619A (zh) | 元器件信息处理方法、装置、介质及设备 | |
CN116225312A (zh) | 镜像清理方法、装置、电子设备及存储介质 | |
CN113626113B (zh) | 一种页面渲染方法和装置 | |
CN113110837A (zh) | 一种处理页面信息的方法和装置 | |
CN113515210A (zh) | 一种显示方法、装置、电子设备以及存储介质 | |
CN115202538B (zh) | 一种菜单配置方法、装置、电子设备及存储介质 | |
CN116150435A (zh) | 层级数据的展示方法、装置、设备及存储介质 | |
CN114625460B (zh) | 图文混排方法、装置、设备以及存储介质 | |
CN115272524B (zh) | 多曲线并行绘制方法、装置、设备以及存储介质 | |
CN115576902B (zh) | 一种标定描述文件的处理方法、装置、设备及介质 | |
CN117311570A (zh) | 一种任务管理方法、装置、电子设备及存储介质 | |
CN117421082A (zh) | 一种控件显示控制方法、装置、电子设备和存储介质 | |
CN115422419A (zh) | 一种数据展示方法、装置、电子设备及可读存储介质 | |
CN116126296A (zh) | 基于多个关联日期选择器的控制方法、装置及电子设备 | |
CN114896532A (zh) | 一种基于弹窗的图片下载方法、装置、设备及存储介质 | |
CN116450131A (zh) | 表单页面生成方法、装置、电子设备及存储介质 |
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 |