CN105138311A - 一种提高图形绘制效率的方法及装置 - Google Patents

Abstract

本发明实施例公开了一种提高图形绘制效率的方法及装置，所述方法包括：获取当前帧图形上各节点的显示属性；检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；只有在检测到各节点的显示属性发生了变化时，才根据各节点的显示属性对所述图形进行重绘，以及，对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘。本实施例中的这种图形绘制方式不但能够减少重绘的次数，更能够减少检测节点显示属性是否发生变化的次数，从而真正提高图形绘制效率，降低不必要的CPU资源等的消耗。

Description

一种提高图形绘制效率的方法及装置

技术领域

本发明涉及图像处理技术领域，尤其是涉及一种提高图形绘制效率的方法及装置。

背景技术

为了在终端设备显示动态的画面，绘图程序通常会以一定的频率或者说是帧率不断的对图形进行重绘，即将旧的图形擦除并绘制出新的图形，以保证图形的切换能被实时的显示出来，从而形成流畅的动态画面效果。以基于HTML5的游戏为例，目前常见的方式是通过Canvas(画布)容器每秒钟对图形重绘X次来确保游戏画面的流畅，其中X通常大于30小于60。

发明人在实现本发明的过程中发现，现有技术这种图形重绘方式适用于画面不断变化的场景，例如动作类游戏中。但对于画面变化不频繁的场景，例如一些棋牌游戏，很多时候重绘后的画面与没重绘前是一样的，若也采用这种重绘方式，会带来不必要的CPU资源等的消耗。

发明内容

为克服现有技术中存在的问题，本发明提供一种提高图形绘制效率的方法及装置，以降低不必要的CPU资源等消耗。

根据本公开实施例的第一方面，提供了一种提高图形绘制效率的方法，所述方法包括：

获取当前帧图形上各节点的显示属性；

检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；

只有在检测到各节点的显示属性发生了变化时，才根据各节点的显示属性对所述图形进行重绘，以及，

对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘。

可选的，所述方法还包括：

在所述对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘的步骤之后，返回所述获取当前帧图形上各节点的显示属性的步骤。

可选的，所述方法还包括：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘；

返回所述获取当前帧图形上各节点的显示属性的步骤。

可选的，所述节点的显示属性包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色；

所述各节点的显示属性发生了变化，包括：

任一节点的任一元素发生了变化。

可选的，所述方法还包括：

在所述检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况的步骤之后，在检测到各节点的显示属性均未发生变化时，则不执行所述根据所述各节点的显示属性对所述图形进行重绘的步骤，而是返回所述获取当前帧图形上各节点的显示属性的步骤。

根据本公开实施例的第二方面，提供了一种提高图形绘制效率的装置，所述装置包括：

显示属性获取单元，用于获取当前帧图形上各节点的显示属性；

变化检测单元，用于检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；

重绘控制单元，用于只有在所述变化检测单元检测到各节点的显示属性发生了变化时，才触发重绘单元，以及，对于随后的第一预定数目的帧，每次触发了显示属性获取单元后直接触发重绘单元；

重绘单元，用于根据各节点的显示属性对所述图形进行重绘。

可选的，所述装置还包括：

循环控制单元，用于在所述重绘控制单元执行完毕之后，重新触发所述显示属性获取单元。

可选的，所述重绘控制单元还用于：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次触发了所述显示属性获取单元后直接触发所述重绘单元；然后再触发一次所述显示属性获取单元。

可选的，

所述节点的显示属性包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色；

所述各节点的显示属性发生了变化，包括：

任一节点的任一元素发生了变化。

可选的，所述重绘控制单元还用于：

在所述变化检测单元检测到各节点的显示属性均未发生变化时，则不触发所述重绘单元以不执行根据所述各节点的显示属性对所述图形进行重绘的操作，而是触发所述显示属性获取单元以获取当前帧图形上各节点的显示属性。

本发明实施例提供的技术方案可以包括以下有益效果：

本发明实施例中，在进行重绘前，不但先对是否有图形节点的显示属性发生了变化进行检测，只有当发现有变化时才进行重绘操作，而且更为重要的是，为了减少上述检测的次数，会对随后的一系列帧都默认进行直接的重绘。本发明实施例中的这种图形绘制方式不但能够减少重绘的次数，更能够减少检测节点显示属性是否发生变化的次数，从而真正提高图形绘制效率，降低不必要的CPU资源等的消耗。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本发明。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本发明的实施例，并与说明书一起用于解释本发明的原理。

图1是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图；

图2是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图；

图3是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图；

图4是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图；

图5是根据一示例性实施例示出的一种提高图形绘制效率的装置的框图；

图6是根据一示例性实施例示出的一种提高图形绘制效率的装置的框图。

具体实施方式

这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本发明相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本发明的一些方面相一致的装置和方法的例子。

图1是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图。该方法可用于终端设备中，如手机、平板电脑、PC(个人电脑)等。参见图1所示，该方法可以包括以下步骤：

S101、获取当前帧图形上各节点的显示属性。

绘图程序，例如基于HTML5的游戏引擎，通常是基于图形上的节点来进行绘图的。图形可对应一棵渲染树，这棵渲染树有一个根以及众多枝叶，根及枝叶都可统称为图形节点，简称节点。

图形节点具有显示属性，在本实施例或本发明其他某些实施例中，节点的显示属性可以包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色。

图形节点的显示属性可以被其他应用程序所更改，从而使图形发生变化。绘图程序通过遍历各图形节点并在遍历中执行更新显示属性的操作，可以获取到每个节点在当前帧时的显示属性。

S102、检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况。

在本实施例中，获取到当前帧时图形上各节点的显示属性后，并不直接根据显示属性对图形进行重绘，而是先检测各节点的显示属性与前一帧时相比的变化情况，然后再决定是否重绘。

在本实施例或本发明其他某些实施例中，所述各节点的显示属性发生了变化，可以包括：

任一节点的任一元素发生了变化。

也即只要检测到任一节点的任一元素发生了变化，即可得到各节点的显示属性发生了变化这一结论。相反的，若检测到任一节点的任一元素都未发生变化，则可得到各节点的显示属性均未发生变化这一结论。

S103、只有在检测到各节点的显示属性发生了变化时，才根据各节点的显示属性对所述图形进行重绘，以及，对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘。

对于每一帧，在增加了检测各节点显示属性是否变化的操作后，虽然能够减少重绘的次数，但也带了弊端：每次(也即每一帧)都需要进行检测，这样使得检测的次数过多，不利于提高绘图效率。在步骤S103中，在检测到各节点的显示属性发生了变化后，除了对当前帧进行重绘外，对于随后依次到来的第一预定数目的帧的每一帧，均采取直接重绘的操作，不再检测各节点显示属性是否变化，从而减少了检测各节点显示属性是否变化的次数，真正提高了图形绘制的效率，进而降低了不必要的CPU资源等消耗。

参见图2所示，在本实施例或本发明其他某些实施例中，在所述对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘的步骤之后：

返回所述获取当前帧图形上各节点的显示属性的步骤。也即返回步骤101。

这样步骤S101至S103便可循环起来，进行持续的绘图。

另外，参见图3所示，在本实施例或本发明其他某些实施例中，在所述检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况的步骤之后，所述方法还可以包括：

S104、在检测到各节点的显示属性均未发生变化时，则不执行所述根据所述各节点的显示属性对所述图形进行重绘的步骤，而是返回所述获取当前帧图形上各节点的显示属性的步骤，也即跳回步骤S101。

这样在检测到各节点的显示属性均未发生变化时不进行重绘，可以减少重绘的次数，也提高了图形绘制的效率，进而降低了不必要的CPU资源等消耗。

此外，所述方法还可以包括：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘；

然后，返回所述获取当前帧图形上各节点的显示属性的步骤。

这样，可以进一步减少检测各节点显示属性是否变化的次数，从而进一步提高图形绘制的效率。

下面结合具体场景对本发明进行进一步描述。

图4是根据一示例性实施例示出的一种提高图形绘制效率的方法的流程图。在本实施例场景下，Javascript可以根据Canvas提供的绘图接口在浏览器中进行图形绘制，帧率为每秒35帧，每帧图形之间的间隔为1/35秒，也即每隔1/35秒就允许对图形重绘一次。

S401、遍历所有图形节点，并在遍历过程中获取每个图形节点的显示属性。图形节点的显示属性能够被其他应用程序修改，例如应用程序可以通过Javascript来调用setX方法来修改图形节点的x轴坐标数值。通过执行更新的操作，可以获取到每个节点在当前这一帧的显示属性。

S402、判断是否有图形节点的显示属性发生了变化。如果有节点的显示属性发生了变化，则进入步骤S404，否则进入步骤S403。

S403、等待1/35秒，然后跳回步骤S401。即等待下一帧，然后判断下一帧是否需要重绘。

S404、调用Canvas的绘图接口，根据各图形节点的显示属性对图形进行重绘。

S405、等待1/35秒。

S406、遍历所有图形节点，并在遍历过程中获取每个图形节点的显示属性。

S407、调用Canvas的绘图接口，根据各图形节点的显示属性对图形进行重绘。此时不再进行节点显示属性是否变化的判断。

S408、判断通过执行S407是否已完成对N帧的重绘。也即在步骤S404之后是否已完成了N次重绘。N值可以根据情况而设置。

如果是，则进入步骤S409；如果否，则跳回步骤S405。

S409、等待1/35秒，然后跳回步骤S401。即开启新一轮循环。

在本实施例中，在进行重绘前，不但先对是否有图形节点的显示属性发生了变化进行检测，只有当发现有变化时才进行重绘操作，而且更为重要的是，为了减少上述检测的次数，会对随后的一系列帧都默认进行直接的重绘。本实施例中的这种图形绘制方式不但能够减少重绘的次数，更能够减少检测节点显示属性是否发生变化的次数，从而真正提高图形绘制效率，降低不必要的CPU资源等的消耗。

图5是根据一示例性实施例示出的一种提高图形绘制效率的装置的框图。所述装置可以包括：

显示属性获取单元501，用于获取当前帧图形上各节点的显示属性；

变化检测单元502，用于检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；

重绘控制单元503，用于只有在所述变化检测单元检测到各节点的显示属性发生了变化时，才触发重绘单元，以及，对于随后的第一预定数目的帧，每次触发了显示属性获取单元后直接触发重绘单元；

重绘单元504，用于根据各节点的显示属性对所述图形进行重绘。

参见图6所示，在本实施例或本发明其他某些实施例中，所述装置还可以包括：

循环控制单元505，用于在所述重绘控制单元执行完毕之后，重新触发所述显示属性获取单元。

在本实施例或本发明其他某些实施例中，所述重绘控制单元还可以用于：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次触发了所述显示属性获取单元后直接触发所述重绘单元；然后再触发一次所述显示属性获取单元。

在本实施例或本发明其他某些实施例中，

所述节点的显示属性可以包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色；

所述各节点的显示属性发生了变化，可以包括：

任一节点的任一元素发生了变化。

在本实施例或本发明其他某些实施例中，所述重绘控制单元还可以用于：

在所述变化检测单元检测到各节点的显示属性均未发生变化时，则不触发所述重绘单元以不执行根据所述各节点的显示属性对所述图形进行重绘的操作，而是触发所述显示属性获取单元以获取当前帧图形上各节点的显示属性。

关于上述实施例中的装置，其中各个单元执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。

在本实施例中，在进行重绘前，不但先对是否有图形节点的显示属性发生了变化进行检测，只有当发现有变化时才进行重绘操作，而且更为重要的是，为了减少上述检测的次数，会对随后的一系列帧都默认进行直接的重绘。本实施例中的这种图形绘制方式不但能够减少重绘的次数，更能够减少检测节点显示属性是否发生变化的次数，从而真正提高图形绘制效率，降低不必要的CPU资源等的消耗.

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本发明的其它实施方案。本申请旨在涵盖本发明的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本发明的一般性原理并包括本申请未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本发明的真正范围和精神由权利要求指出。

应当理解的是，本发明并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本发明的范围仅由所附的权利要求来限制。

Claims (10)

1.一种提高图形绘制效率的方法，其特征在于，所述方法包括：

获取当前帧图形上各节点的显示属性；

检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；

只有在检测到各节点的显示属性发生了变化时，才根据各节点的显示属性对所述图形进行重绘，以及，

对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘。

2.根据权利要求1所述的方法，其特征在于，所述方法还包括：

在所述对于随后的第一预定数目的帧，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘的步骤之后，返回所述获取当前帧图形上各节点的显示属性的步骤。

3.根据权利要求1所述的方法，其特征在于，所述方法还包括：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次获取到各节点的显示属性后根据获取的各节点的显示属性直接对所述图形进行重绘；

返回所述获取当前帧图形上各节点的显示属性的步骤。

4.根据权利要求1所述的方法，其特征在于，

所述节点的显示属性包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色；

所述各节点的显示属性发生了变化，包括：

任一节点的任一元素发生了变化。

5.根据权利要求1所述的方法，其特征在于，所述方法还包括：

在所述检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况的步骤之后，在检测到各节点的显示属性均未发生变化时，则不执行所述根据所述各节点的显示属性对所述图形进行重绘的步骤，而是返回所述获取当前帧图形上各节点的显示属性的步骤。

6.一种提高图形绘制效率的装置，其特征在于，所述装置包括：

显示属性获取单元，用于获取当前帧图形上各节点的显示属性；

变化检测单元，用于检测各节点的显示属性与前一帧时各节点的显示属性相比的变化情况；

重绘控制单元，用于只有在所述变化检测单元检测到各节点的显示属性发生了变化时，才触发重绘单元，以及，对于随后的第一预定数目的帧，每次触发了显示属性获取单元后直接触发重绘单元；

重绘单元，用于根据各节点的显示属性对所述图形进行重绘。

7.根据权利要求6所述的装置，其特征在于，所述装置还包括：

循环控制单元，用于在所述重绘控制单元执行完毕之后，重新触发所述显示属性获取单元。

8.根据权利要求6所述的装置，其特征在于，所述重绘控制单元还用于：

若对于连续的第二预定数目的帧，每次检测到的各节点的显示属性均未发生变化，则在随后的指定时长内，每次触发了所述显示属性获取单元后直接触发所述重绘单元；然后再触发一次所述显示属性获取单元。

9.根据权利要求6所述的装置，其特征在于，

所述节点的显示属性包括以下元素中的一种或多种：节点的x坐标、节点的y坐标、节点的宽度、节点的高度、节点的旋转角度、节点的倾斜角度、节点的透明度、节点的可见性以及节点的颜色；

所述各节点的显示属性发生了变化，包括：

任一节点的任一元素发生了变化。

10.根据权利要求6所述的装置，其特征在于，所述重绘控制单元还用于：

在所述变化检测单元检测到各节点的显示属性均未发生变化时，则不触发所述重绘单元以不执行根据所述各节点的显示属性对所述图形进行重绘的操作，而是触发所述显示属性获取单元以获取当前帧图形上各节点的显示属性。