一种视图的动画效果实现方法及装置与流程

本发明涉及视图动画技术领域，更具体地，涉及一种视图的动画效果实现方法及装置。

背景技术：

在客户端的视图开发过程中，经常会使用到动画效果，目前通常的做法是，运用系统中已有的动画效果来设置每一个视图的动画效果，比如一个视图飞入屏幕的方式，旋转飞入还是缩放飞入。

针对不同的动画效果，需要对同一个视图设置多次动效效果参数，这样会操作繁琐，影响工作效率，同时在对视图的动画效果参数进行设置的过程中，与用户属于零交互过程，用户的体验性比较差。

技术实现要素：

本发明提供一种克服上述问题或者至少部分地解决上述问题的视图的动画效果实现方法及装置。

根据本发明的第一方面，提供了一种视图的动画效果实现方法，应用于触摸型终端，包括：

s1，监听触摸型终端上视图的手势操作事件；

s2，根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；

s3，根据所述视图动画效果参数，对视图进行动画展示。

本发明的有益效果为：针对客户端中产品的动效需求，提出了一套基于手势的弹性动画特效实现方法，根据对视图的手势操作，对视图赋予不同的动画效果，使得动画更为逼真和真实。

在上述技术方案的基础上，本发明还可以作如下改进。

进一步的，所述手势操作事件包括手势按下事件、手势滑动事件和手势抬起事件；

所述步骤s2中通过如下方式计算对视图的手势滑动偏移距离：

s21a，监听手势按下事件，记录按下点的横纵坐标(ax，ay)；

s22a，监听手势滑动事件，记录在手势滑动过程中的手指当前位置的横纵坐标(ex，ey)；

s23a，分别获取横轴的滑动偏移距离δx＝ex-ax和纵轴的滑动偏移距离δy＝ey-ay，将δx和δy中的较大者作为对视图的手势滑动偏移距离。

进一步的，所述步骤s2中通过如下方式建立对视图的手势滑动偏移距离和视图动画效果参数之间的映射关系：

s21b，检测手势抬起事件，记录抬起点的横纵坐标；

s22b，根据手势按下点的横纵坐标和抬起点的横纵坐标，确定手势滑动偏移距离的取值范围；

s23b，根据确定的手势滑动偏移距离的取值范围和预设的视图动画效果参数的取值范围，建立手势滑动偏移距离与视图动画效果参数之间的映射关系。

进一步的，所述步骤s22b具体包括：

设抬起点的横纵坐标为(gx，gy)，分别获取横轴的手势滑动偏移距离δx'=gx-ax和纵轴的手势滑动偏移距离δy'＝gy-ay，根据δx'和δy'中的较大值确定手势滑动偏移距离的取值范围。

进一步的，所述动画效果参数包括视图缩放比例和视图透明度。

进一步的，预设的所述视图缩放比例p的取值范围为0＜p≤1.1，所述视图透明度t的取值范围为0＜t≤1。

进一步的，所述手势滑动偏移距离与视图缩放比例之间为二阶曲线关系，所述手势滑动偏移距离与视图透明度之间为一阶线性关系。

进一步的，所述步骤s3具体包括：

在手势对视图的滑动过程中，实时根据当前手势滑动偏移距离得到对应的视图缩放比例和透明度，对视图进行动画展示；或者，

当监听到手势抬起事件时，根据手势抬起时的手势滑动偏移距离，得到对应的视图缩放比例和透明度，对视图进行动画展示。

根据本发明的一个方面，提供了一种视图的动画效果实现装置，包括：

监听模块，用于监听触摸型终端上视图的手势操作事件；

获取模块，用于根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；

展示模块，用于根据所述视图动画效果参数，对视图进行动画展示。

根据第三方面，一种视图的动画效果实现方法的设备，其特征在于，包括处理器(processor)、存储器(memory)和总线；

所述处理器和存储器通过所述总线完成相互间的通信；

所述存储器存储有可被所述处理器执行的程序指令，所述处理器调用所述程序指令能够执行如下方法：

监听触摸型终端上视图的手势操作事件；根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；根据所述视图动画效果参数，对视图进行动画展示。

附图说明

图1为本发明一个实施例中的视图的动画效果实现方法流程图；

图2为本发明一个实施例的手势滑动偏移距离与视图缩放比之间的映射关系曲线图；

图3为本发明一个实施例的手势滑动偏移距离与视图透明度之间的映射关系曲线图；

图4为本发明另一个实施例的视图的动画效果实现装置连接框图；

图5为本发明有一个实施例的视图的动画效果实现装置的整体连接框图；

图6为本发明又一个实施例的视图的动画效果实现方法的设备连接框图。

具体实施方式

下面结合附图和实施例，对本发明的具体实施方式作进一步详细描述。以下实施例用于说明本发明，但不用来限制本发明的范围。

参见图1，图1提供了一种视图的动画效果实现方法，应用于触摸型终端，能够根据用户对视图的手势操作事件，赋予视图不同的动画效果，使得视图动画更加逼真和真实。该方法包括：s1，监听触摸型终端上视图的手势操作事件；s2，根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；s3，根据所述视图动画效果参数，对视图进行动画展示。

当用户希望视图展现出不同的动画效果时，可以对触摸屏上的视图进行手势操作，其中的触摸型终端可以为触摸型手机或者触摸型电脑等。当触摸型终端检测到视图上的手势操作事件时，根据用户在对视图操作的过程中，对视图的手势滑动偏移距离，以及预先建立好的手势滑动偏移距离和视图动画效果参数之间的映射关系，得到与手势滑动偏移距离相对应的动画效果参数。然后，根据视图动画效果参数，对视图实现不同动画效果的展示。

本实施例针对客户端中视图的动效需求，提出了一套基于手势的弹性动画特效实现方法，根据对视图的手势操作，对视图赋予不同的动画效果，使得动画更为逼真和真实。

在本发明的一个实施例中，所述手势操作事件包括手势按下事件、手势滑动事件和手势抬起事件。

所述步骤s2中通过如下方式计算对视图的手势滑动偏移距离：s21a，监听手势按下事件，记录按下点的横纵坐标(ax，ay)；s22a，监听手势滑动事件，记录在手势滑动过程中的当前位置的横纵坐标(ex，ey)；s23a，分别获取横轴的滑动偏移距离δx＝ex-ax和纵轴的滑动偏移距离δy＝ey-ay，将δx和δy中的较大者作为对视图的手势滑动偏移距离。

在用户对触摸型终端上的视图进行手势操作的过程中，用户的手势操作事件分别包括手势按下事件、手势滑动事件和手势抬起事件。在本实施例中，对视图的手势检测是整个动画效果的基础，后续动画效果参数的获取都是基于手势变化来进行的。本方案中的手势变化的检测是通过复写系统的ontouch方法来进行监听的，ontouch方法会返回当前手势操作的事件信息，通过手势的操作事件信息来判断当前的手势状态。

用户通过手势对视图进行操作的过程中，比如，对视图进行缩放的时候，通常是两根手指进行划开或者收拢，在通常情况下两根手指划开或者收拢的距离相对按下点的距离时相等的，因此，本方案为了方便，用户在对视图操作的过程中的坐标位置的获取是以按下点为中心，检测一个手指的坐标来进行后续计算的，即下述的坐标均是指其中一个手指的坐标。在具体的过程中，通过监听在视图上的手势按下事件，并记录按下点的横纵坐标(ax，ay)，将按下点作为手势滑动的起始点。监听手势滑动事件，并记录在手势滑动过程中，手指的当前位置的横纵坐标(ex，ey)。分别获取横轴的滑动偏移距离δx＝ex-ax和纵轴的滑动偏移距离δy＝ey-ay，并将δx和δy中的较大者作为手势对视图的滑动偏移距离。其中，选取δx和δy中的较大者作为手势滑动偏移距离，是因为在滑动的时候有可能横轴和纵轴上的手势滑动偏移距离不相等，为了能够体现用户手势滑动的这个动作，所以取较大者作为用户在触摸型终端上的手势滑动偏移距离，如果两者相等，则取两者中任意值均可。

在本发明的另一个实施例中，所述步骤s2中通过如下方式建立对视图的手势滑动偏移距离和视图动画效果参数之间的映射关系：s21b，监听手势抬起事件，记录抬起点的横纵坐标；s22b，根据手势按下点的横纵坐标和抬起点的横纵坐标，确定手势滑动偏移距离的取值范围；s23b，根据确定的手势滑动偏移距离的取值范围和预设的视图动画效果参数的取值范围，设计手势滑动偏移距离与视图动画效果参数之间的映射关系。

上述检测了用户的手势按下事件和手势滑动事件后，并根据手势按下点的横纵坐标和手势滑动过程中的当前位置的横纵坐标，计算出了用户对视图的手势滑动偏移距离。随后，再检测手势抬起事件，并记录抬起点的横纵坐标(gx，gy)，根据手势按下点的横纵坐标(ax，ay)以及抬起点的横纵坐标(gx，gy)，确定手势滑动偏移距离的取值范围。本实施例还根据具体需求设计视图动画效果参数的取值范围，在手势滑动偏移距离的取值范围和视图动画效果参数的取值范围均满足的条件下，设计手势滑动偏移距离和视图动画效果参数之间的对应关系。在实际用户对手势滑动的过程中，根据手势滑动偏移距离和该对应关系，就可以得到视图动画效果参数。

在本发明的一个实施例中，所述步骤s22b中根据手势按下点的横纵坐标和抬起点的横纵坐标，确定手势滑动偏移距离的取值范围具体包括：设抬起点的横纵坐标为(gx，gy)，分别获取横轴的手势滑动偏移范围δx'＝gx-ax和纵轴的手势滑动偏移范围δy'＝gy-ay，根据δx'和δy'中的较大值确定手势滑动偏移距离的取值范围。

上述实施例中检测并记录了手指按下点的横纵坐标(ax，ay)以及手指抬起的横纵坐标(gx，gy)，随后根据手指按下的横纵坐标和手指抬起的横纵坐标，分别计算横轴的手势滑动偏移范围δx'＝gx-ax和纵轴的手势滑动偏移范围δy'＝gy-ay，根据δx'和δy'中的较大值确定手势滑动偏移距离的取值范围，其中，手势滑动偏移距离的取值范围为0～max(|δx'|，|δy'|)。

在本发明的一个实施例中，所述动画效果参数包括视图缩放比例和视图透明度；预先设置的视图缩放比例p的取值范围为0＜p≤1.1，视图透明度t的取值范围为0＜t≤1。

在本实施例中，所说的视图动画效果参数主要是指视图缩放比例和视图透明度，可根据用户对视图的手势操作过程中的手势滑动偏移距离，得到视图对应的缩放比例和透明度，并根据视图缩放比例和透明度，对视图进行相应缩放比例和相应透明度的动画效果展示。在本实施例中，视图缩放比例p的取值范围设计为0＜≤1.1，其中，之所以设计视图缩放比例的最大值为1.1，是为了实现物理上的惯性效果，即动画从小到大再到小的一个过程，对应视图缩放比从0到1.1再到1的过程，给人一种动画具有弹性效果的体验，也就是所谓的物理惯性效果。而视图透明度t的取值范围为0＜t≤1，视图透明度与视图缩放比例不一样，视图缩放时会有一个放大缩小的动画特效，但是透明度的变化是不需要惯性这种特效的，因此，设计为0到1即可。

在本发明的另一个实施例中，所述手势滑动偏移距离与视图缩放比例值之间为二阶曲线关系，所述手势滑动偏移距离与视图透明度之间为线性关系。

在上述实施例中介绍了手势滑动偏移距离与视图动画效果参数之间的映射关系是根据手势滑动偏移距离的取值范围和视图动画效果参数的取值范围来确定的。通过上述实施例可知，手势滑动偏移距离的取值范围为0～max(|δx'|，|δy'|)，而设计的视图缩放比例的取值范围为0到1.1，由于用户在视图上滑动的加速度是不同的，因此，本实施例设计的手势滑动偏移距离与视图缩放比例之间的映射关系为二阶曲线关系式，二阶曲线关系式可以设计为如下的函数方程：

y＝ax²+bx+c；

其中，a、b、c为常量，x为手势滑动偏移距离，取值范围为0～max(|δx'|，|δy'|)，y的取值范围为0到1.1，其中，不包括0。为便于理解，设计的函数关系图形可参见图2，其中，x1到x2即为x轴的取值范围域，y轴表示的是视图缩放比例的取值，y轴的取值范围为0到1.1。在满足手势滑动偏移距离的取值范围和视图缩放比例的取值范围的条件下，可以先画出一条二阶曲线，然后根据二阶曲线上的3个点，即可求出常量系数a、b和c，进而得到具体的函数关系式，即手势滑动偏移距离与视图缩放比例之间的函数映射关系式。

同样的，对于手势滑动偏移距离与视图透明度之间的映射关系，在本实施例中，视图透明度和手势滑动偏移距离之间时线性关系，可以设计的手势滑动偏移距离与视图透明度之间的函数映射关系式为：

y＝dx+e；

其中，d和e为常量，x为手势滑动偏移距离，取值范围为0～max(|δx'|，|δy'|)，y为视图透明度，y的取值范围为0到1，其中，不包括0。为便于理解，设计的函数关系图形可参见图3，x轴的取值范围为x1到x2，对应的y轴的取值范围为0到1，变化关系为线性变化关系。

在满足手势滑动偏移距离的取值范围和视图透明度的取值范围的条件下，可以先根据具体需求做出一条直线，然后根据直线上的一个点，即可求出常量系数d和e，进而得到具体的函数关系式，即手势滑动偏移距离与视图透明度之间的函数映射关系式。

通过上述的方法设计了手势滑动偏移距离和视图缩放比例之间的映射关系，以及设计了手势滑动偏移距离和视图透明度之间的映射关系，建立起了视图缩放比例和透明度与手势滑动偏移距离之间的关系。

在本发明的另一个实施例中，所述步骤s3具体包括：在手势对视图的滑动过程中，实时根据当前手势滑动偏移距离得到对应的视图缩放比例和透明度，对视图进行动画展示；或者，当监听到手势抬起事件时，根据手势抬起时的手势滑动偏移距离，得到对应的视图缩放比例和透明度，对视图进行动画展示。

上述实施例中得到了手势滑动偏移距离和视图缩放比例以及视图透明度之间的映射关系，在用户对视图进行手势滑动的过程中，可根据实时的手势滑动偏移距离得到视图实时的缩放比例和实时透明度，本实施例根据视图缩放比例和透明度，对视图进行动画展示。将缩放动画标记为anima1，将透明度动画标记为anima2，在手势对视图的滑动过程中，实时根据当前手势滑动偏移距离得到对应的视图缩放比例和视图透明度，对视图进行动画展示。或者，当监听到手势抬起事件时，根据手势抬起时的手势滑动偏移距离，得到对应的视图缩放比例和视图透明度，对视图进行动画展示。

为了使得anima1和anima2的动画效果是同时开启的，可以使用的ainmationset类，通过ainmationset这个工具类可以对同一视图开启不同的动画特效。具体是调用ainmationset类中的add方法将anima1和anima2动画添加到ainmationset中，然后再调用ainmationset中的start方法，就能够同时执行anima1和anima2动画了。

参见图4，提供了本发明另一个实施例的视图的动画效果实现装置，包括监听模块21、获取模块22和展示模块23。

其中，监听模块21，用于监听触摸屏终端上视图的手势操作事件；

获取模块22，用于根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；

展示模块23，用于根据所述视图动画效果参数，对视图进行动画展示。

参见图5，视图的动画效果实现装置还包括计算模块24、确定模块25和建立模块26。

监听模块21，还用于监听手势按下事件，并记录按下点的横纵坐标(ax，ay)；以及监听手势滑动事件，并记录在手势滑动过程中的当前位置的横纵坐标(ex，ey)。

计算模块24，用于分别计算横轴的滑动偏移距离δx＝ex-ax和纵轴的滑动偏移距离δy＝ey-ay，将δx和δy中的较大者作为手势对视图的滑动偏移距离。

监听模块21，还用于监听手势抬起事件，记录抬起点的横纵坐标。

确定模块25，用于根据手势按下点的横纵坐标和抬起点的横纵坐标，确定手势滑动偏移距离的取值范围。

建立模块26，用于根据确定的手势滑动偏移距离的取值范围和预设的视图动画效果参数的取值范围，建立手势滑动偏移距离与视图动画效果参数之间的映射关系。

所述确定模块25，还用于分别计算横轴的手势滑动偏移距离δx'＝gx-ax和纵轴的手势滑动偏移距离δy'＝gy-ay，根据δx'和δy'中的较大值确定手势滑动偏移距离的取值范围，其中，抬起点的横纵坐标为(gx，gy)。

所述的展示模块23，具体用于：

在手势对视图的滑动过程中，实时根据当前手势滑动偏移距离得到对应的视图缩放比例和透明度，对视图进行动画展示；或者，

当监听到手势抬起事件时，根据手势抬起时的手势滑动偏移距离，得到对应的视图缩放比例和透明度，对视图进行动画展示。

图6示出本申请实施例的视图的动画效果实现方法的设备的结构框图。

参照图6，所述视图的动画效果实现方法的设备，包括：处理器(processor)601、存储器(memory)602和总线603；其中，所述处理器601和存储器602通过所述总线603完成相互间的通信。

所述处理器601用于调用所述存储器602中的程序指令，以执行上述各方法实施例所提供的方法，例如包括：监听触摸型终端上视图的手势操作事件；根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；根据所述视图动画效果参数，对视图进行动画展示。

本实施例公开一种计算机程序产品，所述计算机程序产品包括存储在非暂态计算机可读存储介质上的计算机程序，所述计算机程序包括程序指令，当所述程序指令被计算机执行时，计算机能够执行上述各方法实施例所提供的方法，例如包括：监听触摸型终端上视图的手势操作事件；根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；根据所述视图动画效果参数，对视图进行动画展示。

本实施例提供一种非暂态计算机可读存储介质，所述非暂态计算机可读存储介质存储计算机指令，所述计算机指令使所述计算机执行上述各方法实施例所提供的方法，例如包括：监听触摸型终端上视图的手势操作事件；根据对视图的手势滑动偏移距离以及手势滑动偏移距离和视图动画效果参数之间的映射关系，得到视图动画效果参数；根据所述视图动画效果参数，对视图进行动画展示。

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

以上所描述的视图的动画效果实现方法的设备等实施例仅仅是示意性的，其中作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性的劳动的情况下，即可以理解并实施。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到各实施方式可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件。基于这样的理解，上述技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如rom/ram、磁碟、光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行各个实施例或者实施例的某些部分方法。

本发明提供的一种视图动画实现方法及装置，通过监听对触摸型终端上的手势操作事件，并建立手势滑动偏移距离与视图的缩放比和透明度之间的两套映射关系，将两套映射关系进行组合，同时实现对视图的缩放比和透明度的动画效果，从而达到了视图所需要的具有物理特效的弹性动画效果，通过巧妙地建立手势与动效之间的映射关系从而极大地提高了用户的使用体验以及程序人机交互的友好型。

最后，本申请的方法仅为较佳的实施方案，并非用于限定本发明的保护范围。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。