Axure RP 9教程:制作简单的跳跃效果

楼主  收藏   举报   帖子创建时间:  2020-06-24 14:22 回复:0 关注量:0

在原型设计中,我们经常需要做一些简单的动画效果。如何实现?本文将从三个方面进行整理,希望对你有所帮助。

在工作中,我们发现在原型设计中,偶尔需要做一些简单的动画效果。毕竟,动态往往比静态更引人注目。就像在电子商务页面中一样,抓取红包的悬浮球通常是动态显示的。所以,让我们今天做一个跳动的动画。

一、实现效果

二、实现原理

过程很简单:球弹起,当它到达指定位置时落下,当它回到原点时继续弹起。

首先[在加载时]增加球的相互作用,并触发球从位置1移动到位置2;

随着第一步的触发,我们增加了互动(当移动到)可以。在这个事件中,有两种情况。情况1:球在位置2,我们希望他回到位置1;情况2:当球在位置1时,我们会让他回到位置2。这样就实现了球的弹跳效果。

三、实现步骤

1.球的原始坐标是(123,110),打开交互式编辑器,添加事件[加载时],添加动作[移动],并设置动作使球从坐标(124,110)移动到(124,100);

2.在球到达坐标(124,100)后,添加一个事件[移动时],并从图示位置添加两种情况;

3.在这种情况下,添加条件:如果Y值=100(因为球在运动过程中只在Y轴上运动,这里的条件只需要满足Y值为100);

4.[[This,y]]不需要手工输入,只需点击fx,然后[插入变量或函数]就会找到可以,如图所示:

5.设定条件后,继续添加动作[移动],将球从位置2移动到位置1;

6.在情况2中,添加条件:如果y值=100。同样,添加动作[移动]将球从位置1移动到位置2;

7.记住设定所有移动动作的动画时间,否则你的球会立即移动,不会有任何效果。

破碎的想法:当你第一次发送一份文件时,试着详细解释这个过程。欢迎大家和你交流。~如果文章中有任何错误,我希望所有伟大的神都会指出来~

打赏