动画生成方法、装置、设备及存储介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种动画生成方法、装置、设备及存储介质。

背景技术

随着技术的发展，动画的应用场景越来越多，如在H5制作中，通常会为文字或图片等对象设置动画效果。

其中，动画效果主要包括预设动画效果和自定义动画效果，而预设的动画效果无法满足用户的创作需求，对于自定义动画效果，仅能实现动画对象沿绘制的路径进行平滑移动，动画效果较为单一，依然无法满足用户的创作需求。当用户想要实现某种自定义动画效果时往往需要通过专业的程序员设计的代码来实现，费时费力，效率低下。

发明内容

本申请提供一种动画生成方法、装置、设备及存储介质，以解决用户在H5中制作路径形变动画时存在的效率较低的技术问题。

第一方面，本申请提供一种动画生成方法，所述方法包括：

根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径；

响应作用于所述运动路径的第一触发操作，显示用于设置目标对象的动画效果的用户界面；

响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件；其中，所述第二触发操作用于确定所述目标对象沿所述运动路径运动时的形变信息；所述形变动画文件在打开或调用时，展示与所述形变信息对应的动画效果。

可选的，所述用户界面包括：节点设置区域和形变信息设置区域；所述响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件，包括：

获取与所述第二触发操作对应的参数信息；所述第二触发操作包括对所述节点设置区域的触发操作和对应的形变信息设置区域的触发操作；所述节点设置区域用于设置关键节点的位置信息；所述形变信息设置区域用于设置所述目标对象在所述关键节点的形变信息；

根据所述参数信息生成所述目标对象的形变动画文件；

所述形变信息包括所述目标对象的尺寸信息、旋转信息、斜切信息和透明度信息中的至少一项。

可选的，所述获取与所述第二触发操作对应的参数信息之前，还包括：

在用户界面显示添加操作按钮；

当接收到所述节点设置区域中添加操作按钮被触发的指令时，在所述用户界面上新增一个关键节点，以使用户设置所述关键节点的位置信息和形变信息。

可选的，根据所述参数信息生成所述目标对象的形变动画文件，包括：

根据所述参数信息确定各个关键节点的位置信息以及对应的形变信息；

将所述各个关键节点的位置信息以及对应的形变信息进行存储，得到预设格式的文件；

将所述预设格式的文件转换为H5格式的文件。

可选的，生成所述目标对象的运动路径后，还包括：

设置所述目标对象沿所述运动路径的运动时间或运动速度。

可选的，根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径，包括：

显示用于绘制自定义图形的绘制工具；获取用户通过绘制自定义图形触发的路径设置指令，并生成与所述自定义图形对应的运动路径；

或者，显示包含至少一个预设图形的图形库；获取用户通过选择图形库中预设图形触发的路径设置指令，并生成与所述预设图形对应的运动路径。

第二方面，本申请实施例提供一种动画生成装置，所述装置包括：

第一生成模块，用于根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径；

显示模块，用于响应作用于所述运动路径的第一触发操作，显示用于设置目标对象的动画效果的用户界面；

第二生成模块，用于响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件；其中，所述第二触发操作用于确定所述目标对象沿所述运动路径运动时的形变信息；所述形变动画文件在打开或调用时，展示与所述形变信息对应的动画效果。

第三方面，本申请提供一种动画生成设备，包括：

存储器，用于存储程序指令；

处理器，用于调用并执行所述存储器中的程序指令，执行如第一方面任一项所述的方法。

第四方面，本申请提供一种计算机存储介质，所述计算机可读存储介质中存储有计算机执行指令，当处理器执行所述计算机执行指令时，实现如第一方面任一项所述的方法。

第五方面，本申请提供一种程序产品，包括计算机程序，该计算机程序被处理器执行时实现如第一方面任一项所述的方法。

本申请提供了一种动画生成方法、装置、设备及存储介质，所述方法包括：根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径；响应作用于所述运动路径的第一触发操作，显示用于设置目标对象的动画效果的用户界面；响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件；其中，所述第二触发操作用于确定所述目标对象沿所述运动路径运动时的形变信息；所述形变动画文件在打开或调用时，展示与所述形变信息对应的动画效果，所述方法提供一种用户界面，能够为用户提供动画设置的功能，无需通过编写复杂的代码来实现动画设置，能够提高动画生成的效率。

附图说明

为了更清楚地说明本申请或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的一种应用场景示意图；

图2为本发明实施例提供的一种动画生成方法的流程示意图；

图3为本发明实施例提供的用户界面的示意图；

图4为本发明实施例提供的一种路径形变动画示意图；

图5为本发明实施例提供的动画生成装置的结构示意图；

图6为本发明实施例提供的动画生成设备的结构示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”“第四”等(如果存在)是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例例如能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

图1为本发明实施例提供的一种应用场景示意图，如图1所示，目标对象为一个笑脸图片，运动路径为一个正方形虚线框，在H5的动画制作中，仅能为目标对象设置预设的动画效果，如使该笑脸对象以“飞入”的方式进行显示；或者，为目标对象设置运动路径，目标对象沿该运动路径平滑移动，如使该笑脸对象平滑的由运动路径的左上角运动至运动路径的右上角；或者，当用户想要实现某种自定义动画效果时，如从运动路径的左上角开始移动至运动路径的右上角的过程中，要使笑脸图像进行旋转，则需要通过编写代码来实现，具有效率较低的问题。

为了解决上述问题，本申请提供一种用户界面，在接收到用户的第一触发操作时，可以显示该用户界面，该用户界面用于为用户提供动画设置的功能，当用户在该用户界面上进行第二触发操作时，可以生成相应的动画文件，为用户提供了便捷的操作，使得用户可以快速有效的获取自定义的动画效果，提高了用户的操作体验。

下面以具体的实施例对本申请的技术方案进行详细说明。下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例不再赘述。

本申请实施例的执行主体可以是终端设备，比如移动终端、计算机设备(如，台式机、笔记本电脑、一体机等)，移动终端可以包括智能手机、掌上电脑、平板电脑等移动设备。

图2为本申请实施例提供的一种动画生成方法的流程示意图，如图2所示，所述方法包括：

S201、根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径。

在本实施例中，为了实现对目标对象进行路径动画效果的设置，需要先设置目标对象的运动路径。其中，所述目标对象可以为图片、图形、文本、视频、图表等。

具体的，可以通过接收用户对目标对象的路径设置指令来实现，其中，在接收对目标对象的路径设置指令之前需要先确定目标对象。例如，当存在多个对象时，可以通过点击目标对象的方式确定目标对象，存在对象1、对象2和对象3时，需通过点击对象1就能确定目标对象为对象1。

其中，可以采用两种方式来实现对运动路径的设置。

在一种实施方式中，根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径，包括：

显示用于绘制自定义图形的绘制工具；获取用户通过绘制自定义图形触发的路径设置指令，并生成与所述自定义图形对应的运动路径；

或者，显示包含至少一个预设图形的图形库；获取用户通过选择图形库中预设图形触发的路径设置指令，并生成与所述预设图形对应的运动路径。

当选定目标对象后可以采用绘制工具来绘制自定义图形，还可以选择图形库中的预设图形来实现。

具体的，当确定目标对象后会自动显示绘制自定义图形的绘制工具，用户通过点击并拖动该绘制工具来绘制自定义图形，或者用户通过触摸的方式绘制自定义图形，该绘制自定义图形的过程就是用户输入至终端设备的路径设置指令，终端设备在接收到该指令时，会生成与该自定义图形对应的运动路径。例如，用户通过点击绘制工具绘制一个圆形，则终端设备会生成一个圆形的运动路径。

此外，还可以通过选择图形库中的预设图形来实现，具体的，当确定目标对象后，自动显示预设图形库，用户通过点击或拖动预设图形库中的预设图形的过程就是用户输入至终端设备的路径设置指令，终端设备在接收到该指令时，会生成与预设图形一致的运动路径。其中，预设图形库中的预设图形可以包括诸如圆形、矩形、正方形、直线等此类的基本图形，其中上述基本图形可以以按钮的形式显示。将该类基本图形以按钮的形式显示，可以便于终端用户选择所需要的按钮来绘制对应的基本图形。

通过设置不同的路径绘制指令，为用户提供多样的运动路径绘制方法。

S202、响应作用于所述运动路径的第一触发操作，显示用于设置目标对象的动画效果的用户界面。

在生成运动路径后，通过第一触发操作显示用于设置目标对象的动画效果的用户界面，其中，第一触发操作可以是点击所述运动路径。其中，用户界面用于供用户输入对目标对象设置的形变信息。通过用户界面可以设置目标对象运动至运动路径的预设位置时，在该预设位置的动画效果，比如，当目标对象运动至运动路径的中点位置时，动画效果为尺寸扩大一倍；当运动对象运动至运动路径的终点位置时，动画效果为尺寸为目标对象的初始尺寸等等，在此不再一一列举。

S203、响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件；其中，所述第二触发操作用于确定所述目标对象沿所述运动路径运动时的形变信息；所述形变动画文件在打开或调用时，展示与所述形变信息对应的动画效果。

在本实施例中，用户通过设置的用户界面可以进行第二触发操作，通过第二触发操作可以使得终端设备获取目标对象沿运动路径运动时的形变信息。根据所述形变信息可以生成形变动画文件，并进行存储。例如，终端设备可以将目标对象的运动路径进行存储，以及目标对象处于运动路径的中点位置时的尺寸进行存储。

上述方法可以应用在结构化排版系统，通过接收的路径设置指令生成目标对象的运动路径，再基于对运动路径的第一触发操作来显示用于设置目标对象的动画效果的用户界面，通过用户界面可以便于用户通过第二触发操作对目标对象的动画效果进行设置，最后基于用户的第二触发操作生成形变动画文件，提高了用户在实现自定义动画效果时的效率。

下面对用户界面以及形变动画文件的生成过程进行详细说明。

在一种实施方式中，所述用户界面包括：节点设置区域和形变信息设置区域；所述响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件，包括：

获取与所述第二触发操作对应的参数信息；所述第二触发操作包括对所述节点设置区域的触发操作和对应的形变信息设置区域的触发操作；所述节点设置区域用于设置关键节点的位置信息；所述形变信息设置区域用于设置所述目标对象在所述关键节点的形变信息；根据所述参数信息生成所述目标对象的形变动画文件；所述形变信息包括所述目标对象的尺寸信息、旋转信息、斜切信息和透明度信息中的至少一项。

如图3所示，所述用户界面包括：节点设置区域301和形变信息设置区域302，节点设置区域301用于设置关键节点的位置信息，形变信息设置区域302用于设置目标对象在所述关键节点的形变信息。节点设置区域包括节点名称和位置，形变信息设置区域302包括尺寸信息、旋转信息、斜切信息和透明度信息等，其中，尺寸信息包括目标对象的宽度和高度；旋转信息包括旋转角度；斜切信息包括斜切角度，透明度信息包括透明度比例。其中，在对每一个形变信息进行设置时，均可以采取数据输入的方式，还可以采取点击增大按钮或减小按钮来实现将形变信息调整为目标值。

其中，需要注意的是，关键节点的形变信息可以表示节点的位置属性，表示运动对象运动到这个位置时，根据该关键节点的形变信息产生形变效果。此外将多个关键节点按位置顺序排列，可以便于用户设置形变信息，预判在H5中的动画效果。

其中，用户对目标对象的第二触发操作包括对节点设置区域301的触发操作和对形变信息设置区域302的触发操作。在实际中，当用户在节点设置区域301添加关键节点1后，相应的需要对形变信息设置区域302进行触发操作以确定对上述关键节点1的形变信息。

当用户执行完第二触发操作后，终端设备可以获取与第二触发操作对应的参数信息，其中，参数信息包括节点的位置信息以及与该节点对应的形变信息，如尺寸信息、旋转信息、斜切信息和透明度信息等。即终端设备可以获取目标对象沿运动路径运动时，当目标对象运动至某一节点时对应的形变信息。

在一种实施方式中，所述获取与所述第二触发操作对应的参数信息之前，还包括：

在用户界面显示添加操作按钮；当接收到所述节点设置区域中添加操作按钮被触发的指令时，在所述用户界面上新增一个关键节点，以使用户设置所述关键节点的位置信息和形变信息。

在本实施例中，在进行第二触发操作之前，还需要通过用户界面上显示的添加操作按钮来增加关键节点。即初始情况下，用户界面的节点设置区域301的节点信息为空，通过触发添加操作按钮，用户界面的节点设置区域将会增加一个关键节点，并自动命名为关键节点1，再通过用户的第二触发操作可以实现对该节点的位置信息和形变信息的设置。重复上述操作，可以实现添加多个关键节点。通过上述方法可以实现便捷的添加关键节点。

此外，还可以设置删除操作按钮，可以实现一键将设置的关键节点的位置信息和形变信息删除。

在一种实施方式中，在获取参数信息后，可以根据获取的参数信息生成形变动画文件，包括：

根据所述参数信息确定各个关键节点的位置信息以及对应的形变信息；将所述各个关键节点的位置信息以及对应的形变信息进行存储，得到预设格式的文件；将所述预设格式的文件转换为H5格式的文件。

其中，在获取所述参数信息后，可以根据参数信息得到形变信息，例如，参数信息为包括：设置的关键节点的位置的数值以及形变信息的数值，如参数信息为：关键节点1对应的数值为25％，目标对象的宽和高的数值为分别为50px和60px。则关键节点1的位置信息为运动路径的25％的位置所处的坐标信息，形变信息为目标对象的宽度和高度。

在获取各个关键节点的位置信息和形变信息后，可以根据目标对象运动时经过关键节点的顺序，将关键节点的位置信息和形变信息进行存储。该过程被称为线性化处理过程，存储后的文件为预设格式的文件。其中，此处的预设格式的文件为XML(eXtensibleMarkup Language，可扩展标记语言)格式的文件。在XML格式文件中，运动路径是由多个点绘制而成的，如正方形路径是由四个点绘制而成，其采用的是SVG可缩放的矢量图形格式。

在获取XML格式的文件之后，还需要将该文件转换为H5(第五代HTML标准)格式的文件，其中，H5文件为包含动画形变效果的文件，当用户在打开时可以直接看到目标对象沿运动路径运动时的动画效果。

其中，虽然在XML格式的文件中仅存储了关键节点的位置信息和形变信息，例如对于正方形运动路径，仅存储了四个顶点的位置信息和对应的形变信息，对于任意两个顶点之间的形变信息，可以根据两个顶点之间的形变信息的变化量和两个顶点之间的位置信息的变化量来确定。其中，默认目标对象是匀速运动的。例如，顶点1的形变信息为旋转0度，顶点2的形变信息为旋转90度，则当目标对象运动从顶点1到顶点2运动时，目标对象会均匀的由旋转0度转变为旋转90度。

通过将参数信息生成H5格式的形变动画文件，可以便于用户分享、调用该文件。

在一种实施方式中，生成所述目标对象的运动路径后，还包括：设置所述目标对象沿所述运动路径的运动时间或运动速度。

在生成目标对象的运动路径后还可以对运动对象的时间或速度进行设置，例如，通过点击运动路径可以显示计时界面，计时界面可以设置目标对象沿运动路径的运动时间，也就是持续时间；或者通过点击运动路径可以显示速度界面，用于直接设置目标对象的运动速度。其中，当不对运动时间或运动速度进行设置时，目标对象会以默认的运动速度沿运动路径运动。

通过对目标对象沿所述运动路径的运动时间或运动速度的设置，可以灵活的设置目标对象的运动速度，提高用户的使用体验。

在实际中，用户可以通过选定目标对象，为目标对象设置运动路径，并在运动路径上通过设置参数信息来创建形变动画，终端设备则在接收到用户输入的运动路径，以及设置的参数信息后可以根据参数信息先生成XML格式的文件，再生成H5格式的文件。

图4为本发明实施例提供的一种路径形变动画示意图，当用户设置的参数信息中运动路径为正方形，关键节点的位置分别为25％、50％、75％和100％位置时，对应的形变信息分别为顺时针旋转90、旋转180、旋转270度和旋转360度时，则终端设备可以生成H5文件，打开或调用该H5文件时则会播放如图4所示的动画。如图4所示，目标对象会沿正方形运动路径移动，同时在移动时目标对象会发生形变。其中，虚线所表示的运动路径在动画播放时并不会显示。

此外，根据本申请中的方案还可以实现单独设置运动路径，使目标对象沿运动路径平滑移动；还可以实现选中目标对象，设置形变动画信息，使目标对象在不发生移动的前提下发生形变。

图5为本发明实施例提供的动画生成装置的结构示意图；如图5所示，所述装置50包括：

第一生成模块501，用于根据接收的对目标对象的路径设置指令，生成所述目标对象的运动路径；

显示模块502，用于响应作用于所述运动路径的第一触发操作，显示用于设置目标对象的动画效果的用户界面；

第二生成模块503，用于响应作用于所述用户界面的第二触发操作，生成与所述第二触发操作对应的形变动画文件；其中，所述第二触发操作用于确定所述目标对象沿所述运动路径运动时的形变信息；所述形变动画文件在打开或调用时，展示与所述形变信息对应的动画效果。

可选的，所述第二生成模块503包括：

获取单元，用于获取与所述第二触发操作对应的参数信息；所述第二触发操作包括对所述节点设置区域的触发操作和对应的形变信息设置区域的触发操作；所述节点设置区域用于设置关键节点的位置信息；所述形变信息设置区域用于设置所述目标对象在所述关键节点的形变信息；

生成单元，用于根据所述参数信息生成所述目标对象的形变动画文件；

所述形变信息包括所述目标对象的尺寸信息、旋转信息、斜切信息和透明度信息中的至少一项。

可选的，所述第二生成模块503还用于：

在用户界面显示添加操作按钮；

当接收到所述节点设置区域中添加操作按钮被触发的指令时，在所述用户界面上新增一个关键节点，以使用户设置所述关键节点的位置信息和形变信息。

可选的，所述生成单元具体用于：

根据所述参数信息确定各个关键节点的位置信息以及对应的形变信息；

将所述各个关键节点的位置信息以及对应的形变信息进行存储，得到预设格式的文件；

将所述预设格式的文件转换为H5格式的文件。

可选的，所述装置还包括设置模块，用于设置所述目标对象沿所述运动路径的运动时间或运动速度。

可选的，所述第一生成模块501具体用于：

显示用于绘制自定义图形的绘制工具；获取用户通过绘制自定义图形触发的路径设置指令，并生成与所述自定义图形对应的运动路径；

或者，显示包含至少一个预设图形的图形库；获取用户通过选择图形库中预设图形触发的路径设置指令，并生成与所述预设图形对应的运动路径。

本发明实施例提供的动画生成装置，可以实现上述如图2、图3和图4所示的实施例的动画生成方法，其实现原理和技术效果类似，此处不再赘述。

图6为本发明实施例提供的动画生成设备的结构示意图。如图6所示，本实施例提供的电子设备60包括：至少一个处理器601和存储器602。其中，处理器601、存储器602通过总线603连接。

在具体实现过程中，至少一个处理器601执行所述存储器602存储的计算机执行指令，使得至少一个处理器601执行上述方法实施例中的动画生成方法。

处理器601的具体实现过程可参见上述方法实施例，其实现原理和技术效果类似，本实施例此处不再赘述。

在上述的图6所示的实施例中，应理解，处理器可以是中央处理单元(英文：Central Processing Unit，简称：CPU)，还可以是其他通用处理器、数字信号处理器(英文：Digital Signal Processor，简称：DSP)、专用集成电路(英文：Application SpecificIntegrated Circuit，简称：ASIC)等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。结合发明所公开的方法的步骤可以直接体现为硬件处理器执行完成，或者用处理器中的硬件及软件模块组合执行完成。

存储器可能包含高速RAM存储器，也可能还包括非易失性存储NVM，例如至少一个磁盘存储器。

总线可以是工业标准体系结构(Industry Standard Architecture，ISA)总线、外部设备互连(Peripheral Component，PCI)总线或扩展工业标准体系结构(ExtendedIndustry Standard Architecture，EISA)总线等。总线可以分为地址总线、数据总线、控制总线等。为便于表示，本申请附图中的总线并不限定仅有一根总线或一种类型的总线。

本发明实施例还提供一种计算机可读存储介质，所述计算机可读存储介质中存储有计算机执行指令，当处理器执行所述计算机执行指令时，实现上述方法实施例的动画生成方法。

上述的计算机可读存储介质，上述可读存储介质可以是由任何类型的易失性或非易失性存储设备或者它们的组合实现，如静态随机存取存储器(SRAM)，电可擦除可编程只读存储器(EEPROM)，可擦除可编程只读存储器(EPROM)，可编程只读存储器(PROM)，只读存储器(ROM)，磁存储器，快闪存储器，磁盘或光盘。可读存储介质可以是通用或专用计算机能够存取的任何可用介质。

一种示例性的可读存储介质耦合至处理器，从而使处理器能够从该可读存储介质读取信息，且可向该可读存储介质写入信息。当然，可读存储介质也可以是处理器的组成部分。处理器和可读存储介质可以位于专用集成电路(Application Specific IntegratedCircuits，简称：ASIC)中。当然，处理器和可读存储介质也可以作为分立组件存在于设备中。

本申请一个实施例提供一种计算机程序产品，包括计算机程序，所述计算机程序被处理器执行时实现如本申请图2至图4所对应的实施例中任意实施例提供的动画生成方法。

本领域普通技术人员可以理解：实现上述各方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成。前述的程序可以存储于一计算机可读取存储介质中。该程序在执行时，执行包括上述各方法实施例的步骤；而前述的存储介质包括：ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。

最后应说明的是：以上各实施例仅用以说明本申请的技术方案，而非对其限制；尽管参照前述各实施例对本申请进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分或者全部技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本申请各实施例技术方案的范围。