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

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

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

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

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

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

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

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

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

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

图 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、 磁 盘、 光盘等。

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

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