Axure官方正版
快速原型设计工具

Axure8实例:支付宝咻一咻

3

其实,我觉得这真是个卵用没有的东西,但是既然有人问了,那我就做一个,正好说下Axure8的优点。

这个需要用Axure8做,为什么呢?因为Axure8可以多个动作同时进行。

在Axure7里,如果想在向上移动的同时隐藏,是做不到的,只能是先移动到位了再隐藏。

而Axure8就可以!请大家认真观察支付宝咻一咻,它的动画是一个圆圈一边放大一边变透明。

那么,如何实现呢?

QQ截图20160331002906

需要弄个动态面板,2个状态,状态1是点击前的按钮样式,状态2是点击后的按钮样式。

然后再弄2个圆圈,放在按钮下面。

因为圆圈的动画是循环的,所以我们需要想一个循环的手段,本次我们使用“显示时”来做循环,就是在圆圈完全透明后,隐藏圆圈,再显示出来。再次显示时,就会触发“显示时”这个交互,实现循环。

QQ截图20160331003114

1、2两个圆圈都是一样的,所以1做完了之后直接复制粘贴到2里就可以了,那么不同的是什么呢?是它们会一先一后的播放这个动画。

这时候,让我们回到按钮的State1上:

QQ截图20160331003716

点击按钮的State1后,首先要将按钮变为State2,既按下后的状态。

然后要显示圆圈1,等待1000毫秒后再显示圆圈2即可。

在这里做显示1、2的时,就会触发圆圈1、2的显示时交互,然后进入无尽の循环中。

最后的最后我想说,Axure缘分问答QQ群招收动脑子、有学习态度的成员,群号是542524521,欢迎加入~

转载请注明出处:Axure中文网 » Axure8实例:支付宝咻一咻

评论 8

评论前必须登录!

 

  1. #7

    效果不错,会坚持学习

    1个月前 (03-29)
  2. #6

    可以了 谢谢

    yyy1个月前 (03-25)
  3. #5

    this是哪个 没有描述清楚

    叶莉智9个月前 (07-21)
  4. #4

    不错不错,就是放大后有锯齿,是不是先缩小再放大呢

    水谈10个月前 (07-16)
  5. #3

    作者好像忘说了,一开始要把2个椭圆都隐藏才行,缺少这一步的话是不行的

    12个月前 (05-05)
  6. #2

    羞~羞羞~~

    笑脸柠檬1年前 (2016-04-05)
  7. #1

    羞羞!羞!

    果奔1年前 (2016-03-31)

购买Axure RP正版授权 终身可用

购买专业版购买团队版