CN106126229A - 特效生成方法及装置 - Google Patents

Abstract

本公开是关于一种特效生成方法及装置。该特效生成方法包括：提供一原始贴图至着色器作为第一纹理；提供一特效贴图至所述着色器作为第二纹理；通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果；通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果；叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。本公开可以减少了资源包的大小以及对内存的损耗。

Description

特效生成方法及装置

技术领域

本公开涉及计算机图形技术领域，具体而言，涉及一种特效生成方法及特效生成装置。

背景技术

用户界面是用户与终端设备之间传递和交换信息的媒介，例如包括网站界面、应用程序界面以及游戏界面等。在用户界面中，经常会使用一些特效来增加显示效果或者对某些界面元素进行突出显示。以游戏界面为例，可以在游戏界面上的部分元素上增加特效，从而吸引用户的眼球，使用户注意到游戏界面中的该部分元素。

例如，参考图1A中所示，其中通过白色光束在游戏界面左侧的两个元素上进行扫动形成扫光特效，从而实现游戏界面左侧的两个元素与其他元素区分开的目的。现有技术中，白色光束的扫光特效是通过美术制作人员通过绘制逐帧动画(如图1B中所示)形成扫光特效文件，再由程序调取扫光特效文件置于需要添加扫光特效的元素上方。

在上述扫光特效生成方法中，一方面，每个元素的扫光特效对应一个扫光特效文件，当界面内元素的形状、扫光面积、扫光速度等需要变化时，均需输出一个对应的扫光特效文件，无法实现扫光特效的通用性。另一方面，当一个界面中同时加载多个扫光特效时会消耗大量的内存，严重影响界面的加载速度，无法实现扫光特效的批量加载；再一方面，每个扫光特效文件的挂接都需要程序单独实现，对于设计人员的限制较大，设计人员无法方便快捷的在界面上添加扫光特效。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种特效生成方法及特效生成装置，进而至少在一定程度上克服由于相关技术的限制和缺陷而导致的一个或者多个问题。

根据本公开实施例的第一方面，提供一种特效生成方法，包括：

提供一原始贴图至着色器作为第一纹理；

提供一特效贴图至所述着色器作为第二纹理；

通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果；

通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果；

叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。

在本公开的一种示例性实施例中，所述特效生成方法还包括：根据预设规则更新所述第二纹理坐标。

在本公开的一种示例性实施例中，所述预设规则包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。

在本公开的一种示例性实施例中，所述预设规则还包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。

在本公开的一种示例性实施例中，所述预设规则包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放。

在本公开的一种示例性实施例中，叠加所述第一读取结果以及第二读取结果并输出至显示界面的步骤之前还包括：

获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。

根据本公开实施例的第二方面，提供一种特效生成装置，包括：

第一纹理提供模块，用于提供一原始贴图至着色器作为第一纹理；

第二纹理提供模块，用于提供一特效贴图至所述着色器作为第二纹理；

第一读取模块，用于通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果；

第二读取模块，用于通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果；

输出模块，用于叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。

在本公开的一种示例性实施例中，所述特效生成装置还包括：

参数更新模块，用于根据预设规则更新所述第二纹理坐标。

在本公开的一种示例性实施例中，所述预设规则包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。

在本公开的一种示例性实施例中，所述预设规则还包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。

在本公开的一种示例性实施例中，所述预设规则包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放。

在本公开的一种示例性实施例中，所述特效生成装置还包括：

透明度调整模块，用于获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。

本公开示例实施方式中的技术方案，通过使用多层贴图并结合纹理坐标，实现了特效的生成。相比于现有技术中的特效生成方案，由于可以使得的界面中不同元素使用同一套特效资源，界面上的不同元素，不论形状、大小，均可使用本公开中的技术方案添加特效，因此实现了特效生成的通用性；而且，相比于绘制逐帧动画生成特效的方案，本公开中的技术方案可以实现特效的批量添加，界面加载的资源量由一套逐帧动画文件变为一张特效贴图，减少了资源包的大小以及对内存的损耗，提升界面中批量添加特效时加载的速度；此外，本公开中的一种示例性实施例中还可以方便的编辑纹理坐标，提升扫光特效设置的便捷性，进而可以快速在界面上添加/改变特效效果。

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

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1A中示出现有技术中的一种扫光特效示意图。

图1B中示出现有技术中的一种扫光特效生成的流程示意图。

图2中示出本公开示例性实施例中一种特效生成方法的流程示意图。

图3中示出本公开示例性实施例中一种特效贴图的示意图。

图4中示出本公开示例性实施例中一种批量生成特效的效果示意图。

图5A以及图5B示意性示出本公开示例性实施例中一种特效生成方法的设置示意图。

图6示意性示出本公开示例性实施例中一种特效生成装置的框图。

图7示意性示出本公开示例性实施例中一种特效生成装置的框图。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。

此外，附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

本示例实施方式中，首先提供一种特效生成方法，用于在原始界面上生成特效。本示例实施方式中，所述特效生成方法可以应用于扫光特性生成、光晕特效生成以及毛玻璃特效生成等，所述原始界面可以为游戏界面、网站界面以及应用程序界面等，本示例性实施例中对此均不做特殊限定。此外，本示例实施方式中特效生成方法应用的硬件设备的显卡至少应支持多层贴图的功能。参考图2中所示，所述特效生成方法可以包括以下步骤：

步骤S1.提供一原始贴图至着色器作为第一纹理。

在游戏应用中，游戏界面的绘制在技术上的实现大致为，程序人员编写界面渲染的着色器(Shader)，UI人员制作出界面贴图(即上述原始贴图)，游戏应用程序将界面贴图加载入游戏并传输至着色器作为一层第一纹理。其中，着色器是在计算机图形学中实现图像渲染时，用来替代固定渲染管线的可编辑程序。着色器可以将输入的Mesh(网格)以指定的方式和输入的纹理等组合后输出。

步骤S2.提供一特效贴图至所述着色器作为第二纹理。

以生成扫光特效为例，本示例实施方式中可以首先制作一张作为叠加光效的特效贴图，例如如图3中所示的特效贴图。本示例实施方式中，所述特效贴图可以为32位贴图，其中的24位用于存储红色通道、绿色通道以及蓝色通道(即RGB通道)三个色彩通道记录的色彩信息参数；其余8位用于存储Alpha通道记录的信息参数。根据游戏需要，可以随意调整图3中特效贴图的内容，从而实现不同的扫光效果。同理，在本公开的其他示例性实施例中，如果需要生成其他特效，则可以对应制作其他类型的特效贴图，本示例实施方式中对此不再赘述。由于本示例实施方式中，通过修改所述特效贴图，即可提供不同的特效，因此相比于现有技术中的特效生成方案具有更强的普适性。

步骤S3.通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果。

纹理坐标即UV坐标，是纹理贴图到要贴所述纹理贴图的元素表面的一个映射。本示例实施方式中，将第一纹理坐标传输至着色器后，着色器会使用第一纹理坐标读取所述第一纹理的颜色等显示数据，作为第一读取结果，并且根据所述第一纹理坐标，可以将第一纹理中的颜色等显示数据与待放置位置的像素对应起来，便于后续在待放置位置上定位纹理贴图。

步骤S4.通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果。

本示例实施方式中，将第二纹理坐标传输至着色器后，着色器会使用第二纹理坐标读取所述第二纹理的颜色等显示数据，作为第二读取结果，并且根据所述第二纹理坐标，可以将第二纹理中的颜色等显示数据与待放置位置的像素对应起来，便于后续在待放置位置上定位纹理贴图。本示例实施方式中，通过输入不同的第二纹理坐标，即可将所述第二纹理输出至所述游戏界面的不同位置，因此可以通过输入不同的第二纹理坐标为游戏界面中的不同元素添加同一特效。因此，通过本示例实施方式中的技术方案，可以实现扫光特效的通用性，游戏界面上的任何元素可以使用同一套扫光特效。同时，还可以实现扫光特效使用的批量性，减少扫光特效对内存的损耗，提升界面批量使用时界面加载的速度。例如，参考图4中所示，可以利用步骤S4的原理在代码中为需要添加扫光特效的元素添加扫光代码，从而实现批量扫光。

步骤S5.叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。着色器读取所述第一纹理以及第二纹理后，将第一读取结果以及第二读取结果叠加，并根据所述第一纹理坐标以及第二纹理坐标输出至游戏界面上对应的位置形成人眼可见的图像。

此外，在步骤S5中进行第一读取结果以及第二读取结果的叠加时要注意不能破坏原始界面的透明效果，因此需要重新计算透明度。基于此，本示例实施方式中，叠加所述第一读取结果以及第二读取结果并输出至显示界面的步骤之前还可以包括：

获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。例如，其对应的OpenGL代码可以示例如下：

//原始贴图的读取结果，游戏应用可直接使用该结果作为游戏界面

vec4src_color＝texture2D(src_texture,src_uv)；

//特效贴图的读取结果，用来叠加在游戏界面的元素上

vec4light_color＝texture2D(light_texture,src_uv)；

//将两种读取结果叠加，叠加的光效需要乘上原始界面的透明度

(src_color.aaa)和其本身的透明度(light.aaa)

vec4final_color＝vec4(src_color.rgb+light.rgb*src_color.aaa*light.aaa,src_color.a)；

当然，在本公开的其他示例性实施例中，上述光效的透明效果也可以通过其他方式实现，本示例性实施例中对此不做特殊限定。

通过上述步骤，可以实现在游戏界面中的静态光效效果。为了优化扫光特效，还可以使上述光效具有循环流动的效果。表现在着色器中，就是第二纹理按照一定方式移动；而实现第二纹理移动的一种方式可以是按照预设规则更新上述第二纹理坐标。所述预设规则可以由开发人员根据需要而设定，本示例性实施例中对此不做特殊限定。

本示例实施方式中，所述预设规则可以包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。例如，由于程序运行时时间参数一直在累计，所述第一参数可以为时间参数；如果所述分量是第二纹理坐标的x分量上，则可以在x分量上累加所述时间参数，使得上述光效产生移动的效果。此外，为了控制扫光特效移动速度的快慢以及实现变速度的移动，本示例实施方式中，所述预设规则还可以包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。通过所述第一参数以及第二参数即可以实现光效的循环流动效果。

为了进一步的丰富扫光特效的效果，还可以在上述移动的基础上，调整扫光特效的宽度以及长度等特性。例如，本示例实施方式中，所述预设规则还可以包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放，通过对所述第二纹理坐标进行缩放，即可以实现扫光特效的宽度以及长度的缩放。

本示例实施方式中，所述参数可以在着色器中放入同一个变量中，以优化性能。例如，计算第二纹理坐标的实例代码可以如下：

//定义一个参数作为第二纹理坐标的附加参数，其中xy分量为第二纹理坐标的缩放参数，即第三参数；z分量为时间参数，即第一参数；

w分量为时间的缩放参数，即第二参数

uniform vec4uv_param；

//第二纹理坐标乘以缩放参数，加上缩放后的时间参数，形成新的第二纹理坐标

vec2uv_grow＝src_uv*uv_param.xy+vec2(uv_param.z*uv_param.w,0.0)；

将通过以上步骤计算得到的第二纹理坐标代替上述步骤S4中的第二纹理坐标，得到的光效便是有流动效果的光效，表现在界面上就有了效果很好的扫光特效。但容易理解的是，在本公开的其他示例性实施例中，也可以通过其他方式实现光效的循环流动效果，并不局限于本示例实施方式中所列举的方式。

此外，为了方便用户编辑扫光特效中的特效贴图、大小以及扫光快慢，可以将这上述第一参数、第二参数以及第三参数以一定方式放入编辑器中，作为游戏界面的属性之一，用户编辑之后，程序读取这些参数，一旦发现界面中需要扫光特效，便使用相应的着色器，并传入这些参数；如果界面不需要扫光特效，便使用传统的着色器。例如，当用户希望在游戏界面中某些元素上添加扫光特效(其他特效同理)时，打开相关元素所对应的界面编辑文件(如COCOS文件等)，例如，如图5A所示，用户希望给金币、钻石图标添加扫光时，可以通过控件输入扫光特效的参数，例如可以用来标记扫光特效的光道大小和扫光速度。将界面编辑文件保存后，置于游戏中运行，即可实现扫光特效，如图5B所示，游戏界面上不同形状的元素均被添加了扫光特效。

综上所述，本示例实施方式中，通过使用多层贴图并结合纹理坐标，实现了特效的生成。相比于现有技术中的特效生成方案，由于可以使得的界面中不同元素使用同一套特效资源，界面上的不同元素，不论形状、大小，均可使用本公开中的技术方案添加特效，因此实现了特效生成的通用性；而且，相比于绘制逐帧动画生成特效的方案，本公开中的技术方案可以实现特效的批量添加，界面加载的资源量由一套逐帧动画文件变为一张特效贴图，减少了资源包的大小以及对内存的损耗，提升界面中批量添加特效时加载的速度；此外，本公开中的一种示例性实施例中还可以方便的编辑纹理坐标，提升扫光特效设置的便捷性，进而可以快速在界面上添加/改变特效效果。

进一步的，本示例实施方式中还提供了一种特效生成装置。参考图6中所示，特效生成装置可以包括第一纹理提供模块11、第二纹理提供模块12、第一读取模块13、第二读取模块14以及输出模块15。其中：

第一纹理提供模块11可以用于提供一原始贴图至着色器作为第一纹理。

第二纹理提供模块12可以用于提供一特效贴图至所述着色器作为第二纹理。

第一读取模块13可以用于通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果。

第二读取模块14可以用于通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果。

输出模块15可以用于叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。

在本示例性实施例中，所述特效生成装置还可以包括参数更新模块。其中，参数更新模块可以用于根据预设规则更新所述第二纹理坐标。

在本示例性实施例中，所述预设规则可以包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。

在本示例性实施例中，所述预设规则还可以包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。

在本示例性实施例中，所述预设规则可以包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放。

在本示例性实施例中，所述特效生成装置还可以包括透明度调整模块。透明度调整模块可以用于获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。

上述特效生成装置中各模块的具体细节已经在对应的特效生成方法中进行了详细的描述，因此此处不再赘述。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

此外，尽管在附图中以特定顺序描述了本公开中方法的各个步骤，但是，这并非要求或者暗示必须按照该特定顺序来执行这些步骤，或是必须执行全部所示的步骤才能实现期望的结果。附加的或备选的，可以省略某些步骤，将多个步骤合并为一个步骤执行，以及/或者将一个步骤分解为多个步骤执行等。

图7示出根据本公开示例实施方式中上述特效生成装置400的一种示意图。参照图7，装置400包括处理组件422，其进一步包括一个或多个处理器，以及由存储器432所代表的存储器资源，用于记录可由处理组件422的执行的指令，例如应用程序。存储器432中存储的应用程序可以包括一个或一个以上的每一个对应于一组指令的模块。此外，处理组件422被配置为执行指令，以执行上述方法。

装置400还可以包括一个电源组件426被配置为执行装置400的电源管理，一个有线或无线网络接口450被配置为将装置400连接到网络，和一个输入输出(I/O)接口458。装置400可以操作基于存储在存储器432的操作系统，例如Windows ServerTM，Mac OS XTM，UnixTM,LinuxTM，FreeBSDTM或类似。

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

Claims (12)

1.一种特效生成方法，其特征在于，包括：

提供一原始贴图至着色器作为第一纹理；

提供一特效贴图至所述着色器作为第二纹理；

通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果；

通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果；

叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。

2.根据权利要求1所述的特效生成方法，其特征在于，所述特效生成方法还包括：根据预设规则更新所述第二纹理坐标。

3.根据权利要求2所述的特效生成方法，其特征在于，所述预设规则包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。

4.根据权利要求3所述的特效生成方法，其特征在于，所述预设规则还包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。

5.根据权利要求2～4任意一项所述的特效生成方法，其特征在于，所述预设规则包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放。

6.根据权利要求1～4任意一项所述的特效生成方法，其特征在于，叠加所述第一读取结果以及第二读取结果并输出至显示界面的步骤之前还包括：

获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。

7.一种特效生成装置，其特征在于，包括：

第一纹理提供模块，用于提供一原始贴图至着色器作为第一纹理；

第二纹理提供模块，用于提供一特效贴图至所述着色器作为第二纹理；

第一读取模块，用于通过所述着色器接收一第一纹理坐标，并根据所述第一纹理坐标读取所述第一纹理获取一第一读取结果；

第二读取模块，用于通过所述着色器接收一第二纹理坐标，并根据所述第二纹理坐标读取所述第二纹理获取一第二读取结果；

输出模块，用于叠加所述第一读取结果以及第二读取结果并输出至显示界面形成显示画面。

8.根据权利要求8所述的特效生成装置，其特征在于，所述特效生成装置还包括：

参数更新模块，用于根据预设规则更新所述第二纹理坐标。

9.根据权利要求9所述的特效生成装置，其特征在于，所述预设规则包括：接收一第一参数，并根据第一参数更新所述第二纹理坐标的一分量。

10.根据权利要求10所述的特效生成装置，其特征在于，所述预设规则还包括：接收一第二参数，并控制所述第一参数跟随一第二参数而变化。

11.根据权利要求8～11任意一项所述的特效生成装置，其特征在于，所述预设规则包括：接收一第三参数，并根据第三参数对所述第二纹理坐标进行缩放。

12.根据权利要求8～11任意一项所述的特效生成装置，其特征在于，所述特效生成装置还包括：

透明度调整模块，用于获取所述第一纹理的透明度以及第二纹理的透明度，并且根据所述第一纹理的透明度以及第二纹理的透明度调整所述第二读取结果的透明度。