CN109697747B - 矩形翻转动画生成方法及装置 - Google Patents

Abstract

一种矩形翻转动画生成方法及装置。矩形翻转动画生成方法包括：以连续多帧投影梯形的图像构成矩形翻转动画，通过二维图形处理获得投影梯形的图像；其中，确定矩形翻转动画的一帧中的投影梯形的如下步骤：获取矩形相对于投影平面的翻转角；计算矩形在翻转角下的投影比例；以及根据投影比例确定矩形在投影平面上的投影梯形。本发明的矩形翻转动画生成方法可以使用二维(2D)图形处理引擎等来实现矩形翻转动画，具有实现成本低等特点。

Description

矩形翻转动画生成方法及装置

技术领域

本发明涉及人机交互界面(human-machine interface，HMI)，特别涉及矩形翻转动画生成方法及装置。

背景技术

为了提升用户体验，现有的人机交互界面上大量使用三维(3D)动画效果。例如，在显示屏幕上显示矩形区域从垂直于显示屏幕的位置翻转到平行于显示屏幕的3D动画效果。这些3D动画效果大部分是由3D图形处理引擎生成的。众所周知，具有3D图形处理引擎的处理芯片的价格远高于不具有3D图形处理引擎的处理芯片。这就使采用3D图形处理引擎来实现3D动画效果的产品的成本较高，在市场上不具备价格优势。

发明内容

本发明解决的问题是提供一种矩形翻转动画生成方法及装置，其可以使用二维(2D)图形处理引擎等来实现矩形翻转动画，具有实现成本低等特点。

为了解决上述问题，本发明的一方面提供了一种矩形翻转动画生成方法，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，所述方法包括：以连续多帧投影梯形的图像构成所述矩形翻转动画，通过二维图形处理获得投影梯形的图像；其中，确定所述矩形翻转动画的一帧中的投影梯形的如下步骤：获取所述矩形相对于投影平面的翻转角；计算所述矩形在所述翻转角下的投影比例；以及根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形。

本发明的另一方面提供了一种矩形翻转动画生成装置，包括：一个或多个处理器；以及其上存储有多个指令的计算机可读存储介质，所述多个指令响应于由所述一个或多个处理器执行而促使所述一个或多个处理器生成以连续多帧投影梯形的图像构成的矩形翻转动画，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，其中，确定所述矩形翻转动画的一帧中的投影梯形包括以下的动作：获取所述矩形相对于投影平面的翻转角；计算所述矩形在所述翻转角下的投影比例；以及根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形。

本发明的再一方面提供了一种非易失性计算机可读存储介质，其上存储有适于一个或多个处理器执行的多个指令，所述多个指令响应于由所述一个或多个处理器执行而促使所述一个或多个处理器生成以连续多帧投影梯形的图像构成的矩形翻转动画，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，其中，确定所述矩形翻转动画的一帧中的投影梯形包括以下的动作：获取所述矩形相对于投影平面的翻转角；计算所述矩形在所述翻转角下的投影比例；以及根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形。

与现有技术相比，上述方案具有以下优点：

本发明的矩形翻转动画生成方法及装置利用2D图形处理器、中央处理器等来生成矩形翻转动画，实现了三维动画效果。由于本发明的矩形翻转动画生成方法及装置不需要3D图形处理器来生成矩形翻转动画，在芯片选型时可以选择不具有3D图形处理引擎的处理器芯片，降低了产品的成本。

附图说明

图1例示了根据本发明一个或多个实施例的矩形翻转动画的示意图。

图2例示了根据本发明一个或多个实施例的矩形翻转动画生成装置的示例性框图；

图3例示了根据本发明一个或多个实施例的矩形翻转动画生成方法的示例性流程图；

图4例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的侧视图；

图5例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的俯视图；

图6例示了根据本发明一个或多个实施例的计算投影比例的示例性流程图；

图7例示了根据本发明一个或多个实施例的虚拟摄像机与显示屏幕的位置关系示意图；

图8例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的侧视图；

图9例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的俯视图；

图10例示了根据本发明一个或多个实施例的计算第二距离的示例性流程图；

图11例示了根据本发明一个或多个实施例的计算投影梯形的示例性流程图；

图12例示了根据本发明一个或多个实施例的投影梯形的示例图。

具体实施方式

在下面的描述中，阐述了许多具体细节以便使所属技术领域的技术人员更全面地了解本发明。但是，对于所属技术领域内的技术人员明显的是，本发明的实现可不具有这些具体细节中的一些。此外，应当理解的是，本发明并不限于所介绍的特定实施例。相反，可以考虑用下面的特征和要素的任意组合来实施本发明，而无论它们是否涉及不同的实施例。因此，下面的方面、特征、实施例和优点仅作说明之用而不应被看作是权利要求的要素或限定，除非在权利要求中明确提出。

图1例示了根据本发明一个或多个实施例的矩形翻转动画的示意图。参考图1(a)所示，画面10中具有一矩形11。

图1(b)示出了矩形11由垂直于画面10的位置，向下翻转的动画示意图。参考图1(b)所示，矩形11以边11a为翻转轴，绕该翻转轴由上向下翻转的。具体来说，在矩形11垂直于画面10的位置，矩形11在画面10的投影是与边11a重合的一条线段。在矩形11翻转的过程中，矩形11在画面10上的投影为一个或多个等腰梯形11’。同理，矩形11也可以从下向上翻转。

图1(c)示出了矩形11由垂直于画面10的位置，向右翻转的动画示意图。参考图1(c)所示，矩形11以边11b为翻转轴，绕绕该翻转轴由左向右翻转的。具体来说，在矩形11垂直于画面10的位置，矩形11在画面10的投影是与边11b重合的一条线段。在矩形11翻转的过程中，矩形11在画面10上的投影为一个或多个等腰梯形11’。同理，矩形11也可以从右向左翻转。

需要说明的是，矩形翻转动画可以由多帧图像构成，每一帧图像对应一个翻转角。每一帧图像中的投影梯形为在虚拟摄像机视角下，矩形投影至投影平面所得到的梯形，其可以通过2D图形处理引擎和/或中央处理器处理获得。在本发明的上下文中，翻转角为矩形与投影平面的法线的夹角，如图4中的角α；虚拟摄像机为透视投影中的虚拟观察者；投影平面为在透视投影中物体被投影成像的平面。下面将描述本发明的一个或多个实施例的使用2D图形处理引擎来实现矩形翻转动画的装置及方法。

图2例示了根据本发明一个或多个实施例的矩形翻转动画生成装置的示例性框图。参考图2所示，矩形翻转动画生成装置100包括处理器110和计算机可读介质120。处理器110可以执行计算机可读介质120上存储有的多个指令以执行一个或多个动作，从而实现各种功能。例如，处理器110可以执行多个指令以生成矩形翻转动画。处理器110还可以从计算机可读介质120读取数据，和/或将数据存储至计算机可读介质120中。处理器110可以包括中央处理器(Central Processing Unit，CPU)111和/或2D图形处理器(GraphicsProcessing Unit，GPU)112。中央处理器111用于对通用计算需求进行处理。2D图形处理器112用于对2D图形处理需求进行处理。一般而言，中央处理器111通过调用图形处理器112的应用程序接口(application programming interface，API)将图形处理需求发送给图形处理器112，并接收图形处理器112的处理结果。计算机可读介质120可以包括内存(Memory)121和/或存储器(Storage)122。内存121的示例包括易失性存储介质，例如随机存取存储器(Random Access Memory，RAM)等。存储器122的示例包括非易失性存储介质，例如只读存储器(Read Only Memory，ROM)、闪存、光盘、磁盘等。

矩形翻转动画生成装置100还可以包括显示屏幕130。显示屏幕130用于显示各种交互界面。例如，显示屏幕130可以显示矩形翻转动画。

矩形翻转动画生成装置100还可以包括I/O接口140。I/O接口140用于输入和/或输出信号、数据或信息。例如，矩形翻转动画生成装置100可以通过I/O接口140与外部设备进行有线或无线的数据交互。在一个或多个实施例中，矩形翻转动画生成装置100内部可以没有显示屏幕130，而是通过I/O接口140与外部的显示屏幕进行交互，以使外部的显示屏幕显示交互界面。

在各种实现中，矩形翻转动画生成装置100可以采用各种不同的配置。例如，矩形翻转动画生成装置100可以被实现为个人计算机、膝上型计算机、平板计算机、移动电话、便携式音乐播放器、智能穿戴设备、车载信息娱乐系统、汽车仪表等中的一种或多种。

图3例示了根据本发明一个或多个实施例的矩形翻转动画生成方法的示例性流程图。矩形翻转动画生成方法200示例性地可以在如图2所示的矩形翻转动画生成装置100中实现。例如，矩形翻转动画生成方法200可以以指令的形式(例如应用)存储在计算机可读介质120中，并且由处理器110调用和/或实现。参考图3所示，矩形翻转动画生成方法200包括确定矩形翻转动画的一帧中的投影梯形的如下步骤：

步骤210：获取矩形相对于投影平面的翻转角；

步骤220：计算矩形在该翻转角下的投影比例；

步骤230：根据投影比例确定矩形在投影平面上的投影梯形。

下面主要以矩形11从上到下翻转为例对矩形翻转动画生成方法200展开描述，但可以理解这并非对本发明的限制。

在步骤210，获取矩形11相对于投影平面的翻转角。图4例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的侧视图。参考图4所示，矩形11与投影平面20的法线具有翻转角α。矩形翻转动画包括一帧或多帧图像，每帧图像分别对应一个翻转角α。例如，矩形11从垂直于投影平面20的位置翻转到平行于投影平面20的位置共24帧，且矩形11是等间隔翻转时，第n帧对应的翻转角为度，n＝1，2，3...，24。

在步骤220，计算矩形在该翻转角α下的投影比例。图6例示了根据本发明一个或多个实施例的计算投影比例的示例性流程图。参考图6所示，步骤220可以包括如下步骤：

步骤221：获取虚拟摄像机到投影平面的第一距离；

步骤223：计算在该翻转角下矩形中与翻转轴相对的边与投影平面的第二距离；以及

步骤225：根据第一距离和第二距离计算投影比例。

在步骤221，获取虚拟摄像机30到投影平面20的第一距离dist。在一个或多个实施例中，第一距离dist可以是预设值，也可以是根据一些特定的位置关系计算得到。在一个或多个实施例中，第一距离dist可以通过虚拟摄像机30到显示矩形翻转动画的显示屏幕的宽度方向的视角FOVx和显示屏幕的宽度W计算得到。图7例示了根据本发明一个或多个实施例的虚拟摄像机与显示屏幕的位置关系示意图。参考图7所示，在虚拟摄像机30视角为FOVx，且虚拟摄像机30与显示屏幕40的距离为第一距离dist时，显示屏幕40的宽度W刚好覆盖虚拟摄像机30沿显示屏幕40宽度方向的视野。可以根据虚拟摄像机30的视角FOVx、显示屏幕40的宽度W以及虚拟摄像机30至显示屏幕40的第一距离dist的关系，可以在知道这三者中的任意两者的情况下求出第三者。因此，第一距离dist可以通过下式计算得到：

在一优选的实施例中，虚拟摄像机30的视角FOVx可以为90度。

需要说明的是，在本发明的上下文中，画面10是指投影平面20在显示屏幕40中显示的那一部分；在显示屏幕40显示画面10时，显示屏幕40与投影平面20共面。

在步骤223，计算在翻转角α下矩形11中与翻转轴相对的边与投影平面20的第二距离d。在图1(b)所示的实施例中，翻转轴为边11a，与该翻转轴相对的边为边11c。在图1(c)所示的实施例中，翻转轴为边11b，与该翻转轴相对的边为边11d。在一个或多个实施例中，矩形11的翻转轴11a在投影平面20上，如图4和图5所示。在翻转角α下，矩形11中与翻转轴11a相对的边11c与投影平面20的第二距离d可以通过矩形11中与翻转轴11a相邻的边11b的长度r_h和偏转角α计算得到。在一个或多个实施例中，参考图4所示，第二距离d可以通过下式计算得到：

d＝r_hcosα (2)。

图8例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的侧视图。图9例示了根据本发明一个或多个实施例的矩形、投影平面和虚拟摄像机三者间位置关系的俯视图。在图8和图9所示的实施例中，矩形11的翻转轴11a不在投影平面20上。在翻转角α下，矩形11中与翻转轴11a相对的边11c与投影平面20的第二距离d可以通过如图10所示的方法进行，具体如下：

步骤223a：计算翻转轴11a到投影平面20的第三距离d0；

步骤223b：通过矩形11中与翻转轴11a相邻的边11b的长度r_h和偏转角α计算边11b在投影平面的法线方向上的投影长度d1；以及

步骤223c：对第三距离d0和投影长度d1求和得到第二距离d。

在步骤223b，投影长度d1可以通过下式计算得到：

d1＝r_hcos α (3)。

在步骤225，根据第一距离dist和第二距离d计算投影比例R。在一个或多个实施例中，投影比例R可以是第一距离dist与第一距离dsit和第二距离d之和的比，其公式如下：

在步骤230，根据投影比例R确定矩形11在投影平面20上的投影梯形。图11例示了根据本发明一个或多个实施例的计算投影梯形的示例性流程图。参考图11所示，步骤230可以包括：

步骤231：以翻转轴11a的长度rw为投影梯形11’的长边长度w”；

步骤233：根据翻转轴11a的长度r_w和投影比例R计算投影梯形11’的短边长度w’；

步骤235：根据矩形11中与翻转轴11a相对的第边11c到穿过翻转轴11a的投影平面20的法线的距离h和投影比例R计算投影梯形11’的高h’；

步骤237：根据长边长度w”、短边长度w’和高h’确定等腰梯形作为投影梯形11’。

在步骤233，根据翻转轴11a的长度r_w和投影比例R计算投影梯形11’的短边长度w’。在一个或多个实施例中，短边长度w’可以通过下式计算得到：

在步骤235，根据矩形11中与翻转轴11a相对的边11c到穿过翻转轴11a的投影平面20的法线的距离h和投影比例R计算投影梯形11’的高h’。在一个或多个实施例中，距离h可以通过下式计算得到：

h＝r_h sinα (6)。

在一个或多个实施例中，高h’可以通过下式计算得到：

在步骤237，根据长边长度w”、短边长度w’和高h’确定等腰梯形作为投影梯形11’，如图12所示。

可以理解，生成的翻转动画中的一帧或多帧可以被输出到显示屏幕130进行显示，也可以先被存储于计算机可读介质120中，而后再输出到显示屏幕130进行显示。

需要说明的是，上文虽然主要以矩形11从上到下翻转来进行说明，但可以理解，矩形翻转动画生成方法200同样可以生成矩形11从下向上翻转、从左向右翻转和从右向左翻转的动画。举例来说，当矩形11从下向上翻转时，取矩形的边11c为翻转轴，与翻转轴相对的边就为边11a，翻转轴相邻的边即为11b或11d；当矩形11从右向左翻转时，取矩形的边11d为翻转轴，与翻转轴相对的边就为边11b，翻转轴相邻的边即为11a或11c。

另外需要说明的是，上文中所述的各方法、步骤的顺序是示例性的，并非旨在限制本发明。可以理解，在不脱离本发明的精神和范围的情况下，各方法、步骤的顺序是可以任意调整的。

虽然本发明已以较佳实施例披露如上，但本发明并非限定于此。任何本领域技术人员，在不脱离本发明的精神和范围内所作的各种更动与修改，均应纳入本发明的保护范围内，因此本发明的保护范围应当以权利要求所限定的范围为准。

Claims (10)

1.一种矩形翻转动画生成方法，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，其特征在于，所述方法包括：以连续多帧投影梯形的图像构成所述矩形翻转动画，通过二维图形处理获得投影梯形的图像；其中，确定所述矩形翻转动画的一帧中的投影梯形的如下步骤：

获取所述矩形相对于投影平面的翻转角；

计算所述矩形在所述翻转角下的投影比例；以及

根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形；

其中，计算所述矩形在所述翻转角下的投影比例的步骤包括：

获取虚拟摄像机到所述投影平面的第一距离；

计算在所述翻转角下所述矩形中与所述翻转轴相对的边与所述投影平面的第二距离；以及

根据所述第一距离和所述第二距离计算所述投影比例；

其中，根据所述投影比例计算所述矩形在所述投影平面上的投影梯形的步骤包括：

以所述翻转轴的长度为所述投影梯形的长边长度；

根据所述翻转轴的长度和所述投影比例计算所述投影梯形的短边长度；

根据所述矩形中与所述翻转轴相对的边到穿过所述翻转轴的所述投影平面的法线的距离和所述投影比例计算所述投影梯形的高；以及

根据所述长边长度、所述短边长度和所述高确定等腰梯形作为所述投影梯形。

2.如权利要求1所述的矩形翻转动画生成方法，其特征在于，所述第一距离通过所述虚拟摄像机到显示所述矩形翻转动画的显示屏幕的宽度方向的视角和所述显示屏幕的宽度计算得到。

3.如权利要求2所述的矩形翻转动画生成方法，其特征在于，所述虚拟摄像机到显示所述矩形翻转动画的显示屏幕的宽度方向的视角为90度。

4.如权利要求1所述的矩形翻转动画生成方法，其特征在于，当所述翻转轴在所述投影平面上时，所述第二距离通过所述矩形中与所述翻转轴相邻的边的长度和所述翻转角计算得到。

5.如权利要求1所述的矩形翻转动画生成方法，其特征在于，当所述翻转轴不在所述投影平面上时，所述第二距离通过如下步骤计算：

计算所述翻转轴到所述投影平面的第三距离；

通过所述矩形中与所述翻转轴相邻的边的长度和所述翻转角计算与所述翻转轴相邻的边在所述投影平面的法线方向上的投影长度；以及

对所述第三距离和所述投影长度求和得到所述第二距离。

6.如权利要求1所述的矩形翻转动画生成方法，其特征在于，所述投影比例为所述第一距离与所述第一距离和所述第二距离之和的比。

7.一种矩形翻转动画生成装置，其特征在于，包括：

一个或多个处理器；以及

其上存储有多个指令的计算机可读存储介质，所述多个指令响应于由所述一个或多个处理器执行而促使所述一个或多个处理器生成以连续多帧投影梯形的图像构成的矩形翻转动画，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，其中，确定所述矩形翻转动画的一帧中的投影梯形包括以下的动作：

获取所述矩形相对于投影平面的翻转角；

计算所述矩形在所述翻转角下的投影比例；以及

根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形；

其中，计算所述矩形在所述翻转角下的投影比例的步骤包括：

获取虚拟摄像机到所述投影平面的第一距离；

计算在所述翻转角下所述矩形中与所述翻转轴相对的边与所述投影平面的第二距离；以及

根据所述第一距离和所述第二距离计算所述投影比例；

其中，根据所述投影比例计算所述矩形在所述投影平面上的投影梯形的步骤包括：

以所述翻转轴的长度为所述投影梯形的长边长度；

根据所述翻转轴的长度和所述投影比例计算所述投影梯形的短边长度；

根据所述矩形中与所述翻转轴相对的边到穿过所述翻转轴的所述投影平面的法线的距离和所述投影比例计算所述投影梯形的高；以及

根据所述长边长度、所述短边长度和所述高确定等腰梯形作为所述投影梯形。

8.如权利要求7所述的矩形翻转动画生成装置，其特征在于，所述矩形动画生成装置为个人计算机、膝上型计算机、平板计算机、移动电话、便携式音乐播放器、智能穿戴设备、车载信息娱乐系统和汽车仪表中的一种或多种。

9.如权利要求7所述的矩形翻转动画生成装置，其特征在于，所述一个或多个处理器包括中央处理器和/或二维图形处理器。

10.一种非易失性计算机可读存储介质，其上存储有适于一个或多个处理器执行的多个指令，所述多个指令响应于由所述一个或多个处理器执行而促使所述一个或多个处理器生成以连续多帧投影梯形的图像构成的矩形翻转动画，在所述矩形翻转动画中所述矩形以其任意一边为翻转轴，绕该翻转轴翻转，其中，确定所述矩形翻转动画的一帧中的投影梯形包括以下的动作：

获取所述矩形相对于投影平面的翻转角；

计算所述矩形在所述翻转角下的投影比例；以及

根据所述投影比例确定所述矩形在所述投影平面上的所述投影梯形；

其中，计算所述矩形在所述翻转角下的投影比例的步骤包括：

获取虚拟摄像机到所述投影平面的第一距离；

计算在所述翻转角下所述矩形中与所述翻转轴相对的边与所述投影平面的第二距离；以及

根据所述第一距离和所述第二距离计算所述投影比例；

其中，根据所述投影比例计算所述矩形在所述投影平面上的投影梯形的步骤包括：

以所述翻转轴的长度为所述投影梯形的长边长度；

根据所述翻转轴的长度和所述投影比例计算所述投影梯形的短边长度；

根据所述矩形中与所述翻转轴相对的边到穿过所述翻转轴的所述投影平面的法线的距离和所述投影比例计算所述投影梯形的高；以及

根据所述长边长度、所述短边长度和所述高确定等腰梯形作为所述投影梯形。