CN106775316B - flash图片编辑器中浮动面板跟随鼠标缓动的方法 - Google Patents

Abstract

本发明涉及flash技术。本发明是要解决目前在flash图片编辑器中，若鼠标选择某元件后，浮动面板并不会跟随鼠标进行缓动的问题，提供了一种flash图片编辑器中浮动面板跟随鼠标缓动的方法，其技术方案可概括为：首先鼠标选中flash图片编辑器中的元件，系统记录鼠标、元件及浮动面板位置，然后鼠标在下一时刻移动至另一位置，系统记录该鼠标位置，计算出该元件及浮动面板应处于的位置，系统再分别确定元件及浮动面板的运动路径及运动速率，根据确定的元件及浮动面板的运动路径及运动速率令元件及浮动面板进行动画跟随。本发明的有益效果是，提升用户体验，适用于flash图片编辑器。

Description

flash图片编辑器中浮动面板跟随鼠标缓动的方法

技术领域

本发明涉及flash技术，特别涉及flash中鼠标缓动跟随技术。

背景技术

随着计算机硬件性能的不断提高，在互联网尤其是移动互联的不断发展，用户体验和交互成为产品设计中的关键点。好的交互和设计，能大大的改善用户体验，可以提高软件的品质、改善用户的体验，甚至直接影响软件的好坏。而缓动技术是一种用户体验较好的交互方式，其一般包括透明度的缓动(例如某图像的淡入淡出)、位移缓动、属性缓动、滤镜缓动及动画缓动等。目前在flash图片编辑器中，若鼠标选择某元件后，浮动面板并不会跟随鼠标进行缓动。

发明内容

本发明的目的是要解决目前在flash图片编辑器中，若鼠标选择某元件后，浮动面板并不会跟随鼠标进行缓动的问题，提供了一种flash图片编辑器中浮动面板跟随鼠标缓动的方法。

本发明解决其技术问题，采用的技术方案是，flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，包括以下步骤：

步骤1、鼠标选中flash图片编辑器中的元件；

步骤2、系统记录鼠标、该元件和浮动面板的当前位置，记为鼠标位置一、元件位置一及浮动面板位置一；

步骤3、鼠标在下一时刻移动至另一位置，系统记录该当前位置，记为鼠标位置二，通过根据鼠标位置二计算出该元件应处于的元件位置二及浮动面板应处于的浮动面板位置二；

步骤4、系统根据元件位置一、元件位置二、浮动面板位置一及浮动面板位置二分别确定元件及浮动面板的运动路径及运动速率，根据确定的元件及浮动面板的运动路径及运动速率令元件及浮动面板进行动画跟随。

具体的，步骤3中，所述下一时刻是指下一帧。

进一步的，步骤3中，若计算出的浮动面板应处于的浮动面板位置二上放置浮动面板后会超出画布，则调整该浮动面板位置二至当放置浮动面板后不会超出画布的位置。

具体的，步骤3中，若计算出的浮动面板应处于的浮动面板位置二上放置浮动面板后会超出画布，则重新绘制浮动面板令其处于浮动面板位置二时不会超出画布。

再进一步的，所述重新绘制浮动面板是指对浮动面板的长宽进行变化调整；

步骤4中，在浮动面板进行动画跟随时，根据浮动面板的长宽变化计算变化速率，根据该变化速率进行浮动面板的长宽变化，令其在动画跟随完成时变化完成。

具体的，所述重新绘制浮动面板是指将超出画布的部分删除，并在未超出画布的部分的基础上增加一部分与所删除的部分面积相同的浮动面板，且将超出画布的部分上的元件移动至增加的那一部分；

步骤4中，在浮动面板进行动画跟随时，根据原浮动面板及重新绘制后的浮动面板计算出变化速率，根据该变化速率进行浮动面板的变化，令其在动画跟随完成时变化完成，且同时根据超出画布的部分上的元件的原位置及移动后的位置计算这些元件的运动轨迹及运动速率，根据该运动轨迹及运动速率进行这些元件的移动，令其在动画跟随完成时移动完成。

本发明的有益效果是，在本发明方案中，通过上述flash图片编辑器中浮动面板跟随鼠标缓动的方法，可在flash图片编辑器中实现鼠标选择某元件后，浮动面板及元件跟随鼠标进行缓动的目的，提升用户体验。

具体实施方式

下面结合实施例，详细描述本发明的技术方案。

本发明所述flash图片编辑器中浮动面板跟随鼠标缓动的方法为：首先鼠标选中flash图片编辑器中的元件，系统记录鼠标、该元件和浮动面板的当前位置，记为鼠标位置一、元件位置一及浮动面板位置一，然后鼠标在下一时刻移动至另一位置，系统记录该当前位置，记为鼠标位置二，通过根据鼠标位置二计算出该元件应处于的元件位置二及浮动面板应处于的浮动面板位置二，系统再根据元件位置一、元件位置二、浮动面板位置一及浮动面板位置二分别确定元件及浮动面板的运动路径及运动速率，根据确定的元件及浮动面板的运动路径及运动速率令元件及浮动面板进行动画跟随。

实施例

本发明实施例的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其包括以下步骤：

步骤1、鼠标选中flash图片编辑器中的元件。

步骤2、系统记录鼠标、该元件和浮动面板的当前位置，记为鼠标位置一、元件位置一及浮动面板位置一。

步骤3、鼠标在下一时刻移动至另一位置，系统记录该当前位置，记为鼠标位置二，通过根据鼠标位置二计算出该元件应处于的元件位置二及浮动面板应处于的浮动面板位置二。

本例中，由于flash本身就是一个动画软件，因此其具有帧的概念，因此，这里的下一时刻可以是指下一帧。

本步骤中，若计算出的浮动面板应处于的浮动面板位置二上放置浮动面板后会超出画布，则可以调整该浮动面板位置二至当放置浮动面板后不会超出画布的位置，也可以重新绘制浮动面板令其处于浮动面板位置二时不会超出画布。而重新绘制浮动面板可以是指对浮动面板的长宽进行变化调整，也可以为将超出画布的部分删除，并在未超出画布的部分的基础上增加一部分与所删除的部分面积相同的浮动面板，且将超出画布的部分上的元件移动至增加的那一部分。

步骤4、系统根据元件位置一、元件位置二、浮动面板位置一及浮动面板位置二分别确定元件及浮动面板的运动路径及运动速率，根据确定的元件及浮动面板的运动路径及运动速率令元件及浮动面板进行动画跟随。

若之前重新绘制了浮动面板，且重新绘制浮动面板是对浮动面板的长宽进行变化调整时，则本步骤中，在浮动面板进行动画跟随时，根据浮动面板的长宽变化计算变化速率，根据该变化速率进行浮动面板的长宽变化，令其在动画跟随完成时变化完成。

若之前重新绘制了浮动面板，且重新绘制浮动面板是对浮动面板的长宽进行变化调整，也可以为将超出画布的部分删除，并在未超出画布的部分的基础上增加一部分与所删除的部分面积相同的浮动面板，且将超出画布的部分上的元件移动至增加的那一部分时，则本步骤中，在浮动面板进行动画跟随时，根据原浮动面板及重新绘制后的浮动面板计算出变化速率，根据该变化速率进行浮动面板的变化，令其在动画跟随完成时变化完成，且同时根据超出画布的部分上的元件的原位置及移动后的位置计算这些元件的运动轨迹及运动速率，根据该运动轨迹及运动速率进行这些元件的移动，令其在动画跟随完成时移动完成。

Claims (6)

1.flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，包括以下步骤：

步骤1、鼠标选中flash图片编辑器中的元件；

步骤2、系统记录鼠标、该元件和浮动面板的当前位置，记为鼠标位置一、元件位置一及浮动面板位置一；

步骤3、鼠标在下一时刻移动至另一位置，系统记录该当前位置，记为鼠标位置二，通过根据鼠标位置二计算出该元件应处于的元件位置二及浮动面板应处于的浮动面板位置二；

步骤4、系统根据元件位置一、元件位置二、浮动面板位置一及浮动面板位置二分别确定元件及浮动面板的运动路径及运动速率，根据确定的元件及浮动面板的运动路径及运动速率令元件及浮动面板进行动画跟随。

2.如权利要求1所述的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，步骤3中，所述下一时刻是指下一帧。

3.如权利要求1所述的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，步骤3中，若计算出的浮动面板应处于的浮动面板位置二上放置浮动面板后会超出画布，则调整该浮动面板位置二至当放置浮动面板后不会超出画布的位置。

4.如权利要求1所述的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，步骤3中，若计算出的浮动面板应处于的浮动面板位置二上放置浮动面板后会超出画布，则重新绘制浮动面板令其处于浮动面板位置二时不会超出画布。

5.如权利要求4所述的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，所述重新绘制浮动面板是指对浮动面板的长宽进行变化调整；

步骤4中，在浮动面板进行动画跟随时，根据浮动面板的长宽变化计算变化速率，根据该变化速率进行浮动面板的长宽变化，令其在动画跟随完成时变化完成。

6.如权利要求4所述的flash图片编辑器中浮动面板跟随鼠标缓动的方法，其特征在于，所述重新绘制浮动面板是指将超出画布的部分删除，并在未超出画布的部分的基础上增加一部分与所删除的部分面积相同的浮动面板，且将超出画布的部分上的元件移动至增加的那一部分；

步骤4中，在浮动面板进行动画跟随时，根据原浮动面板及重新绘制后的浮动面板计算出变化速率，根据该变化速率进行浮动面板的变化，令其在动画跟随完成时变化完成，且同时根据超出画布的部分上的元件的原位置及移动后的位置计算这些元件的运动轨迹及运动速率，根据该运动轨迹及运动速率进行这些元件的移动，令其在动画跟随完成时移动完成。