CN112346811A - 渲染方法及装置 - Google Patents
渲染方法及装置 Download PDFInfo
- Publication number
- CN112346811A CN112346811A CN202110020882.8A CN202110020882A CN112346811A CN 112346811 A CN112346811 A CN 112346811A CN 202110020882 A CN202110020882 A CN 202110020882A CN 112346811 A CN112346811 A CN 112346811A
- Authority
- CN
- China
- Prior art keywords
- rendering
- layer
- elements
- nth
- 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.)
- Pending
Links
Images
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
Abstract
本公开关于一种渲染方法,包括:获取待渲染页面的多个元素;从所述多个元素之中提取需符合目标渲染结果的第一至第N元素,其中,N为大于1的正整数;将所述第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集;设置所述第一渲染图层至所述第N渲染图层之间的渲染顺序;根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染。在本公开的实施例之中,在进行渲染之前,根据设计需要,变更第一元素至第N元素的渲染顺序,从而使得一次渲染就可以达到预设的效果。例如,通过一次渲染,就可以实现第一元素至第N元素相互叠加的叠加效果,有效地减少了渲染次数。
Description
技术领域
本公开涉及页面技术领域,尤其涉及一种渲染方法及装置,电子设备以及存储介质。
背景技术
目前,随着页面技术的不断发展,页面的设计越来越复杂。目前的页面渲染是根据布局树,将布局树之上的节点依次生成相应的布局元素并按照节点渲染优先级入栈,对栈内的元素一次渲染,从而完成最终的页面渲染。
然而,由于在实际的设计时,会出现前一个操作项叠加到下一个操作项的情况。对于相关技术而言,由于当前操作项是在前一个操作项渲染之后进行渲染的,因此如果要实现叠加效果,则需要重新对前一个操作项和当前操作项调整之后,再次渲染,增加了渲染流程的复杂度。例如,元素B的节点优先级高于元素C的节点优先级,但是想要的绘制效果是元素B部分覆盖元素C。如图1a-1b所示,为相关技术之中渲染示意图。在相关技术之中,页面100之中包括元素B和元素C。按照相关技术,优先渲染元素B,之后再渲染元素C,最终生成图1a的效果。由于元素C晚于元素B渲染,因此按照顺序渲染之后会形成元素C部分地覆盖元素B的效果。此时为了实现元素B覆盖元素C的效果,如图1b所示,就需要在全部节点渲染完之后,再重新渲染一次,导致渲染流程非常复杂。特别是对于多个元素之间相互叠加时,将会导致渲染流程更为复杂,重复渲染的次数显著增加。
发明内容
本公开提供一种渲染方法及装置,以及存储介质,以至少解决相关技术中渲染流程复杂的问题。本公开的技术方案如下:
根据本公开实施例的第一方面,提供一种渲染方法,包括:获取待渲染页面的多个元素;从所述多个元素之中提取需符合目标渲染结果的第一至第N元素,其中,N为大于1的正整数;将所述第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集;设置所述第一渲染图层至所述第N渲染图层之间的渲染顺序;根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染。
在本公开的一个实施例之中,所述第一至第N元素包括第一元素和第二元素,且所述第一元素和所述第二元素对应第一渲染图层和第二渲染图层,所述根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染,包括:将所述多个元素之中的其他元素进行合并,以生成合并元素;将所述合并元素的渲染指令归入至合并渲染图层对应的指令集;设置所述第一渲染图层、所述第二渲染图层和所述合并渲染图层之间的渲染顺序;根据所述第一渲染图层、所述第二渲染图层和所述合并渲染图层的渲染顺序对所述待渲染页面进行渲染。
在本公开的一个实施例之中,所述目标渲染结果为所述第一元素部分覆盖所述第二元素,其中,所述第一元素的渲染顺序优先于所述第二元素的渲染顺序。
在本公开的一个实施例之中,所述变更所述第一渲染图层和所述第二渲染图层的渲染顺序,包括:设置所述第二渲染图层的渲染顺序优于所述第一渲染图层的渲染顺序。
根据本公开实施例的第二方面,还提供一种渲染装置,包括:元素获取模块,用于获取待渲染页面对应渲染树的多个元素;提取模块,用于从所述多个元素之中提取目标渲染结果的第一元素至第N元素,其中,N为大于1的正整数;渲染图层生成模块,用于分别将所述第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集;渲染顺序设置模块,用于设置所述第一渲染图层至所述第N渲染图层的渲染顺序;渲染模块,用于根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染。
在本公开的一个实施例之中,所述第一至第N元素包括第一元素和第二元素,且所述第一元素和所述第二元素对应第一渲染图层和第二渲染图层,所述渲染模块包括:生成子模块,用于将所述多个元素之中的其他元素作为合并元素;渲染图层生成子模块,用于将所述合并元素的渲染指令归入至合并渲染图层对应的指令集;设置子模块,用于设置所述第一渲染图层、所述第二渲染图层和所述合并渲染图层之间的渲染顺序;渲染子模块,用于根据所述第一渲染图层、所述第二渲染图层和所述合并渲染图层的渲染顺序对所述待渲染页面进行渲染。
在本公开的一个实施例之中,所述目标渲染结果为所述第一元素部分覆盖所述第二元素,其中,所述第一元素的渲染顺序优先于所述第二元素的渲染顺序。
在本公开的一个实施例之中,所述渲染子模块设置所述第二渲染图层的渲染顺序优于所述第一渲染图层的渲染顺序。
根据本公开实施例的第三方面,还提供一种电子设备,包括:处理器;用于存储所述处理器可执行指令的存储器;其中,所述处理器被配置为执行所述指令,以实现如上所述的渲染方法。
根据本公开实施例的第四方面,还提供一种非临时性计算机可读存储介质,当所述非临时性计算机可读存储介质中的指令由电子设备的处理器执行时,使得电子设备能够执行如上所述的渲染方法。
本公开的实施例提供的技术方案至少带来以下有益效果:
在本公开的实施例之中,在进行渲染之前,根据设计需要,变更第一元素至第N元素的渲染顺序,从而使得一次渲染就可以达到预设的效果。例如,通过一次渲染,就可以实现第一元素至第N元素相互叠加的叠加效果,有效地减少了渲染次数。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理,并不构成对本公开的不当限定。
图1a-1b为相关技术之中渲染示意图;
图2a-2c为本公开实施例的渲染示意图;
图3为本公开一个实施例的渲染方法流程图;
图4为本公开另一个实施例的渲染方法流程图;
图5为本公开一个实施例的一种渲染装置结构图;
图6为本公开一个实施例的一种渲染模块结构图;
图7为根据一示例性实施例示出的一种电子设备框图。
具体实施方式
为了使本领域普通人员更好地理解本公开的技术方案,下面将结合附图,对本公开实施例中的技术方案进行清楚、完整地描述。
需要说明的是,本公开的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本公开的实施例能够以除了在这里图示或描述的那些以外的顺序实施。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。
在本公开的实施例之中,页面之中通常会具有多个元素,不同的元素之间渲染顺序也不同。参照图1a-1b的例子,如果要实现图1b的效果,相关技术之中需要在所有元素渲染完成之后,再根据目标渲染效果(如元素B覆盖元素C的目标渲染效果)重新渲染一次。而在本公开的实施例之中,可以为第一至第N元素分别建立对应的第一至第N渲染图层,并根据目标渲染效果设置第一至第N渲染图层的渲染顺序,从而可以通过一次渲染实现想要的目标渲染效果。如图2a-2c所示,为本公开实施例的渲染示意图。例如对于元素B和元素C而言,如图2a所示,为元素B和元素C分别建立对应的渲染图层B和渲染图层C,如图2b所示,根据目标渲染效果设置渲染图层B和渲染图层C之间的渲染顺序,例如设置渲染图层C的渲染顺序高于渲染图层B的渲染顺序,这样在渲染时会优先渲染渲染图层C,在渲染图层C渲染完毕之后再渲染渲染图层B。根据调整之后的渲染顺序进行渲染即可实现元素B覆盖元素C的效果,如图2c所示,因此本公开的实施例无需再次进行渲染即可实现想要的目标渲染效果。
如图3所示,为本公开一个实施例的渲染方法流程图。该方法包括以下步骤:
步骤S310,获取待渲染页面的多个元素。
在本公开的实施例之中,待渲染页面对应有布局树,其中,布局树之上包括多个节点,每个节点对应一个元素。在本公开的一个实施例之中,不同的节点之间具有不同的渲染优先级。
步骤S330,从多个元素之中提取需符合目标渲染结果的第一至第N元素,其中,N为大于1的正整数。
其中,第一至第N元素之间具有初始渲染顺序,第一至第N元素分别与渲染树之上的第一至第N节点对应。其中,第一至第N元素的初始渲染顺序,是由渲染树之上第一至第N节点的渲染优先级决定的。由于渲染树是固定的,因此第一至第N节点的渲染优先级也是固定的,最终导致第一至第N元素的初始渲染顺序是固定的。
在本公开的实施例之中,第一元素至第N元素是指具有设计关系的N种元素。设计关系是指,与目标渲染效果有关联的几个元素,例如目标渲染效果是将第一至第N元素相互叠加,那么具有设计关系的N个元素就是指这相互叠加的N个元素。举例而言,最终的目标渲染效果是3个元素相互叠加产生某种效果,那么设计关系就是指相互叠加的这3个元素。当然,叠加效果只是为了便于说明,在本公开的其他实施例之中,根据设计要求还可以有其他的目标渲染结果。
步骤S350,将第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集。
在本公开的实施例之中,为了调整第一元素至第N元素之间的渲染顺序,分别为第一元素至第N元素建立了第一渲染图层至第N渲染图层,并将第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集。在本公开的一个实施例之中,一个渲染图层之中可以只包括一个元素。在本公开的其他实施例之中,一个渲染图层可以包括多个元素,该多个元素可以是页面之中的其他元素,例如没有设计关系的其他元素。同样地,渲染图层对应的指令集之中渲染指令的个数也与渲染图层之中的元素的个数相匹配。
步骤S370,设置第一渲染图层至第N渲染图层之间的渲染顺序。
在本公开的一个实施例之中,按照如上所述的目标渲染效果,对第一渲染图层至第N渲染图层的渲染顺序进行设置。例如以三个元素相互叠加的效果为例,例如第一元素的渲染优先级高于第二元素的渲染优先级,且第二元素的渲染优先级高于第三元素的渲染优先级,然而需要的目标渲染效果是第一元素部分地覆盖第二元素,第二元素部分地覆盖第三元素。在本公开的实施例之中,第一元素和第二元素叠加的部分,与第二元素和第三元素叠加的部分,可以相同,也可以不同。
在该实施例之中,为第一元素建立第一渲染图层,为第二元素建立第二渲染图层,同时为第三元素建立第三渲染图层。以及对第一渲染图层、第二渲染图层和第三渲染图层的渲染顺序进行设置,使得第一渲染图层的渲染顺序低于第二渲染图层的渲染顺序,且第二渲染图层的渲染顺序低于第三渲染图层的渲染顺序。
步骤S390,根据第一渲染图层至第N渲染图层的渲染顺序对待渲染页面进行渲染。
在本公开的实施例之中,按照步骤S370设置的第一渲染图层至第N渲染图层的渲染顺序对待渲染页面进行渲染,可以通过一次渲染,达到想要的目标渲染效果。例如,参照步骤S370之中三个元素相互叠加的例子,由于第一渲染图层的渲染顺序低于第二渲染图层的渲染顺序,且第二渲染图层的渲染顺序低于第三渲染图层的渲染顺序,因此第三渲染图层之中的第三元素先被渲染,其次第二渲染图层之中的第二元素再被渲染,最终第一渲染图层之中的第一元素被渲染,因此由于重新设置了渲染顺序,因此一次渲染完成之后,由于第二元素晚于第三元素渲染,因此渲染之后的第二元素就可叠加到第三元素之上,同样地,由于第一元素晚于第二元素渲染,因此渲染之后的第一元素即可叠加到第二元素之上。因此可以看出在该实施例之中,只需要一次渲染即可实现想要的目标渲染效果。
在本公开的实施例之中,在进行渲染之前,根据设计需要,变更第一元素至第N元素的渲染顺序,从而使得一次渲染就可以达到预设的效果。例如,通过一次渲染,就可以实现第一元素至第N元素相互叠加的叠加效果,有效地减少了渲染次数。
如图4所示,为本公开另一个实施例的渲染方法流程图。为了便于理解本公开实施例的方案,以下实施例将以两个元素为例进行描述。在该实施例之中,第一至第N元素包括第一元素和第二元素,且第一元素和第二元素分别对应第一渲染图层和第二渲染图层。第一元素的渲染顺序高于第二元素的渲染顺序,想要实现的目标渲染效果为第一元素叠加在第二元素之上。为了实现该效果,在本公开的实施例之中,为第一元素和第二元素分别建立第一渲染图层和第二渲染图层,并设置第一渲染图层的渲染顺序晚于第二渲染图层的渲染顺序,这样第一渲染图层之中的第一元素的渲染时间会晚于第二渲染图层之中的第二元素的渲染时间,从而通过一次渲染即可实现,第一元素叠加第二元素的效果。需要说明的是,在该实施例之中,为了便于说明以两个元素为例进行介绍,但是在本公开的其他实施例之中,可以依据本公开实施例之中两个元素的方案,扩展到多个元素,这些均在本公开实施例的保护范围之内。该方法包括以下步骤:
步骤S410,获取待渲染页面对应渲染树的多个元素。
在本公开的实施例之中,待渲染页面对应有布局树,其中,布局树之上包括多个节点,每个节点对应一个元素。在本公开的一个实施例之中,不同的节点之间具有不同的渲染优先级。
步骤S430,从多个元素之中提取目标渲染结果的第一元素和第二元素。
其中,第一元素的渲染顺序优先于第二元素的渲染顺序,即先渲染第一元素,之后再渲染第二元素。
在本公开的实施例之中,第一元素和第二元素是指具有设计关系的两种元素。设计关系是指,与目标渲染效果有关联的两个元素,例如目标渲染效果是将第一和第二元素相互叠加,那么具有设计关系的两个元素就是指这相互叠加的第一元素和第二元素。当然,叠加效果只是为了便于说明,在本公开的其他实施例之中,根据设计要求还可以有其他的目标渲染结果。当然在本公开的上述实施例之中,为了便于理解,以第一元素叠加到第二元素之上为例进行描述,但是在本公开的其他实施例之中,还会存在更为复杂的设计场景,例如多个元素的叠加等。在本公开的实施例之中,目标渲染结果是指第一元素叠加到第二元素的渲染结果,相关的元素就是指第一元素和第二元素。当然,在本公开的其他实施例之中,根据设计要求还可以有其他的目标渲染结果。
步骤S450,将第一元素的渲染指令归入至第一渲染图层对应的指令集,将第二元素的渲染指令归入至第二渲染图层对应的指令集。
在上述实施例之中,由于第一元素的渲染顺序优先于第二元素的渲染顺序,即第一元素先渲染,之后再渲染第二元素。然而,如果先渲染第一元素再渲染第二元素的话,则实现的效果是第二元素叠加在第一元素之上,而非第一元素叠加在第二元素之上的效果。为此,需要对第一元素和第二元素的渲染顺序进行变更。
在本公开的实施例之中,为了实现第一元素和第二元素渲染顺序的变更,为第一元素建立第一渲染图层,同时为第二元素建立第二渲染图层,并将第一元素的渲染指令归入至第一渲染图层对应的指令集之中,同时将第二元素的指令归入至第二渲染图层对应的指令集之中。在本公开的实施例之上,由于只需要将第一元素叠加到第二元素,因此第一渲染图层的指令集之中只有第一渲染元素的渲染指令,且第二渲染图层的指令集之中只有第二渲染元素的渲染指令。然而上述实施例之中只是较为简单的示意,对于更加复杂的场景,例如多个元素之间的相互叠加,则会根据设计要求建立多个渲染图层,或者将多个元素加入到同一个渲染图层之中。
本公开的实施例通过为第一元素和第二元素建立渲染图层的方式,实现二者渲染顺序的改变。在本公开的其他实施例之中,还可将待渲染页面之中的其他元素进行合并,并生成合并渲染图层,这样待渲染页面即可抽象为第一渲染图层、第二渲染图层和合并渲染图层之间的渲染关系。对于该实施例之中,第一渲染图层和第二渲染图层之间根据设计要求具有渲染顺序,例如第二渲染图层优先于第一渲染图层进行渲染。而合并渲染图层和第一渲染图层,以及第二渲染图层之间无明显的渲染关系(也可以根据设计要求确定)。例如,可以先渲染合并渲染图层,再依次渲染第二渲染图层和第一渲染图层,也可以先依次渲染第二渲染图层和第一渲染图层,之后再渲染合并渲染图层。
步骤S470,设置第一渲染图层和第二渲染图层的渲染顺序。
根据设计需求,设置第一渲染图层和第二渲染图层之间的渲染顺序,使得第二渲染图层优先于第一渲染图层进行渲染。
在本公开的实施例之中,如果将待渲染页面之中的其他元素合并为合并渲染图层,则还需要设置合并渲染图层与第一渲染图层和第二渲染图层之间的渲染顺序。如上所述的,除了第一渲染图层和第二渲染图层之间的渲染顺序需要根据目标渲染效果来确定,合并渲染图层与第一渲染图层和第二渲染图层之间的渲染顺序并无明确限定,可以选按照渲染顺序渲染第一渲染图层和第二渲染图层,最后再渲染合并渲染图层,也可以先渲染合并渲染图层,之后再按照渲染顺序渲染第一渲染图层和第二渲染图层。
步骤S490,根据第一渲染图层和第二渲染图层的渲染顺序对待渲染页面进行渲染。
在本公开的实施例之中,根据调整之后的渲染顺序,先渲染第二渲染图层,再渲染第一渲染图层,通过一次渲染即可实现第一元素叠加到第二元素的效果,无需经过二次渲染。
在本公开的一个实施例之中,可将多个元素之中的其他元素合并,并作为合并元素,并合并元素的渲染指令归入至合并渲染图层对应的指令集。之后根据第一渲染图层、第二渲染图层和合并渲染图层对待渲染页面进行渲染。在本公开的实施例之中,将待渲染页面之中除了第一元素和第二元素之外的其他元素均划入到合并渲染图层之中,这样除了第一元素和第二元素之外的其他元素作为一个整体,进行整体渲染,生成合并渲染图层。因此综上所述,可以将待渲染页面抽象为多个渲染图层,从而可以改变这些渲染图层的渲染顺序,进而通过顺序的调整实现某种页面设计,例如元素之间的叠加效果等,无需进行二次渲染。
在本公开的一个实施例之中,多个元素属于同一个根元素。在该实施例之中,多个元素属于该待渲染页面的同一个根元素,即多个元素之间是具有相关关系的,属于待渲染页面的一个部分。
在本公开的一个实施例之中,目标渲染结果为第一元素部分覆盖第二元素,其中,第一元素的渲染顺序优先于第二元素的渲染顺序,因此需要设置所述第二渲染图层的顺序优于所述第一渲染图层的渲染顺序。从而,可以先渲染第二渲染图层,之后再渲染第一渲染图层,由于第一渲染图层晚于第二渲染图层的生成,因此第一渲染图层的第一元素会叠加在第二渲染图层的第二元素之上。
如图5所示,为本公开一个实施例的一种渲染装置结构图。该渲染装置500包括元素获取模块510、提取模块520、渲染图层生成模块530、渲染顺序设置模块540和渲染模块550。其中,元素获取模块510用于获取待渲染页面对应渲染树的多个元素。提取模块520用于从多个元素之中提取目标渲染结果的第一元素至第N元素,其中,N为大于1的正整数。渲染图层生成模块530用于分别将第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集。渲染顺序设置模块540用于设置第一渲染图层至第N渲染图层的渲染顺序。渲染模块550用于根据第一渲染图层至第N渲染图层的渲染顺序对待渲染页面进行渲染。
如图6所示,为本公开一个实施例的一种渲染模块结构图。在该实施例之中,第一至第N元素包括第一元素和第二元素,且第一元素和第二元素分别对应第一渲染图层和第二渲染图层。渲染模块550包括生成子模块551、渲染图层生成子模块552、设置子模块553和渲染子模块554。生成子模块551用于将多个元素之中的其他元素合并,并生成合并元素。渲染图层生成子模块552用于将合并元素的渲染指令归入至合并渲染图层对应的指令集。设置子模块553用于设置第一渲染图层、第二渲染图层和合并渲染图层之间的渲染顺序。渲染子模块554用于根据第一渲染图层、第二渲染图层和合并渲染图层的渲染顺序对待渲染页面进行渲染。
在本公开的一个实施例之中,目标渲染结果为第一元素部分覆盖第二元素,其中,第一元素的渲染顺序优先于第二元素的渲染顺序。
在本公开的一个实施例之中,渲染子模块554设置第二渲染图层的渲染顺序优于第一渲染图层的渲染顺序。
根据本公开实施例的第三方面,还提供一种电子设备,包括:处理器;用于存储所述处理器可执行指令的存储器,其中,所述处理器被配置为执行所述指令,以实现如上所述的页面的布局方法。
为了实现上述实施例,本公开还提出了一种存储介质。
其中,当存储介质中的指令由电子设备的处理器执行时,使得电子设备能够执行如上所述的方法。
为了实现上述实施例,本公开还提供一种计算机程序产品。
其中,该计算机程序产品由电子设备的处理器执行时,使得电子设备能够执行如上所述的方法。
图7是根据一示例性实施例示出的一种电子设备框图。图7示出的电子设备仅仅是一个示例,不应对本公开实施例的功能和使用范围带来任何限制。
如图7所示,电子设备1000包括处理器111,其可以根据存储在只读存储器(ROM,Read Only Memory)112中的程序或者从存储器116加载到随机访问存储器(RAM,RandomAccess Memory)113中的程序而执行各种适当的动作和处理。在RAM 113中,还存储有电子设备1000操作所需的各种程序和数据。处理器111、ROM 112以及RAM 113通过总线114彼此相连。输入/输出(I/O,Input / Output)接口115也连接至总线114。
以下部件连接至I/O接口115:包括硬盘等的存储器116;以及包括诸如LAN(局域网,Local Area Network)卡、调制解调器等的网络接口卡的通信部分117,通信部分117经由诸如因特网的网络执行通信处理;驱动器118也根据需要连接至I/O接口115。
特别地,根据本公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信部分117从网络上被下载和安装。在该计算机程序被处理器111执行时,执行本公开的方法中限定的上述功能。
在示例性实施例中,还提供了一种包括指令的存储介质,例如包括指令的存储器,上述指令可由电子设备1000的处理器111执行以完成上述方法。可选地,存储介质可以是非临时性计算机可读存储介质,例如,所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
在本公开中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中,计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线、电线、光缆、RF等等,或者上述的任意合适的组合。
本公开的实施例提供的技术方案至少带来以下有益效果:
在本公开的实施例之中,在进行渲染之前,根据设计需要,变更第一元素至第N元素的渲染顺序,从而使得一次渲染就可以达到预设的效果。例如,通过一次渲染,就可以实现第一元素至第N元素相互叠加的叠加效果,有效地减少了渲染次数。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本公开的真正范围和精神由下面的权利要求指出。
应当理解的是,本公开并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。
Claims (10)
1.一种渲染方法,其特征在于,包括:
获取待渲染页面的多个元素;
从所述多个元素之中提取需符合目标渲染结果的第一至第N元素,其中,N为大于1的正整数;
将所述第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集;设置所述第一渲染图层至所述第N渲染图层之间的渲染顺序;
根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染。
2.如权利要求1所述的方法,其特征在于,所述第一至第N元素包括第一元素和第二元素,且所述第一元素和所述第二元素对应第一渲染图层和第二渲染图层,所述根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染,包括:
将所述多个元素之中的其他元素进行合并,以生成合并元素;
将所述合并元素的渲染指令归入至合并渲染图层对应的指令集;
设置所述第一渲染图层、所述第二渲染图层和所述合并渲染图层之间的渲染顺序;
根据所述第一渲染图层、所述第二渲染图层和所述合并渲染图层的渲染顺序对所述待渲染页面进行渲染。
3.如权利要求2所述的方法,其特征在于,所述目标渲染结果为所述第一元素部分覆盖所述第二元素,其中,所述第一元素的渲染顺序优先于所述第二元素的渲染顺序。
4.如权利要求3所述的方法,其特征在于,所述变更所述第一渲染图层和所述第二渲染图层的渲染顺序,包括:
设置所述第二渲染图层的渲染顺序优于所述第一渲染图层的渲染顺序。
5.一种渲染装置,其特征在于,包括:
元素获取模块,用于获取待渲染页面对应渲染树的多个元素;
提取模块,用于从所述多个元素之中提取目标渲染结果的第一元素至第N元素,其中,N为大于1的正整数;
渲染图层生成模块,用于分别将所述第一元素至第N元素的渲染指令归入至第一渲染图层至第N渲染图层对应的指令集;
渲染顺序设置模块,用于设置所述第一渲染图层至所述第N渲染图层的渲染顺序;
渲染模块,用于根据所述第一渲染图层至所述第N渲染图层的渲染顺序对所述待渲染页面进行渲染。
6.如权利要求5所述的装置,其特征在于,所述第一至第N元素包括第一元素和第二元素,且所述第一元素和所述第二元素对应第一渲染图层和第二渲染图层,所述渲染模块包括:
生成子模块,用于将所述多个元素之中的其他元素进行合并,以生成合并元素;
渲染图层生成子模块,用于将所述合并元素的渲染指令归入至合并渲染图层对应的指令集;
设置子模块,用于设置所述第一渲染图层、所述第二渲染图层和所述合并渲染图层之间的渲染顺序;
渲染子模块,用于根据所述第一渲染图层、所述第二渲染图层和所述合并渲染图层的渲染顺序对所述待渲染页面进行渲染。
7.如权利要求6所述的装置,其特征在于,所述目标渲染结果为所述第一元素部分覆盖所述第二元素,其中,所述第一元素的渲染顺序优先于所述第二元素的渲染顺序。
8.如权利要求7所述的装置,其特征在于,所述渲染子模块设置所述第二渲染图层的渲染顺序优于所述第一渲染图层的渲染顺序。
9.一种电子设备,其特征在于,包括:
处理器;
用于存储所述处理器可执行指令的存储器;
其中,所述处理器被配置为执行所述指令,以实现如权利要求1至4中任一项所述的渲染方法。
10.一种非临时性计算机可读存储介质,其特征在于,当所述非临时性计算机可读存储介质中的指令由电子设备的处理器执行时,使得电子设备能够执行如权利要求1至4中任一项所述的渲染方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110020882.8A CN112346811A (zh) | 2021-01-08 | 2021-01-08 | 渲染方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110020882.8A CN112346811A (zh) | 2021-01-08 | 2021-01-08 | 渲染方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN112346811A true CN112346811A (zh) | 2021-02-09 |
Family
ID=74427372
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202110020882.8A Pending CN112346811A (zh) | 2021-01-08 | 2021-01-08 | 渲染方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN112346811A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113822961A (zh) * | 2021-09-22 | 2021-12-21 | 广州博冠信息科技有限公司 | 对3d模型进行2d渲染的方法、装置、设备及介质 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103559730A (zh) * | 2013-11-20 | 2014-02-05 | 广州博冠信息科技有限公司 | 一种渲染方法及装置 |
US20140122983A1 (en) * | 2012-10-30 | 2014-05-01 | Nokia Corporation | Method and apparatus for providing attribution to the creators of the components in a compound media |
CN108648249A (zh) * | 2018-05-09 | 2018-10-12 | 歌尔科技有限公司 | 一种图像渲染方法、装置及智能穿戴设备 |
-
2021
- 2021-01-08 CN CN202110020882.8A patent/CN112346811A/zh active Pending
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20140122983A1 (en) * | 2012-10-30 | 2014-05-01 | Nokia Corporation | Method and apparatus for providing attribution to the creators of the components in a compound media |
CN103559730A (zh) * | 2013-11-20 | 2014-02-05 | 广州博冠信息科技有限公司 | 一种渲染方法及装置 |
CN108648249A (zh) * | 2018-05-09 | 2018-10-12 | 歌尔科技有限公司 | 一种图像渲染方法、装置及智能穿戴设备 |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113822961A (zh) * | 2021-09-22 | 2021-12-21 | 广州博冠信息科技有限公司 | 对3d模型进行2d渲染的方法、装置、设备及介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107392842B (zh) | 图像风格化处理方法、装置、计算设备及计算机存储介质 | |
CN108830235A (zh) | 用于生成信息的方法和装置 | |
CN104735468A (zh) | 一种基于语义分析将图像合成新视频的方法及系统 | |
US9342498B2 (en) | System and method for generating a design template based on graphical input | |
CN106250104A (zh) | 一种针对服务器的远程操作系统、方法及装置 | |
US11880912B2 (en) | Image processing method, image processing system, and program for colorizing line-drawing images using machine learning | |
CN112346811A (zh) | 渲染方法及装置 | |
CN104052626A (zh) | 配置网元数据的方法、装置和系统 | |
US10628981B2 (en) | Techniques for editing vector graphics documents | |
CN115731313A (zh) | Svg格式的图片的处理方法、装置、设备、介质及产品 | |
CN109327321A (zh) | 网络模型业务执行方法、装置、sdn控制器及可读存储介质 | |
CN105407114A (zh) | 处理Zookeeper集群数据的客户端及方法 | |
CN104461548A (zh) | 代码片段的添加方法和装置 | |
CN106453213A (zh) | 一种系统间调用方法及装置 | |
CN114816170A (zh) | 规则方案生成方法、装置、介质及电子设备 | |
CN109582776B (zh) | 模型的生成方法及装置、电子设备及存储介质 | |
CN105740260B (zh) | 提取模板文件数据结构的方法和装置 | |
CN114449063B (zh) | 一种报文处理方法、装置及设备 | |
CN110209694A (zh) | 数据处理方法及装置 | |
CN103176843B (zh) | MapReduce分布式系统的文件迁移方法及设备 | |
CN105260405B (zh) | 一种网络爬虫方法及装置 | |
KR101743868B1 (ko) | 이미지 프로세싱 방법 및 그 시스템 | |
CN110312990A (zh) | 配置方法及系统 | |
CN114816376A (zh) | 一种基于流程引擎的拖拽式服务编排方法及系统 | |
CN114741173A (zh) | Dag任务编排的方法、装置、电子设备和存储介质 |
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 |