
发布时间:2020-07-17 09: 46: 48
上一章节中,小编利用Hype 4版本,教大家制作交互菜单弹出子菜单的动画效果,在本章节中,小编将继续带来点击交互菜单,母菜单收回子菜单的动画教程,欢迎小伙伴们继续学习。
第一步:点击“元素”按钮,添加两个Button按钮,并分别命名为Button和Button2,如下图1所示。
第二步:鼠标移动Button按钮到主菜单按钮的位置,然后移动Button2按钮在主菜单按钮的正下方,然后在Hype右侧的“元素检查器”中,设置两个按钮的不透明度为0。
第三步:切换时间线为“返回”时间线,然后点击“录制”按钮,移动时间线到00:00:26秒,然后鼠标上移Button2的位置到主菜单按钮的位置,右移Button按钮的位置到主菜单按钮的右侧,具体如下图2所示。
第四步: 点击Button按钮,在Hype右侧的“操作检查器”中,设置“鼠标点按时”,增加一个操作,操作选择“开始时间线”,时间线选择“按下”;然后再添加一个操作,操作选择“开始时间线”,时间线选择“返回”,如下图3。
第五步: 点击Button2按钮,在Hype右侧的“操作检查器”中,设置“鼠标点按时”,增加一个操作,操作选择“开始时间线”,时间线选择“返回”,然后勾选上“倒序播放”,如下图4。
完成以后,所有的动画效果就制作完成了,该动画的原理是:点击主菜单按钮后,实际是点击了Button按钮,触发“按下”时间线的动画效果,弹出子菜单,同时触发“返回”时间线的动画效果,将Button按钮右移,Button2按钮上移到主菜单按钮位置。再次点击主菜单按钮时,实际上点击的是Button2按钮,倒叙触发“返回时间线”的动画效果,将子菜单收回。
小伙伴们跟着小编的教程操作一遍,完成了这一个动画效果,是不是有满满的成就感呢?还有更多有趣好玩的Hype 4教程发布在中文网站上哦,欢迎大家持续关注了解!
作者署名:包纸
展开阅读全文
︾
读者也喜欢这些内容:
实例演示Hype主时间线与新建时间线的关系
时间线是Hype进行动画制作的主要功能区,通过在时间线上添加关键帧、操作等,可制作各种类型的动画效果。...
阅读全文 >
利用Hype制作鼠标移至切换图片的效果(鼠标移至动作)
在《利用Hype制作鼠标移至切换图片的效果(场景设置)》中,我们已经详细讲解了切换按钮的制作,以及图片的排版方式。...
阅读全文 >
Hype 4时间线操作(十) 暂停和继续时间线
在Hype 4交互动效制作软件中,可以通过设置“开始时间线”关键帧操作启动时间线,同样也可以设置“暂停时间线”和“继续时间线”关键帧暂停及继续当前时间线。表现出来的就是对象的运动在启动后,暂停下来,等待一段时间后继续运行,直至终点。...
阅读全文 >
Hype 4多条时间线的轮播图(三) 设置第2至第4张图片
在前面章节中,已经设置好了第1张图片的运动以及时间线操作,接下来讲述真正轮播的三张图片的运动以及时间线操作设置。...
阅读全文 >