CN117635777A - 动画配置方法、动画显示方法、装置、电子设备及介质 - Google Patents

Abstract

本申请实施例公开了一种动画配置方法、动画显示方法、装置、电子设备及介质。方法包括：获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；根据动画效果描述数据对动画元素进行分组，获得多个动画元素组；根据动画元素组对目标显示页面进行分区，获得各动画元素组对应的页面分区；为各页面分区配置对应的动画元素组中的动画元素；根据动画效果描述数据、页面分区的起始位置和页面分区的终止位置，为各动画元素配置动画元素在所属页面分区中的动画控制参数。对动画元素进行分组并对目标显示页面进行分区，基于页面分区和动画元素组，实现动画元素的分区域控制，可提高动画配置的效率和控制准确性。

Description

动画配置方法、动画显示方法、装置、电子设备及介质

技术领域

本申请涉及动画控制技术领域，具体涉及动画配置方法、动画显示方法、装置、电子设备及介质。

背景技术

随着互联网技术的发展，用户对于网页的显示效果的要求越来越高，例如，需要网页能够具有更好的动画展示效果，因此，需要为网页进行动画配置。

相关技术中，通常由开发人员以整体网页为基准，依次分别为每一个动画元素设置动画控制参数，设置过程复杂，容易出错，不利于提高动画配置的效率和控制准确性。

发明内容

本申请实施例提供一种动画配置方法、动画显示方法、装置、电子设备及介质，用于解决以整体网页为基准，人工依次分别为每一个动画元素设置动画控制参数时不利于提高动画配置的效率和控制准确性的问题，有利于提高动画配置的效率和控制准确性。

本申请实施例第一方面提供一种动画配置方法，上述方法包括：

获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；

根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；

为各上述页面分区配置对应的动画元素组中的动画元素；

根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

本申请实施例第二方面提供一种动画显示方法，上述方法包括：

获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；

根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；

获取上述目标页面分区中动画元素的动画控制参数；

根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

本申请实施例第三方面提供一种动画配置装置，上述装置包括：

数据获取模块，用于获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

动画元素分组模块，用于根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；

页面分区模块，用于根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；

动画元素配置模块，用于为各上述页面分区配置对应的动画元素组中的动画元素；

参数配置模块，用于根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

在一些可选的实施例中，上述动画元素分组模块具体用于：

根据上述动画效果描述数据确定各上述动画元素在上述目标显示页面中的显示触发位置；

根据上述显示触发位置对上述动画元素进行分组，获得多个动画元素组。

在一些可选的实施例中，上述页面分区模块具体用于：

针对每一动画元素组，根据上述动画元素组中各上述动画元素的显示触发位置，确定上述动画元素组对应的显示触发起始位置和显示触发终止位置；

根据各上述动画元素组对应的显示触发起始位置和显示触发终止位置，对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区。

在一些可选的实施例中，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

上述参数配置模块具体用于：

针对每一动画元素，根据上述动画效果描述数据确定上述动画元素对应的动画属性名称以及上述动画元素在上述目标显示页面中的显示触发位置和显示终止位置；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示触发位置，确定与上述显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画起始触发参数；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示终止位置，确定与上述显示终止位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画终止触发参数。

在一些可选的实施例中，上述动画控制参数还包括显示速率控制参数；

上述参数配置模块还具体用于：

根据上述动画效果描述数据确定各上述动画元素对应的显示速率初始控制参数；

获取速率调整指令，根据上述速率调整指令调整上述动画元素对应的显示速率初始控制参数，获得上述动画元素对应的显示速率控制参数。

本申请实施例第四方面提供一种动画配置装置，上述装置包括：

信息获取模块，用于获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；

目标页面分区确定模块，用于根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；

控制参数获取模块，用于获取上述目标页面分区中动画元素的动画控制参数；

显示控制模块，用于根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

在一些可选的实施例中，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

上述显示控制模块具体用于：

根据上述滑动条位置确定滑动条在上述目标页面分区中对应的当前滑动比例；

根据上述当前滑动比例和上述动画起始触发参数，确定上述目标页面分区中待触发的目标动画元素，其中，上述动画元素的动画起始触发参数用于指示与上述动画元素的显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动条滑动比例；

根据上述当前滑动比例，以及上述目标动画元素的动画属性名称、动画起始触发参数和动画终止触发参数，控制上述目标动画元素的显示效果。

本申请实施例第五方面提供一种电子设备，包括存储器和处理器，上述存储器存储有多条指令；上述处理器从上述存储器中加载指令，以执行本申请实施例第一方面提供的动画配置方法中的步骤或者本申请实施例第二方面提供的动画显示方法中的步骤。

本申请实施例第六方面提供一种计算机可读存储介质，上述计算机可读存储介质存储有多条指令，上述指令适于处理器进行加载，以执行本申请实施例第一方面提供的动画配置方法中的步骤或者本申请实施例第二方面提供的动画显示方法中的步骤。

采用本申请实施例的方案，可以获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；为各上述页面分区配置对应的动画元素组中的动画元素；根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

由于在本申请实施例中，在动画配置过程中，对动画元素进行分组，并对目标显示页面进行分区，从而基于页面分区和动画元素组，实现动画元素的分区域控制，针对动画元素配置动画控制参数时只需要配置其在所属的页面分区中的动画控制参数，有利于提高动画配置的效率和控制准确性。

附图说明

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

图1是本申请实施例提供的一种动画配置方法的流程示意图；

图2是本申请实施例提供的一种动画配置方法的具体流程示意图；

图3是本申请实施例提供的一种动画显示方法的流程示意图；

图4是本申请实施例提供的一种动画配置装置的结构框图；

图5是本申请实施例提供的一种动画显示装置的结构框图；

图6是本申请实施例提供的一种电子设备的结构框图。

具体实施方式

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

目前，用户对于网页的显示效果的要求越来越高，需要网页能够有更好的动画展示效果以更好地进行内容展示。但动画配置过程中，需要由开发人员以整体网页为基准，依次分别为每一个动画元素设置动画控制参数，配置效率较低且容易出错，且可能存在基础动画重复编写的情况。同时，不同的开发人员的配置经验不同，可能导致动画效果的实现方式无法统一，从而导致动画效果无法保持稳定的情况。或者因为动画控制参数设置不当而导致页面动画卡顿、整体动画不够流畅。并且，动画的展示过程不可控，无法实现后退查看已经展示完毕的动画。

为了解决上述多个问题中的至少一个问题，本申请实施例提供动画配置方法、动画显示方法、装置、电子设备及介质。具体地，本申请实施例的动画配置方法可以由计算机设备执行，其中，该计算机设备可以为终端或者服务器等设备。该终端可以为智能手机、平板电脑、笔记本电脑、触控屏幕、个人计算机(PC，Personal Computer)、个人数字助理(PDA，Personal Digital Assistant)等终端设备。服务器可以是独立的物理服务器，也可以是多个物理服务器构成的服务器集群或者分布式系统，还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN、以及大数据和人工智能平台等基础云计算服务的云服务器。

以下分别进行详细说明。需说明的是，以下实施例的描述顺序不作为对实施例优选顺序的限定。

本申请实施例第一方面提供一种动画配置方法，请参阅图1，图1是本申请实施例提供的一种动画配置方法的流程示意图。该动画配置方法的具体流程可以如下：

101、获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据。

其中，上述目标显示页面是需要进行动画配置以实现动画展示的页面，例如，上述目标显示页面可以是网页页面，在此不作具体限定。上述动画元素是需要在目标显示页面中展示的动画元素，上述动画效果描述数据用于指示各动画元素的展示方式，从而描述最终获得的动画展示效果。

在一种应用场景中，可以获取设计人员提供的视频动画，根据视频动画确定待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据。其中，上述动画效果描述数据可以包括动画展示视频、展示图片和文字描述中的至少一种，在此不作具体限定。

102、根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组。

其中，一个动画元素组中包括至少一个动画元素，且一个动画元素仅属于一个动画元素组。

具体的，上述根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组，包括：

根据上述动画效果描述数据确定各上述动画元素在上述目标显示页面中的显示触发位置；

根据上述显示触发位置对上述动画元素进行分组，获得多个动画元素组。

本申请实施例中，根据动画元素在目标显示页面中的显示触发位置对动画元素进行分组。其中，上述显示触发位置是目标页面中可触发对应的动画元素开始显示的位置。

需要说明的是，实际使用过程中，根据目标显示页面的滑动条实现对目标显示页面的滑动显示控制，因此，上述显示触发位置也可以为目标显示页面的滑动条的位置。

在一种应用场景中，根据动画元素间显示触发位置在竖直方向的距离进行动画元素的分组，例如，获取预设的位置差阈值，以及上述动画元素中竖直方向上显示触发位置最高的动画元素，将与该动画元素的显示触发位置在竖直方向上的距离小于上述位置差阈值的所有动画元素划分为一组，获得第一个动画元素组。针对第一个动画元素组以外的其它动画元素，基于上述相同的方式进行划分，直到所有动画元素划分完毕，具体过程在此不再赘述。

如此，根据动画元素的显示触发位置进行分组，每一次针对一组位置相近的动画元素确定其对应的动画控制参数，能够提高参数配置过程的准确性。

103、根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区。

本申请实施例中，针对目标显示页面进行从上而下的分区，获得从上到下分布的多个页面分区，从而在实现在滚动条滑动过程中实现更好的动画显示效果。

具体的，上述根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区，包括：

针对每一动画元素组，根据上述动画元素组中各上述动画元素的显示触发位置，确定上述动画元素组对应的显示触发起始位置和显示触发终止位置；

根据各上述动画元素组对应的显示触发起始位置和显示触发终止位置，对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区。

具体的，本申请实施例中为每一动画元素组划分一个对应的页面分区。其中，上述动画元素组对应的显示触发起始位置是动画元素组中所有动画元素的显示触发位置中在竖直方向上最高的一个显示触发位置，上述动画元素组对应的显示触发终止位置则是动画元素组中所有动画元素的显示触发位置中在竖直方向上最低的一个显示触发位置。

104、为各上述页面分区配置对应的动画元素组中的动画元素。

具体的，将各页面分区所对应的动画元素组中的所有动画元素都配置给该页面分区。如此，根据上述动画元素组对应的显示触发起始位置和显示触发终止位置，沿竖直方向确定各动画元素组对应的页面分区，为页面分区配置对应的动画元素，可以在各页面分区内实现更好的动画元素控制。

105、根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

其中，上述页面分区的起始位置和终止位置是页面分区在目标显示页面中的起始位置和终止位置，上述动画控制参数是用于控制动画元素的显示效果的参数。

在一种应用场景中，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数。其中，上述动画属性名称中包括动画属性前缀，动画属性前缀可指示具体的动画效果，例如隐藏、显示、淡入淡出等，在此不作具体限定。上述动画起始触发参数则为触发该动画元素开始控制的参数，上述动画终止触发参数是触发该动画元素停止控制的参数。

具体的，上述根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数，包括：

针对每一动画元素，根据上述动画效果描述数据确定上述动画元素对应的动画属性名称以及上述动画元素在上述目标显示页面中的显示触发位置和显示终止位置；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示触发位置，确定与上述显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画起始触发参数；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示终止位置，确定与上述显示终止位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画终止触发参数。

如此，根据滑动条的滑动比例来触发对动画元素的控制，可以实现在滑动条向下滑动时依次显示所需要显示的动画元素，而滑动条向上滑动时实现动画效果的回退，即回退出已经显示过的动画元素，获得更好的动画显示控制效果。

在本申请实施例的一些应用场景中，上述动画控制参数还包括显示速率控制参数，用于控制动画元素的显示速率，获得更流畅丝滑的显示效果。

具体的，上述根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数，还包括：

根据上述动画效果描述数据确定各上述动画元素对应的显示速率初始控制参数；

获取速率调整指令，根据上述速率调整指令调整上述动画元素对应的显示速率初始控制参数，获得上述动画元素对应的显示速率控制参数。

需要说明的是，本申请实施例中，可以实现自定义的显示速率控制参数控制，具体的，根据动画效果描述数据确定动画元素对应的显示速率初始控制参数之后，根据速率调整指令调整显示速率初始控制参数，从而获得控制效果更好的显示速率控制参数，提高动画元素显示效果的流畅程度。

其中，上述速率调整指令可以由动画配置人员输入，在此不作具体限定。上述显示速率控制参数可以包括动画速度、动画移动步长(step)、动画显示比例、动画样式等，还可以包括其他参数，在此不作具体限定。

本申请实施例中，还基于一种具体应用场景对上述动画配置方法进行具体描述，图2是本申请实施例提供的一种动画配置方法的具体流程示意图。如图2所示，本申请实施例中，先获取多个动画元素和对应的描述视频动画，并对动画元素进行分组获得动画元素组，其中，描述视频动画是交互师提供的用于描述需要配置的动画效果的展示动画。具体的，描述视频动画描述整体的动画需求设计，整个目标显示页面在滚动或者到达某一个位置的时候需要展示的动画效果。例如，根据描述视频动画可以确定某一个页面位置在0秒到4秒时开启某个动画元素，该动画元素从下到上由隐藏变成显示等。

进一步的，针对动画元素进行分组，从而根据动画元素组确定页面分区的起始位置和结束位置，实现对目标显示页面的分区，并为各页面分区设置唯一的分区ID，以更好地区分各个页面分区，进行更好的控制。

具体的，可以分别为每一个页面分区设置粘性布局，以实现页面分区中的动画元素的分区悬停，即在动画显示过程中，无论用户如何滚动页面，在当前的页面分区范围内，重要的动画元素始终在页面窗口的中央，执行完毕后才移动出视线。从而保证更好地进行动画展示，例如，更好地展示产品信息。

需要说明的是，可以将页面分区的起始位置和结束位置与页面分区的分区ID进行绑定，以更好地调用所需要的起始位置的信息和结束位置的信息。

在一种应用场景中，可以预先设置好基础的动画属性变量(例如隐藏、显示、淡入淡出等)，在为动画元素配置控制参数时，可以配置对应的动画属性变量，以实现通用基础无需人为控制的css动画。对于复杂的三维特效，也可以设置指令名，从而根据requestAnimationFrame建立底层的js能力，实现复杂的三维动效。

进一步的，为动画元素配置动画控制参数，以实现在动画显示时根据预先定义的解析函数解析动画元素上配置(即绑定)的动画控制参数，获取动画元素的动画属性名称、动画起始触发参数和动画终止触发参数等参数，从而计算出对应的动效参数值，实现动画特效的展示。其中，动画属性名称中包含属性前缀，根据属性前缀可以确定需要显示的动画的类型(例如隐藏、显示、淡入淡出等)。需要说明的是，对于一个动画元素，可以绑定多组动画控制参数，以实现复杂二维平面动效的实现，获得更好的动画显示效果。

在一种应用场景中，还可以为动画元素配置自定义的其它控制参数，或自定义调整基础动画参数，从而实现调整动画的速率。例如，可以调整速度、步长、比例、样式等参数，从而使显示的动画的速度随自定义参数呈现出流畅丝滑、有过渡的效果。

如此，将对应的动画控制参数绑定到动画元素上，可以实现对应的动画效果，并且动画效果还可以随着用户鼠标的滑动进行动画的前进和后退，且整体动画丝滑不卡顿，具有过渡效果，让交互更具有交互性，提升用户使用体验。

本申请实施例第一方面公开一种动画配置方法，可以获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；为各上述页面分区配置对应的动画元素组中的动画元素；根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

由于在本申请实施例中，在动画配置过程中，对动画元素进行分组，并对目标显示页面进行分区，从而基于页面分区和动画元素组，实现动画元素的分区域控制，针对动画元素配置动画控制参数时只需要配置其在所属的页面分区中的动画控制参数，有利于提高动画配置的效率和控制准确性。

本申请实施例第二方面提供一种动画显示方法，请参阅图3，图3是本申请实施例提供的一种动画显示方法的流程示意图，该动画显示方法的具体流程可以如下：

301、获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置。

其中，上述目标显示页面是需要进行动画显示的页面，页面分区信息用于指示目标显示页面的页面分区情况，例如，可以指示各页面分区的起始位置和终止位置，和/或上述起始位置对应的滑动条比例和终止位置对应的滑动条比例。

302、根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区。

在一种应用场景中，根据当前的滑动条位置和页面分区信息，确定与当前滑动条位置匹配的需要进行显示的目标页面分区。

303、获取上述目标页面分区中动画元素的动画控制参数。

具体的，确定目标页面分区之后，只需要获取该目标页面分区中动画元素的动画控制参数，不需要获取其他页面分区中动画元素的动画控制参数，可以实现逐个分区的动画控制，降低动画显示控制的复杂度，提高动画显示控制的效率和准确性。

304、根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

具体的，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

上述根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果，包括：

根据上述滑动条位置确定滑动条在上述目标页面分区中对应的当前滑动比例；

根据上述当前滑动比例和上述动画起始触发参数，确定上述目标页面分区中待触发的目标动画元素，其中，上述动画元素的动画起始触发参数用于指示与上述动画元素的显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动条滑动比例；

根据上述当前滑动比例，以及上述目标动画元素的动画属性名称、动画起始触发参数和动画终止触发参数，控制上述目标动画元素的显示效果。

由于在本申请实施例中，在动画显示过程中，可以获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；获取上述目标页面分区中动画元素的动画控制参数；根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

如此，根据滑动条位置实现动画的分区显示控制，能够提升动画显示效果，从而提升用户使用体验。

需要说明的是，基于本申请实施例的方案，可以对动画效果进行扩容以增加本申请实施例方案的适配率，在动画配置过程中，只需要进行动画元素的分组和页面分区，从而针对每一个页面分区绑定对应动画元素的控制参数。且可以实现自定义参数的设置，提高动画显示的流畅性。从底层上保证动效能力的统一，且可以提高动画配置效率。在动画显示过程中，可以根据鼠标的滑动控制动画的显示，从而提升显示效果和用户使用体验。

对应于本申请实施例第一方面提供的动画配置方法，本申请实施例第三方面提供一种动画配置装置。其中名词的含义与本申请实施例第一方面提供的动画配置方法中相同，具体实现细节可以参考方法实施例中的说明。

请参阅图4，图4是本申请实施例提供的一种动画配置装置的结构框图，该装置包括：

数据获取模块401，用于获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

动画元素分组模块402，用于根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；

页面分区模块403，用于根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；

动画元素配置模块404，用于为各上述页面分区配置对应的动画元素组中的动画元素；

参数配置模块405，用于根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

在一些可选的实施例中，上述动画元素分组模块402具体用于：

根据上述动画效果描述数据确定各上述动画元素在上述目标显示页面中的显示触发位置；

根据上述显示触发位置对上述动画元素进行分组，获得多个动画元素组。

在一些可选的实施例中，上述页面分区模块403具体用于：

针对每一动画元素组，根据上述动画元素组中各上述动画元素的显示触发位置，确定上述动画元素组对应的显示触发起始位置和显示触发终止位置；

根据各上述动画元素组对应的显示触发起始位置和显示触发终止位置，对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区。

在一些可选的实施例中，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

上述参数配置模块405具体用于：

针对每一动画元素，根据上述动画效果描述数据确定上述动画元素对应的动画属性名称以及上述动画元素在上述目标显示页面中的显示触发位置和显示终止位置；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示触发位置，确定与上述显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画起始触发参数；

根据上述页面分区的起始位置、上述页面分区的终止位置以及上述动画元素在上述目标显示页面中的显示终止位置，确定与上述显示终止位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动比例并作为上述动画终止触发参数。

在一些可选的实施例中，上述动画控制参数还包括显示速率控制参数；

上述参数配置模块405还具体用于：

根据上述动画效果描述数据确定各上述动画元素对应的显示速率初始控制参数；

获取速率调整指令，根据上述速率调整指令调整上述动画元素对应的显示速率初始控制参数，获得上述动画元素对应的显示速率控制参数。

如此，在动画配置过程中，对动画元素进行分组，并对目标显示页面进行分区，从而基于页面分区和动画元素组，实现动画元素的分区域控制，针对动画元素配置动画控制参数时只需要配置其在所属的页面分区中的动画控制参数，有利于提高动画配置的效率和控制准确性。

对应于本申请实施例第二方面提供的动画显示方法，本申请实施例四方面提供一种动画显示装置。其中名词的含义与本申请实施例第二方面提供的动画显示方法中相同，具体实现细节可以参考方法实施例中的说明。

请参阅图5，图5是本申请实施例提供的一种动画显示装置的结构框图，该装置包括：

信息获取模块501，用于获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；

目标页面分区确定模块502，用于根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；

控制参数获取模块503，用于获取上述目标页面分区中动画元素的动画控制参数；

显示控制模块504，用于根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

在一些可选的实施例中，上述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

上述显示控制模块504具体用于：

根据上述滑动条位置确定滑动条在上述目标页面分区中对应的当前滑动比例；

根据上述当前滑动比例和上述动画起始触发参数，确定上述目标页面分区中待触发的目标动画元素，其中，上述动画元素的动画起始触发参数用于指示与上述动画元素的显示触发位置匹配的滑动条位置在上述动画元素所属的页面分区中对应的滑动条滑动比例；

根据上述当前滑动比例，以及上述目标动画元素的动画属性名称、动画起始触发参数和动画终止触发参数，控制上述目标动画元素的显示效果。

如此，根据滑动条位置实现动画的分区显示控制，能够提升动画显示效果，从而提升用户使用体验。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

相应的，本申请实施例还提供一种电子设备，该电子设备可以为终端，该终端可以为智能手机、平板电脑、笔记本电脑、触控屏幕、游戏机、个人计算机(PC，PersonalComputer)、个人数字助理(PDA，Personal Digital Assistant)等终端设备。如图6所示，图6是本申请实施例提供的电子设备的结构示意图。该电子设备600包括有一个或者一个以上处理核心的处理器601、有一个或一个以上计算机可读存储介质的存储器602及存储在存储器602上并可在处理器上运行的计算机程序。其中，处理器601与存储器602电性连接。本领域技术人员可以理解，图6中示出的电子设备结构并不构成对电子设备的限定，可以包括比图6所示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

处理器601是电子设备600的控制中心，利用各种接口和线路连接整个电子设备600的各个部分，通过运行或加载存储在存储器602内的软件程序和/或模块，以及调用存储在存储器602内的数据，执行电子设备600的各种功能和处理数据，从而对电子设备600进行整体监控。处理器601可以是中央处理器CPU、图形处理器GPU、网络处理器(NP，NetworkProcessor)等，可以实现或者执行本申请实施例中公开的各方法、步骤及逻辑框图。

在本申请实施例中，电子设备600中的处理器601会按照如下的步骤，将一个或一个以上的应用程序的进程对应的指令加载到存储器602中，并由处理器601来运行存储在存储器602中的应用程序，从而实现各种功能，例如：

获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；

根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；

为各上述页面分区配置对应的动画元素组中的动画元素；

根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

或者：

获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；

根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；

获取上述目标页面分区中动画元素的动画控制参数；

根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

可选的，如图6所示，电子设备600还包括：触控显示屏603、射频电路604、音频电路605、输入单元606以及电源607。其中，处理器601分别与触控显示屏603、射频电路604、音频电路605、输入单元606以及电源607电性连接。本领域技术人员可以理解，图6中示出的电子设备结构并不构成对电子设备的限定，可以包括比图6所示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

触控显示屏603可用于显示图形用户界面以及接收用户作用于图形用户界面产生的操作指令。触控显示屏603可以包括显示面板和触控面板。其中，显示面板可用于显示由用户输入的信息或提供给用户的信息以及电子设备的各种图形用户接口，这些图形用户接口可以由图形、文本、图标、视频和其任意组合来构成。可选的，可以采用液晶显示器(LCD，Liquid Crystal Display)、有机发光二极管(OLED，Organic Light-Emitting Diode)等形式来配置显示面板。触控面板可用于收集用户在其上或附近的触摸操作(比如用户使用手指、触笔等任何适合的物体或附件在触控面板上或在触控面板附近的操作)，并生成相应的操作指令，且操作指令执行对应程序。可选的，触控面板可包括触摸检测装置和触摸控制器两个部分。其中，触摸检测装置检测用户的触摸方位，并检测触摸操作带来的信号，将信号传送给触摸控制器；触摸控制器从触摸检测装置上接收触摸信息，并将它转换成触点坐标，再送给处理器601，并能接收处理器601发来的命令并加以执行。触控面板可覆盖显示面板，当触控面板检测到在其上或附近的触摸操作后，传送给处理器601以确定触摸事件的类型，随后处理器601根据触摸事件的类型在显示面板上提供相应的视觉输出。在本申请实施例中，可以将触控面板与显示面板集成到触控显示屏603而实现输入和输出功能。但是在某些实施例中，触控面板与显示面板可以作为两个独立的部件来实现输入和输出功能。即触控显示屏603也可以作为输入单元606的一部分实现输入功能。

射频电路604可用于收发射频信号，以通过无线通信与网络设备或其他电子设备建立无线通讯，与网络设备或其他电子设备之间收发信号。

音频电路605可以用于通过扬声器、传声器提供用户与电子设备之间的音频接口。音频电路605可将接收到的音频数据转换后的电信号，传输到扬声器，由扬声器转换为声音信号输出；另一方面，传声器将收集的声音信号转换为电信号，由音频电路605接收后转换为音频数据，再将音频数据输出处理器601处理后，经射频电路604以发送给比如另一电子设备，或者将音频数据输出至存储器602以便进一步处理。音频电路605还可能包括耳塞插孔，以提供外设耳机与电子设备的通信。

输入单元606可用于接收输入的数字、字符信息或用户特征信息(例如指纹、虹膜、面部信息等)，以及产生与用户设置以及功能控制有关的键盘、鼠标、操作杆、光学或者轨迹球信号输入。

电源607用于给电子设备600的各个部件供电。可选的，电源607可以通过电源管理系统与处理器601逻辑相连，从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。电源607还可以包括一个或一个以上的直流或交流电源、再充电系统、电源故障检测电路、电源转换器或者逆变器、电源状态指示器等任意组件。

尽管图6中未示出，电子设备600还可以包括摄像头、传感器、无线保真模块、蓝牙模块等，在此不再赘述。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

本领域普通技术人员可以理解，上述实施例的各种方法中的全部或部分步骤可以通过指令来完成，或通过指令控制相关的硬件来完成，该指令可以存储于一计算机可读存储介质中，并由处理器进行加载和执行。

为此，本申请实施例提供一种计算机可读存储介质，其中存储有多条计算机程序，该计算机程序能够被处理器进行加载，以执行本申请实施例所提供的任一种动画配置方法或动画显示方法中的步骤。例如，该计算机程序可以执行如下步骤：

获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

根据上述动画效果描述数据对上述动画元素进行分组，获得多个动画元素组；

根据上述动画元素组对上述目标显示页面进行分区，获得各上述动画元素组对应的页面分区；

为各上述页面分区配置对应的动画元素组中的动画元素；

根据上述动画效果描述数据、上述页面分区的起始位置和上述页面分区的终止位置，为各上述动画元素配置上述动画元素在所属页面分区中的动画控制参数。

或者：

获取目标显示页面的页面分区信息和上述目标显示页面当前所在页面窗口的滑动条位置；

根据上述滑动条位置和上述页面分区信息，从上述目标显示页面的多个页面分区中确定待显示的目标页面分区；

获取上述目标页面分区中动画元素的动画控制参数；

根据上述滑动条位置和上述动画元素的动画控制参数，控制上述目标页面分区中动画元素的显示效果。

以上各个操作的具体实施可参见前面的实施例，在此不再赘述。

其中，该存储介质可以包括：只读存储器(ROM，Read Only Memory)、随机存取记忆体(RAM，Random Access Memory)、磁盘或光盘等。

由于该存储介质中所存储的计算机程序，可以执行本申请实施例所提供的任一种动画配置方法或任一种动画显示方法中的步骤，因此，可以实现本申请实施例所提供的任一种动画配置方法或任一种动画显示方法所能实现的有益效果，详见前面的实施例，在此不再赘述。

根据本申请的一个方面，还提供了一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行上述实施例中的各种可选实现方式中提供的方法。

以上对本申请实施例所提供的动画配置方法、动画显示方法、装置、电子设备及介质进行了详细介绍，本文中应用了具体个例对本申请的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本申请的方法及其核心思想；同时，对于本领域的技术人员，依据本申请的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本申请的限制。

Claims (11)

1.一种动画配置方法，其特征在于，所述方法包括：

获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

根据所述动画效果描述数据对所述动画元素进行分组，获得多个动画元素组；

根据所述动画元素组对所述目标显示页面进行分区，获得各所述动画元素组对应的页面分区；

为各所述页面分区配置对应的动画元素组中的动画元素；

根据所述动画效果描述数据、所述页面分区的起始位置和所述页面分区的终止位置，为各所述动画元素配置所述动画元素在所属页面分区中的动画控制参数。

2.根据权利要求1所述的动画配置方法，其特征在于，所述根据所述动画效果描述数据对所述动画元素进行分组，获得多个动画元素组，包括：

根据所述动画效果描述数据确定各所述动画元素在所述目标显示页面中的显示触发位置；

根据所述显示触发位置对所述动画元素进行分组，获得多个动画元素组。

3.根据权利要求2所述的动画配置方法，其特征在于，所述根据所述动画元素组对所述目标显示页面进行分区，获得各所述动画元素组对应的页面分区，包括：

针对每一动画元素组，根据所述动画元素组中各所述动画元素的显示触发位置，确定所述动画元素组对应的显示触发起始位置和显示触发终止位置；

根据各所述动画元素组对应的显示触发起始位置和显示触发终止位置，对所述目标显示页面进行分区，获得各所述动画元素组对应的页面分区。

4.根据权利要求1所述的动画配置方法，其特征在于，所述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

所述根据所述动画效果描述数据、所述页面分区的起始位置和所述页面分区的终止位置，为各所述动画元素配置所述动画元素在所属页面分区中的动画控制参数，包括：

针对每一动画元素，根据所述动画效果描述数据确定所述动画元素对应的动画属性名称以及所述动画元素在所述目标显示页面中的显示触发位置和显示终止位置；

根据所述页面分区的起始位置、所述页面分区的终止位置以及所述动画元素在所述目标显示页面中的显示触发位置，确定与所述显示触发位置匹配的滑动条位置在所述动画元素所属的页面分区中对应的滑动比例并作为所述动画起始触发参数；

根据所述页面分区的起始位置、所述页面分区的终止位置以及所述动画元素在所述目标显示页面中的显示终止位置，确定与所述显示终止位置匹配的滑动条位置在所述动画元素所属的页面分区中对应的滑动比例并作为所述动画终止触发参数。

5.根据权利要求4所述的动画配置方法，其特征在于，所述动画控制参数还包括显示速率控制参数；

所述根据所述动画效果描述数据、所述页面分区的起始位置和所述页面分区的终止位置，为各所述动画元素配置所述动画元素在所属页面分区中的动画控制参数，还包括：

根据所述动画效果描述数据确定各所述动画元素对应的显示速率初始控制参数；

获取速率调整指令，根据所述速率调整指令调整所述动画元素对应的显示速率初始控制参数，获得所述动画元素对应的显示速率控制参数。

6.一种动画显示方法，其特征在于，所述方法包括：

获取目标显示页面的页面分区信息和所述目标显示页面当前所在页面窗口的滑动条位置；

根据所述滑动条位置和所述页面分区信息，从所述目标显示页面的多个页面分区中确定待显示的目标页面分区；

获取所述目标页面分区中动画元素的动画控制参数；

根据所述滑动条位置和所述动画元素的动画控制参数，控制所述目标页面分区中动画元素的显示效果。

7.根据权利要求6所述的动画显示方法，其特征在于，所述动画控制参数包括动画属性名称、动画起始触发参数和动画终止触发参数；

所述根据所述滑动条位置和所述动画元素的动画控制参数，控制所述目标页面分区中动画元素的显示效果，包括：

根据所述滑动条位置确定滑动条在所述目标页面分区中对应的当前滑动比例；

根据所述当前滑动比例和所述动画起始触发参数，确定所述目标页面分区中待触发的目标动画元素，其中，所述动画元素的动画起始触发参数用于指示与所述动画元素的显示触发位置匹配的滑动条位置在所述动画元素所属的页面分区中对应的滑动条滑动比例；

根据所述当前滑动比例，以及所述目标动画元素的动画属性名称、动画起始触发参数和动画终止触发参数，控制所述目标动画元素的显示效果。

8.一种动画配置装置，其特征在于，所述装置包括：

数据获取模块，用于获取待配置到目标显示页面上的多个动画元素和对应的动画效果描述数据；

动画元素分组模块，用于根据所述动画效果描述数据对所述动画元素进行分组，获得多个动画元素组；

页面分区模块，用于根据所述动画元素组对所述目标显示页面进行分区，获得各所述动画元素组对应的页面分区；

动画元素配置模块，用于为各所述页面分区配置对应的动画元素组中的动画元素；

参数配置模块，用于根据所述动画效果描述数据、所述页面分区的起始位置和所述页面分区的终止位置，为各所述动画元素配置所述动画元素在所属页面分区中的动画控制参数。

9.一种动画显示装置，其特征在于，所述装置包括：

信息获取模块，用于获取目标显示页面的页面分区信息和所述目标显示页面当前所在页面窗口的滑动条位置；

目标页面分区确定模块，用于根据所述滑动条位置和所述页面分区信息，从所述目标显示页面的多个页面分区中确定待显示的目标页面分区；

控制参数获取模块，用于获取所述目标页面分区中动画元素的动画控制参数；

显示控制模块，用于根据所述滑动条位置和所述动画元素的动画控制参数，控制所述目标页面分区中动画元素的显示效果。

10.一种电子设备，其特征在于，包括存储器和处理器；所述存储器存储有应用程序，所述处理器用于运行所述存储器内的应用程序，以执行权利要求1至5任一项所述的动画配置方法中的步骤或权利要求6或7所述的动画显示方法中的步骤。

11.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有多条指令，所述指令适于处理器进行加载，以执行权利要求1至5任一项所述的动画配置方法中的步骤或权利要求6或7所述的动画显示方法中的步骤。