WO2012024988A1

WO2012024988A1 - 一种头像相框的生成方法和系统

Info

Publication number: WO2012024988A1
Application number: PCT/CN2011/077144
Authority: WO
Inventors: 谢伟文; 陈彬
Original assignee: Tencent Technology Shenzhen Co Ltd
Current assignee: Tencent Technology Shenzhen Co Ltd
Priority date: 2010-08-24
Filing date: 2011-07-14
Publication date: 2012-03-01
Anticipated expiration: 2013-02-24
Also published as: CN102376098A; CN102376098B

Description

一种头像相框的生成方法和系统本申请要求于 2010 年 08 月 24 日提交中国专利局、申请号为 201010267143.0、发明名称为 "一种头像相框的生成方法和系统" 的中国专利申请的优先权，其全部内容通过引用结合在本申请中。技术领域

本发明属于图像处理领域，尤其涉及一种头像相框的生成方法和系统。发明背景

随着网络通讯技术的发展，网络即时通讯工具的应用也越来越普遍。在网络即时通讯工具中使用代表用户的头像相框也越来越普遍。在现有的即时通讯客户端上的头像相框一般为方形的，并且位置固定、风格单一，而且该头像相框仅包括用户头像，比较死板，缺乏生动效果，另外现有的头像相框一般为静态的，不能与用户进行互动。发明内容

本发明实施例的目的在于提供一种头像相框的生成方法，旨在解决现有的头像相框为静态的、且风格单一的问题。

本发明实施例是这样实现的，一种头像相框的生成方法，所述方法包括下述步骤：

从素材库中选择用于生成头像相框的各素材，所述素材库包括头像素材库、相框素材库以及装饰素材库；

按照预设的与用于生成头像相框的各素材对应的素材输出属性输出选择的素材，以生成头像相框。

本发明实施例的另一目的在于提供一种头像相框生成系统，所述系统包括：

素材库，用于存储用于生成头像相框的各种素材，所述素材库包括头像素材库、相框素材库以及装饰素材库；

素材获取单元，用于从所述素材库中选择用于生成头像相框的素材；头像相框生成单元，用于按照预设的与各素材对应的素材输出属性输出选择的素材，以生成头像相框。

在本发明实施例中，通过按照预设的与各素材对应的素材输出属性输出选择的素材，以生成目标头像相框，从而可以由用户设置素材，动态生成头像相框，使生成的头像相框具有动态变换效果，而且位置灵活多变。附图简要说明

图 1 是本发明第一实施例提供的头像相框的生成方法的实现流程图；

图 2是本发明实施例提供的头像相框的示例图；

图 3 是本发明第二实施例提供的头像相框的生成方法的实现流程图；

图 4是本发明实施例提供的头像相框的普通状态的示例图；图 5是本发明实施例提供的头像相框的互动状态的示例图；图 6是本发明实施例提供的头像相框的收起状态的示例图；图 7是本发明实施例提供的头像相框在各种状态之间进行切换的示例图；

图 8是本发明实施例提供的各种头像相框的示例图；图 9 是本发明第三实施例提供的头像相框的生成方法的实现流程图；

图 10、 11、 12是本发明实施提供的头像相框互动效果的示意图；图 13是本发明第四实施例提供的头像相框生成系统的结构框图；图 14是本发明第五实施例提供的头像相框生成系统的结构框图。实施本发明的方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

在本发明实施例中，提供了一种包括头像显示区、相框显示区和装饰显示区的头像相框，通过采用相同或者不同的变换方式分别对生成头像相框所需的头像素材、相框素材以及装饰素材进行变换，并在头像显示区显示变换后的头像素材，在相框显示区显示变换后的相框素材，在装饰显示区显示变换后的装饰素材，从而可以生成位置灵活多变、并具有动态变换效果的头像相框。

实施例一：

图 1 是本发明第一实施例提供的头像相框的生成方法的实现流程图，详述如下：

在步骤 S101中，从素材库中选择用于生成头像相框的各素材。其中，素材库中存储有用于生成各种头像相框的各种素材。该素材库包括但不限于头像素材库、相框素材库、装饰素材库等。

其中，头像素材库中存储构成头像相框中的用户头像的头像素材，该头像素材可以为任意格式的图片，如 bmp、 jpg、 png、 gif等格式的图片。相框素材库中存储构成头像相框中相框的相框素材，该相框素材是采用矢量绘制的矢量图片。由于矢量图片在进行放大、旋转等变换时都不会失真，因此更适合用于呈现出逼真的动态效果的场景。

装饰素材库中存储构成头像相框中相框装饰的装饰素材，该装饰素材也是采用采用矢量绘制的矢量图片。在本发明实施例中，为了达到更好的动态效果，装饰素材库中的每一种装饰素材都可以包括不同数量的装饰小部件。

在步骤 S102中，按照预设的、与用于生成头像相框的各素材对应的素材输出属性输出选择的素材，以生成头像相框。

在本发明实施例中，需要预先为用于生成头像相框的每一种素材都设置对应的素材输出属性。其中素材输出属性包括但不限于输出位置、输出时间、变换方式等，还可以包括透明度和堆叠顺序等。其中输出位置是指用于生成头像相框的素材的输出位置。输出时间是指用于生成头像相框的素材的输出时间。变换方式是指对用于生成头像相框的素材进行变换所采用的变换方式。其中变换方式包括但不限于缩放变换、旋转变换和位移变换等。透明度是指输出的各素材的透明度。堆叠顺序是指输出的各素材所在图层的呈现顺序，当两个素材所在的图层有重叠时，则堆叠顺序越高的素材所在的图层总是处于堆叠顺序较低的素材所在的图层的上面。

在本发明实施例中，在设置用于生成头像相框的素材的输出时间时，可以为用于生成头像相框的各个素材设置输出时间顺序，这样在按照预设的与各素材对应的素材输出属性输出选择的素材，以生成头像相框时，可以使用于生成头像相框的各个素材按照设置的输出时间顺序顺次输出，从而使生成头像相框的过程实现动态变化效果。

另外通过为各个素材设置相同或者不同的变换方式，从而在输出各个素材的过程中，可以使各个素材达到动态变化的效果，从而使生成的头像相框也达到动态变化的效果。

在本发明实施例中，当选择的用于生成头像相框的装饰素材包括不同数量的装饰小部件时，预先为该装饰素材包括的各种装饰小部件设置对应的部件输出属性，在输出该装饰素材时，按照预设的与该装饰素材包括的各种装饰小部件对应的部件输出属性输出该装饰素材包括的各种装饰小部件，以使生成的头像相框进一步达到动态效果。

其中部件输出属性也包括但不限于输出位置、输出时间、变换方式、透明度和堆叠顺序。

为了更好的理解本发明实施例，以下以一个具体的实例对本发明实施例提供的头像相框的生成方法进行详细说明。

当需要生成头像相框时，先从素材库中选择用于生成该头像相框的素材。在本发明实施例中，由于头像相框由用户头像、相框和装饰部分构成，从而需要从素材库中选择用于生成头像相框的头像素材、相框素材和装饰素材，即分别选择用于生成用户头像的头像素材、生成相框的相框素材以及生成装饰的装饰素材。

接着按照预设的与各素材对应的素材输出属性输出选择的素材，以生成目标头像相框。在本发明实施例中，需要预先为用于生成头像相框的各个素材设置对应的素材输出属性。如需要分别为头像素材、相框素材和装饰素材设置对应的素材输出属性，为各素材设置的素材输出属性包括但不限于输出位置、输出时间、变换方式、透明度和堆叠顺序，这样，当需要生成头像相框时，只要按照为各素材设置的素材输出属性输出选择的素材，即可生成动态变换效果的头像相框。

如设置用于生成头像相框的相框素材的素材输出属性为在 0ms开始输出，输出位置为相框显示区；设置用于生成头像相框的装饰素材的素材输出属性为在 600ms开始输出，输出位置为装饰显示区；为了使输出的装饰素材也具有动态变换效果，可以为该装饰素材包括的各个装饰小部件设置部件输出属性；设置用于生成头像相框的头像素材的素材输出属性为在 10ms开始输出，输出位置为头像显示区，变换方式为缩放变换，且缩放变换的时刻以及具体值如表 1.1所示：

表 1.1

在上述表 1.1中，当在 0毫秒时，头像素材在水平和垂直方向上的缩放比例均为 0, 当到达 100毫秒时，头像素材在水平和垂直方向上的缩放比例均为 0.8, 当到达 300毫秒时，头像素材在水平和垂直方向上的缩放比例均为 1 , 即该变换过程如下：在 0毫秒到 100毫秒的时间段内，让头像素材在水平和垂直方向上的缩放比例从 0逐渐变换到 0.8, 在 100毫秒到 300毫秒的时间段内，让头像素材在水平和垂直方向上的缩放比例从 0.8逐渐变换到 1。其余的类似，在此不再——赘述。

在按照上述预设的与各素材对应的素材输出属性输出选择的素材，以生成目标头像相框时，可以得到动态变换效果的头像相框，图 2是本发明实施例提供的头像相框的示例图，以头像素材为卡通画、装饰素材为荷花的荷花动感头像相框为例，头像相框的动态变换过程如下：在 0ms时，在相框显示区输出相框素材。在 10ms时，在头像显示区输出头像素材，且头像素材按照表 1.1所示的缩放变换方式进行变换，使头像素材在头像显示区从小变大直到头像素材占满相框并出现震荡效果，在超过表 1.1 中设置的最大时间时，可以按照最大时间时对应的在水平和垂直方向上的缩放比例进行显示或出现震荡效果。在 600ms时开始输出荷花装饰素材，由于荷花装饰素材包括荷叶、花茎、荷花等多个装饰小部件，在输出荷花装饰素材时，通过按照预设与各个装饰小部件对应的部件输出属性分别对应输出荷花装饰素材包括的多个装饰小部件，从而实现荷花装饰素材的以下动态变换效果：

首先，荷叶全出现，并出现一朵小荷花；接着，竖起荷花茎；然后，再在茎上长出荷花；最后，荷花盛开。

在本发明实施例中，通过按照预设的与各素材对应的素材输出属性输出选择的素材，以生成目标头像相框，由于素材输出属性包括输出时间、输出位置、变换方式、透明度和堆叠顺序等，从而可以使生成的头像相框具有动态变换效果。

实施例二：

图 3 是本发明第二实施例提供的头像相框的生成方法的实现流程图，其中步骤 S201、 S202分别与图 1所示的生成方法中的步骤 S101、 S102相同，其不同之处仅在于，其还包括如下步骤：

在步骤 S203中，当检测到用户输入的状态切换指令时，将头像相框从当前状态切换至该状态切换指令指定的头像相框状态。

其中，状态切换指令指定的头像相框状态即为切换后的头像相框状态。其中头像相框状态包括但不限于出现状态、普通状态、互动状态和收起状态等。

其中出现状态是指从显示头像相框中的第一个素材开始，到构成该头像相框的所有素材均显示完毕为止头像相框所经历的状态。例如，对于上述实施例一图 2中的头像相框的动态变换过程，出现状态包括（经历）如下 6个子状态： 1、相框出现，相片从小变大； 2、相片占满相框里面； 3、荷叶全出现，荷花出现一小朵； 4、竖起荷花茎； 5、茎上长出荷花； 6、荷花盛开。普通状态是指构成该头像相框的所有素材均显示完毕后头像相框处于静止时的状态，图 4是本发明实施例提供的头像相框的普通状态的示例图，普通状态对应头像素材在水平和垂直方向上的缩放比例为 1、荷叶全出现、荷花盛开时显示的静止画面时的状态。互动状态是指可以依据用户的各种操作而做出各种互动操作的状态，图 5是本发明实施例提供的头像相框的互动状态的示例图，在监测到有鼠标进入时，进入互动状态，可以预先设置该互动状态为荷花倾斜，然后还原到初始状态；也可以设置互动状态为花苞和茎倾斜，然后还原到初始状态；还可以设置互动状态为荷花变形，然后还原到初始状态。当然，实际应用中，还可以设置为上述三种互动状态的任意组合。收起状态是指从构成头像相框的所有素材中第一个素材消失开始，到构成头像相框的所有素材均消失为止头像相框所经历的状态，为出现状态所经历的状态的逆过程，图 6是本发明实施例提供的头像相框的收起状态的示例图，包括： 1、点击切换按钮； 2、荷花收起来； 3、花苞收起来； 4、荷花茎收起来； 5、荷叶收起来； 6、头像从大变小消失，相框消失。

在具体实现时，用户输入状态切换指令的方式可以是通过头像相框提供的状态切换区显示的向上和向下切换按钮来输入，也可以通过检测鼠标是否进入各个显示区来输入。在通过状态切换区显示的向上和向下切换按钮来输入状态切换指令时，需要预先设置头像相框的各种状态之间的切换顺序。当通过检测鼠标是否进入各个显示区来输入状态切换指令时，只能从头像相框的普通状态切换至互动状态，或者从互动状态切换至普通状态。在本发明实施例中，头像相框从一种状态切换至另一种状态时，可以采用线性切换方式，以使切换效果流畅。

请参阅图 7, 图 7是本发明实施例提供的头像相框在各种状态之间进行切换的示例图，但不以该示例为限。

在该示例中，通过状态切换区提供的向上或者向下切换按钮，可以从头像相框的出现状态切换到普通状态，从普通状态切换到收起状态，从收起状态切换至出现状态，也可以从互动状态切换至收起状态。通过检测鼠标是否进入头像相框的各个显示区域，可以从头像相框的普通状态切换至互动状态，当检测到鼠标离开头像相框时，可以从头像相框的互动状态切换至普通状态。其中从头像相框的收起状态切换至出现状态时，可以直接切换至与收起状态的头像相框相同的头像相框的出现状态，也可以切换至与收起状态的头像相框不同的另一个头像相框的出现状态，如与收起状态的头像相框不同的另一个头像相框可以是与构成收起状态的头像相框不同的头像素材、相框素材和 /或装饰素材构成的另一个头像相框。举例说明如下：

图 8是本发明实施例提供的各种头像相框的示例图，当头像相框为邮票相框，且该邮票相框的当前状态为收起状态时，如果此时接收到状态切换指令，则可以切换至该邮票相框的出现状态，也可以切换至由不同素材构成的头像相框的出现状态，如切换至画板相框的出现状态、小提琴相框的出现状态或者荷花相框的出现状态。

在本发明实施例中，由于可以检测用户输入的状态切换指令，并依据该状态切换指令从头像相框的一种状态切换至另一种状态，从而可以为用户提供灵活多变的头像相框，同时采用线性切换方式从头像相框的一种状态切换至另一种状态，以使切换效果流畅。

在本发明实施例中，由于可以在头像相框的多个状态之间进行任意的切换，从而使生成的头像相框更加生动，富有动态效果。

实施例三：

图 9示出了本发明第三实施例提供的头像相框的生成方法的实现流程，其中步骤 S301、 S302与图 1所示的生成方法中的步骤 S101、 S102 相同，其不同之处仅在于，其还包括如下步骤：

在步骤 S303中，当头像相框的热区检测到用户的互动指令时，采用与该热区对应的变换方式对输出在该热区中的素材进行变换。

在本发明实施例中，可以为头像相框设置一个或者多个热区，并为每个热区设置对应的变换方式。其中为热区设置的对应的变换方式包括但不限于缩放变换、旋转变换和位移变换等。当该热区检测到用户的互动指令时，采用与该热区对应的变换方式对输出在该热区中的素材进行变换，从而使生成的头像相框具有互动效果。

在本发明实施例中，可以为一个热区设置一种变换方式，也可以为一个热区设置多种变换方式。当为一个热区设置了多种变换方式时，如果该热区检测到用户的互动指令，则同时采用与该热区对应的多种变换方式对输出在该热区中的素材进行变换。在本发明另一实施例中，当为一个热区设置了多种变换方式时，则为输出在该热区中的不同素材设置不同的变换方式，从而使输出在该热区中的不同素材实现不同的互动效果，还可以为输出在该热区中的一种素材设置多种变换方式，从而实现更加丰富的互动效果。

其中头像相框的热区检测用户的互动指令的方式可以为检测鼠标进入事件，当检测到鼠标进入热区时，则认为头像相框的热区检测到用户的互动指令，此时采用与该热区对应的变换方式对输出在该热区中的素材进行变换，举例说明如下：

图 10、 11是本发明实施提供的头像相框互动效果的示意图。当鼠标进入图 10中设置的热区 1时，假设预先为热区 1设置的变换方式为旋转变换，那么将采用旋转变换对热区 1中输出的素材，例如，小花瓣和花茎进行旋转变换，当鼠标移出热区 1时，将输出在热区 1中的素材还原到鼠标进入前的状态，从而实现荷花 "动一下" 的互动效果。

接着，当鼠标进入图 11中设置的热区 2时，假设预先为热区 2中输出的花苞素材设置的变换方式为旋转变换和位移变换，为热区 2中输出的花茎素材设置的变换方式为旋转变换，则对热区 2中输出的花苞素材同时进行旋转变换和位移变换，从而实现花苞倾斜的互动效果，同时对热区 2中输出的花茎做旋转变换，从而实现花茎倾斜的互动效果。当鼠标移出热区 2时，将输出在热区 2中的素材还原到鼠标进入前的状态。

在本发明实施例中，由于在头像相框的热区检测到互动指令时，可以采用预设的与该热区对应的变换方式对输出在该热区中的素材进行变换，从而使生成的头像相框具有互动效果。

在本发明另一实施例中，当头像相框的热区检测到用户的互动指令时，按照预设的修改方式修改输出在该热区中的素材的矢量节点的信息，以实现头像相框的互动效果，下面进行描述。

图 12是本发明实施提供的头像相框互动效果的示意图。当鼠标进入图 12中设置的热区 3时，由于输出在热区 3中的荷花素材是采用矢量绘制的，因此按照预设的修改方式修改该荷花素材的矢量节点信息，也可以实现荷花素材的变形，从而达到头像相框的互动效果。

在本发明实施例中，当头像相框的热区检测到用户的互动指令时，通过按照预设的修改方式修改输出在该热区中的素材的矢量节点信息 , 从而也可以实现头像相框的互动效果。

实施例四：

图 13示出了本发明第四实施例提供的头像相框生成系统的结构，为了便于说明，仅示出了与本发明实施例相关的部分。

该系统可以用于即时通讯工具，可以是运行于即时通讯工具内的软件单元、硬件单元或者软硬件相结合的单元，也可以作为独立的挂件集成到即时通讯工具中或者运行于即时通讯工具的应用系统中，其中：素材库 1存储用于生成头像相框的各种素材。该素材库包括但不限于头像素材库、相框素材库、装饰素材库等。

素材获取单元 2从素材库中选择用于生成头像相框的素材。

头像相框生成单元 3按照预设的与各素材对应的素材输出属性输出选择的素材，以生成头像相框。

在本发明实施例中，需要预先为用于生成头像相框的每一种素材都设置对应的素材输出属性。其中素材输出属性包括但不限于输出位置、输出时间、变换方式、透明度和堆叠顺序等。其中变换方式包括但不限于缩放变换、旋转变换和位移变换等。

在本发明实施例中，在设置用于生成头像相框的素材的输出时间时，可以为用于生成头像相框的各个素材设置输出时间顺序。

实施例五：

图 14是本发明第五实施例提供的头像相框生成系统的结构框图。参见图 14, 该系统除包括图 13所示的素材库 1、素材获取单元 2以及头像相框生成单元 3外，该系统还包括状态切换单元 4。该状态切换单元 4在检测到用户输入的状态切换指令时，将头像相框从当前状态切换至该状态切换指令指定的头像相框状态。

其中状态切换指令指定的头像相框状态即为切换后的头像相框状态。其中头像相框状态包括但不限于出现状态、普通状态、互动状态和收起状态等。

在本发明另一实施例中，该系统还包括互动处理单元 5。该互动处理单元 5在头像相框的热区检测到用户的互动指令时，采用与该热区对应的变换方式对输出在该热区中的素材进行变换。

在本发明另一实施例中，该系统还包括信息修改单元 6。该信息修改单元 6在头像相框的热区检测到用户的互动指令时，按照预设的修改方式修改输出在该热区中的素材的矢量节点的信息，以实现头像相框的互动效果。

本领域普通技术人员可以理解，实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，所述的程序可以在存储于一计算机可读取存储介质中，所述的存储介质，如 ROM/RAM、磁盘、光盘等。

在本发明实施例中，通过按照预设的与各素材对应的素材输出属性输出选择的素材，以生成目标头像相框，由于素材输出属性包括输出时间、输出位置、变换方式、透明度和堆叠顺序等，从而可以使生成的头像相框具有动态变换效果。由于可以在头像相框的多个状态之间进行任意的切换，从而使生成的头像相框更加生动，富有动态效果。当头像相框的热区检测到互动指令时，可以采用预设的与该热区对应的变换方式对输出在该热区中的素材进行变换，从而使生成的头像相框具有互动效果。当头像相框的热区检测到用户的互动指令时，通过按照预设的修改方式修改输出在该热区中的素材的矢量节点的信息，从而也可以实现头像相框的互动效果。

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

Claims

权利要求书

1、一种头像相框的生成方法，其特征在于，所述方法包括下述步骤：从素材库中选择用于生成头像相框的各素材，所述素材库包括头像素材库、相框素材库以及装饰素材库；

2、如权利要求 1所述的方法，其特征在于，所述素材输出属性包括输出位置、输出时间以及变换方式。

3、如权利要求 2所述的方法，其特征在于，所述素材输出属性还包括透明度和堆叠顺序，所述变换方式包括缩放变换、旋转变换和位移变换。

4、如权利要求 2所述的方法，其特征在于，所述预设的与各素材对应的素材输出属性中的输出时间为输出时间顺序，此时，按照用于生成头像相框的各素材的输出时间顺序顺次输出选择的素材。

5、如权利要求 1所述的方法，其特征在于，当选择的用于生成头像相框的装饰素材包括不同数量的装饰小部件时，所述按照预设的与用于生成头像相框的各素材对应的素材输出属性输出选择的素材包括：按照预设的与所述装饰素材包括的各装饰小部件对应的部件输出属性输出所述装饰素材包括的各装饰小部件，所述部件输出属性包括输出位置、输出时间、变换方式。

6、如权利要求 1至 5任一项所述的方法，其特征在于，所述方法还包括下述步骤：

当检测到用户输入的状态切换指令时，将头像相框从当前状态切换至所述状态切换指令指定的头像相框状态。

7、如权利要求 6所述的方法，其特征在于，所述头像相框状态包括出现状态、普通状态、互动状态和收起状态。

8、如权利要求 1至 5任一项所述的方法，其特征在于，所述方法还包括下述步骤：

当头像相框的热区检测到用户的互动指令时，采用与所述热区对应的变换方式对输出在该热区中的素材进行变换。

9、如权利要求 1至 5任一项所述的方法，其特征在于，所述方法还包括下述步骤：

当头像相框的热区检测到用户的互动指令时，按照预设的修改方式修改输出在所述热区中的素材的矢量节点的信息。

10、一种头像相框生成系统，其特征在于，所述系统包括：素材库，用于存储用于生成头像相框的各种素材，所述素材库包括头像素材库、相框素材库以及装饰素材库；

11、如权利要求 10所述的系统，其特征在于，所述系统还包括：状态切换单元，用于在检测到用户输入的状态切换指令时，将头像相框从当前状态切换至该状态切换指令指定的头像相框状态。

12、如权利要求 10或 11所述的系统，其特征在于，所述系统还包括：

互动处理单元，用于在头像相框的热区检测到用户的互动指令时，采用与该热区对应的变换方式对输出在该热区中的素材进行变换。

13、如权利要求 10或 11所述的系统，其特征在于，所述系统还包括：

信息修改单元，用于在头像相框的热区检测到用户的互动指令时，按照预设的修改方式修改输出在该热区中的素材的矢量节点的信息。

14、如权利要求 10或 11所述的系统，其特征在于，所述素材输出属性包括输出位置、输出时间以及变换方式。