CN102402789A

CN102402789A - 一种图像绘制方法和装置

Info

Publication number: CN102402789A
Application number: CN2010102877927A
Authority: CN
Inventors: 库宇
Original assignee: Tencent Technology Shenzhen Co Ltd
Current assignee: Shenzhen Tencent Computer Systems Co Ltd
Priority date: 2010-09-17
Filing date: 2010-09-17
Publication date: 2012-04-04
Anticipated expiration: 2030-09-17
Also published as: CN102402789B

Abstract

本发明公开了一种图像绘制方法，当需要绘制任一图像时，该方法包括：生成用于绘制该图像的控件，并按照该图像的效果需求，将所述控件划分为一个以上区域；在不同区域内分别绘制指定的不同效果。本发明同时公开了一种图像绘制装置。应用本发明所述的方法和装置，能够降低绘制开销和内存占用开销。

Description

一种图像绘制方法和装置

技术领域

本发明涉及计算机技术，特别涉及一种图像绘制方法和装置。

背景技术

即时通讯(IM，Instant Messaging)工具发展到今天，已经被绝大多数用户所接受，并成为很多用户必不可少的软件工具，不但在平时的休闲娱乐中，而且在日常工作中也得到了广泛应用。

即时通讯工具主要实现的是一对一的单独聊天或一对N的群或讨论组的聊天模式，其交互方式是对话式的，是最原始，也是最自然的，但效率较低，通常需要很多对话才能表示一个完整的意思。为此，又出现了博客和微博，这两种工具没有明确的对象，意思相对比较完整，是一种一对无穷的聊天模式。尤其是微博，由于其门槛较低，更受用户喜爱，用户可以通过140个字左右的一句话来表达自己。

在微博工具中，头像有着广泛的应用，它可以使其他人更为直接地了解用户的信息。现有微博头像的绘制方式主要为多个控件累加的方式，即根据微博头像的效果需求，生成多个控件，每个控件绘制指定的效果，然后将多个控件进行组合。举例来说：假设要绘制用户A的微博头像，并显示边缘高亮的效果，那么至少需要2个控件，一个为头像控件，另一个为中间透明的亮边控件，亮边控件中间透明的区域正好可以透过头像控件；将亮边控件覆盖在头像控件之上，即可绘制出所需的效果。

但是，上述方式在实际应用中会存在一定的问题：由于绘制每个头像均需要用到多个控件，这样，当需要绘制大量的头像时，就会需要用到非常多的控件，从而带来巨大的绘制开销和内存占用开销。

以上仅以微博头像的绘制为例进行说明，在实际应用中，对于任一图像的绘制，都会存在上述问题。

发明内容

有鉴于此，本发明的主要目的在于提供一种图像绘制方法，能够降低绘制开销和内存占用开销。

本发明的另一目的在于提供一种图像绘制装置，能够降低绘制开销和内存占用开销。

为达到上述目的，本发明的技术方案是这样实现的：

一种图像绘制方法，当需要绘制任一图像时，该方法包括：

生成用于绘制所述图像的控件，并按照所述图像的效果需求，将所述控件划分为一个以上区域；

在不同区域内分别绘制指定的不同效果。

一种图像绘制装置，包括：

生成单元，用于当需要绘制任一图像时，生成用于绘制所述图像的控件，并按照所述图像的效果需求，将所述控件划分为一个以上区域；

绘制单元，用于在不同区域内分别绘制指定的不同效果。

可见，采用本发明的技术方案，当需要绘制任一图像时，只需用到一个控件即可，相比于现有技术中需要用到多个控件的方式，较好地降低了绘制开销和内存占用开销。

附图说明

图1为本发明方法实施例的流程图。

图2为本发明示例中划分出的各区域示意图。

图3为本发明装置实施例的组成结构示意图。

具体实施方式

针对现有技术中存在的问题，本发明中提出一种全新的图像绘制方式，即分区自绘方式。

图1为本发明方法实施例的流程图。如图1所示，包括以下步骤：

步骤11：当需要绘制任一图像时，生成用于绘制该图像的控件，并按照该图像的效果需求，将所述控件划分为一个以上区域。

假设要绘制用户A的微博头像，并显示边缘高亮的效果，那么只需要将控件划分为两个区域即可，相比于现有技术，至少减少了一个控件。

步骤12：在不同区域内分别绘制指定的不同效果。

如何生成控件以及如何在不同区域内绘制不同的效果均为现有技术。

上述步骤11中，假设为用户A的微博头像显示边缘高亮的效果，在实际应用中，除边缘高亮效果外，通常还会显示有其它效果，如圆角头像效果等，这种情况下，则不能仅将控件划分为两个区域。

图2为本发明示例中划分出的各区域示意图。如图2所示，包括：真实头像区域、圆角头像区域、头像阴影区域、高亮边缘区域、屏蔽用户标志区域。

其中，真实图像区域，用于绘制用户头像；

圆角头像区域，用于绘制圆角头像的效果；

头像阴影区域，用于绘制阴影投射的效果；

高亮边缘区域，用于绘制边缘高亮的效果；

屏蔽用户标志区域，用于当屏蔽掉该微博头像对应的用户时，在该区域内绘制屏蔽用户标志。

对于上述高亮边缘区域来说，可在当监听到用户的鼠标移入到微博头像占用的区域时，在高亮边缘区域内绘制边缘高亮效果，反之，当监听到用户的鼠标移出微博头像占用的区域时，去除边缘高亮效果；对于上述屏蔽用户标志区域来说，可在当监听到屏蔽微博头像对应的用户的指令时，在屏蔽用户标志区域内绘制屏蔽用户标志，反之，当监听到解除屏蔽微博头像对应的用户的指令时，去除屏蔽用户标志。

较佳地，如图2所示，通常，各区域之间满足如下关系：

真实头像区域的长宽比和控件的长宽比相同；

真实头像区域的中心点以及圆角头像区域的中心点均与控件的中心点重合，圆角头像区域和真实头像区域的长度和宽度均相同(图2中为表述方便，将圆角头像区域画得略大于真实头像区域)；

头像阴影区域包括真实头像区域，其长度大于真实头像区域的长度但小于高亮边缘区域的长度，且宽度大于真实头像区域的宽度但小于高亮边缘区域的宽度；通常，真实头像区域的左上角的纵坐标与头像阴影区域的左上角的纵坐标相同，即在真实头像区域的上面不绘制阴影效果；

头像阴影区域包括屏蔽用户标志区域；屏蔽用户标志区域的长度小于真实头像区域的长度，且宽度小于真实头像区域的宽度；

高亮边缘区域与控件的长度和宽度均相同。

举例说明：

假设控件的长度和宽度均为44个像素点，同样，高亮边缘区域的长度和宽度也均为44个像素点，并假设高亮边缘区域的左上角的坐标点为(0，0)，右下角的坐标点为(W，H)，所述W和H的取值均为43；那么，当真实头像区域的长度和宽度均为40个像素点时，其左上角坐标将为(2，2)，其右下角坐标将为(W-2，H-2)，同样，圆角头像区域的左上角坐标也为(2，2)，右下角坐标也为(W-2，H-2)；头像阴影区域的左上角的坐标可为(1，2)，右下角的坐标可为(W-1，H-1)；屏蔽用户标志区域的左上角的坐标可为(1，H-H1-1)，右下角的坐标可为(1+W1，H-1)，W1表示屏蔽用户标志的长度，H1表示屏蔽用户标志的宽度。

另外，在具体绘制上述各区域时，可按照头像阴影区域、真实头像区域、圆角头像区域、屏蔽用户标志区域、高亮边缘区域的顺序依次进行绘制，即最早绘制头像阴影区域。如何绘制各区域的效果为现有技术，比如绘制头像阴影区域的效果就是绘制一个呈现圆角效果的蒙板，该蒙板的中间为透明区域，可透过用户的头像。

需要说明的是，图2所示仅为举例说明，并不用于限制本发明的技术方案，在实际应用中，具体显示哪些效果可根据实际需要而定，因此图2中除真实头像区域以外的其它区域均不是必需的；当然，还可能包括图2所示各区域以外的其它区域。

基于上述方法，图3为本发明装置实施例的组成结构示意图。如图3所示，包括：

生成单元31，用于当需要绘制任一图像时，生成用于绘制该图像的控件，并按照该图像的效果需求，将控件划分为一个以上区域；

绘制单元32，用于在不同区域内分别绘制指定的不同效果。

其中，当所述图像为用户的微博头像时，所述一个以上区域包括：真实头像区域以及以下区域之一或任意组合：圆角头像区域、头像阴影区域、高亮边缘区域、屏蔽用户标志区域；

绘制单元32在真实头像区域内绘制用户头像，在圆角头像区域内绘制圆角头像效果，在头像阴影区域内绘制阴影投射效果，并在当监听到用户的鼠标移入到微博头像占用的区域时，在高亮边缘区域内绘制边缘高亮效果，当监听到屏蔽微博头像对应的用户的指令时，在屏蔽用户标志区域内绘制屏蔽用户标志。

其中，真实头像区域的长宽比和控件的长宽比相同；真实头像区域的中心点以及圆角头像区域的中心点均与控件的中心点重合，圆角头像区域和真实头像区域的长度和宽度均相同；头像阴影区域包括真实头像区域，其长度大于真实头像区域的长度但小于高亮边缘区域的长度，且宽度大于真实头像区域的宽度但小于高亮边缘区域的宽度；通常，真实头像区域的左上角的纵坐标与头像阴影区域的左上角的纵坐标相同；头像阴影区域包括屏蔽用户标志区域；屏蔽用户标志区域的长度小于真实头像区域的长度，且宽度小于真实头像区域的宽度；高亮边缘区域与控件的长度和宽度均相同。

在实际应用中，绘制单元32将按照头像阴影区域、真实头像区域、圆角头像区域、屏蔽用户标志区域、高亮边缘区域的顺序依次绘制指定的不同效果。

总之，采用本发明的技术方案，能够降低绘制开销和内存占用开销。

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

Claims

1.一种图像绘制方法，其特征在于，当需要绘制任一图像时，该方法包括：

在不同区域内分别绘制指定的不同效果。

2.根据权利要求1所述的方法，其特征在于，当所述图像为用户的微博头像时，所述一个以上区域包括：真实头像区域以及以下区域之一或任意组合：圆角头像区域、头像阴影区域、高亮边缘区域、屏蔽用户标志区域；

所述在不同区域内分别绘制指定的不同效果包括：

在所述真实头像区域内绘制用户头像，在所述圆角头像区域内绘制圆角头像效果，在所述头像阴影区域内绘制阴影投射效果；

当监听到用户的鼠标移入到所述微博头像占用的区域时，在所述高亮边缘区域内绘制边缘高亮效果；当监听到屏蔽所述微博头像对应的用户的指令时，在所述屏蔽用户标志区域内绘制屏蔽用户标志。

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

所述真实头像区域的长宽比和所述控件的长宽比相同；

所述真实头像区域的中心点以及所述圆角头像区域的中心点均与所述控件的中心点重合，所述圆角头像区域和所述真实头像区域的长度和宽度均相同；

所述头像阴影区域包括所述真实头像区域，其长度大于所述真实头像区域的长度但小于所述高亮边缘区域的长度，且宽度大于所述真实头像区域的宽度但小于所述高亮边缘区域的宽度；

所述头像阴影区域包括所述屏蔽用户标志区域；所述屏蔽用户标志区域的长度小于所述真实头像区域的长度，且宽度小于所述真实头像区域的宽度；

所述高亮边缘区域与所述控件的长度和宽度均相同。

4.根据权利要求3所述的方法，其特征在于，所述真实头像区域的左上角的纵坐标与所述头像阴影区域的左上角的纵坐标相同。

5.根据权利要求2、3或4所述的方法，其特征在于，所述在不同区域内分别绘制指定的不同效果包括：按照头像阴影区域、真实头像区域、圆角头像区域、屏蔽用户标志区域、高亮边缘区域的顺序依次绘制指定的不同效果。

6.一种图像绘制装置，其特征在于，包括：

绘制单元，用于在不同区域内分别绘制指定的不同效果。

7.根据权利要求6所述的装置，其特征在于，当所述图像为用户的微博头像时，所述一个以上区域包括：真实头像区域以及以下区域之一或任意组合：圆角头像区域、头像阴影区域、高亮边缘区域、屏蔽用户标志区域；

所述绘制单元在所述真实头像区域内绘制用户头像，在所述圆角头像区域内绘制圆角头像效果，在所述头像阴影区域内绘制阴影投射效果，并在当监听到用户的鼠标移入到所述微博头像占用的区域时，在所述高亮边缘区域内绘制边缘高亮效果，当监听到屏蔽所述微博头像对应的用户的指令时，在所述屏蔽用户标志区域内绘制屏蔽用户标志。

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

所述真实头像区域的长宽比和所述控件的长宽比相同；

所述高亮边缘区域与所述控件的长度和宽度均相同。

9.根据权利要求8所述的装置，其特征在于，所述真实头像区域的左上角的纵坐标与所述头像阴影区域的左上角的纵坐标相同。

10.根据权利要求7、8或9所述的装置，其特征在于，所述绘制单元按照头像阴影区域、真实头像区域、圆角头像区域、屏蔽用户标志区域、高亮边缘区域的顺序依次绘制指定的不同效果。