Hype

Hype中文官网 > 新手入门 > Hype 4时间线操作 — 设置触发关键帧

Hype 4时间线操作 — 设置触发关键帧

发布时间:2021/04/08

一般情况下,设计的动画会有多个场景,而每个场景也会有多个对象和时间线。但动画的启动只能在一个场景的主时间线上进行,其他的场景、对象和时间线需要在主时间线上的某个时间点触发才能启动。

例如图1中,当场景1的矩形水平移出画布右侧后,马上在场景2中出现,并水平移动到画布中心处。

场景切换的简单动画
图1:场景切换的简单动画

Hype 4交互动效制作软件中,把在时间线上的某个时间点设定一个关键帧,作为触发某个行为的操作,称之为时间线操作。

一、设置触发关键帧

在时间线面板上,把时间指示器移动到指定发生某个行为的时间点,点击“时间线操作”右侧的“+”按钮,就会在时间指示器与“时间线操作”所在行的交汇处添加了一个菱形关键帧。

设置触发关键帧
图2:设置触发关键帧

二、给触发关键帧添加操作

在设置了触发关键帧后,在该关键帧的下方会弹出一个“Timeline Action”面板,可以在面板上的“操作”选项中选择该关键帧的触发操作。

例如图3中,在场景1矩形动画线段的终点设置了触发关键帧后,在“操作”选项中选择“跳到场景”,在“场景”中选择“场景2”,那么矩形就象是从场景1运动到场景2。

给触发关键帧添加操作
图3:给触发关键帧添加操作

三、添加和移除操作

一个触发关键帧,可以同时具有多个操作。在“Timeline Action”面板上,点击“+”按钮,可以给该关键帧设置多个触发操作。在“操作”选项框的底部选择“移除”,可以删除该“操作”。

设置多个操作和删除操作
图4:设置多个操作和删除操作

四、触发操作的种类

“操作”选项中默认的操作为“无”,小编把“操作”下拉选项分为三大类:触发场景外的行为、播放或停止声音以及对时间线进行操作。

1、触发场景外的行为:跳到场景、运行JavaScript、触发自定行为、前往URL以及编写电子邮件;

2、播放或停止声音:播放声音和停止声音;

3、对时间线进行操作:开始时间线、暂停时间线、继续时间线和前往时间线中的时间。

触发操作的种类
图5:触发操作的种类

五、总结

时间线操作是Hype 4动画制作中非常重要的一个操作,动画中的场景切换、多个对象的联动等等都需要时间线的操作来实现。接下来小编会就每种触发操作进行详细的讲解,敬请期待。

作者:东佛

标签:时间线操作触发操作触发关键帧

读者也访问过这里:
Hype中文版
创建漂亮的HTML5网页内容
立即购买
QQ 群
官方交流群:1046763737 立即加群
kefu@makeding.com
热门文章
H5制作软件Hype导出功能详解
Hype是一款Mac端网页制作工具,它可以通过时间线录制功能制作各种各样的网页炫酷动画效果,同时也支持使用物理引擎制作动画。当然,它的强大不仅仅体现于动画制作方面,它的导出功能同样也是功能齐全,下面小编就通过使用Hype 4版本,为大家详细介绍下这款H5制作软件的导出功能。
2020-06-05
Hype软件持久符号的应用
Hype是一款支持无代码创作炫酷网页的Mac端应用软件,它支持各种动画、元素。其中有一个强大的符号功能,该功能分为基本符号和持久符号两种,本文中,小编将使用Hype 4版本,为大家演示和讲解Hype中的持久符号。
2020-06-04
基础教程:Hype 4软件界面介绍
Hype是一款基于MacOS系统的交互动效制作软件,延续了苹果软件的简洁风格,与Keynote软件的界面基本一致。
2020-07-23
UI动效设计工具Hype的响应式布局及设置
响应式布局可以使用户的网页在各种尺寸的屏幕上都能够较好地兼容,不会因为屏幕尺寸大小变化导致网页拉伸变形。Hype就支持这种响应式布局,它允许设计者为单个场景创建多个布局,当用户在浏览器中显示页面时,Hype将根据设备的当前宽度动态加载合适的布局。
2020-05-21
使用Hype进行动画制作的入门介绍
在一个网页中,如果多了一些动态元素的呈现,会使页面看起来更显得高大上一些。而Hype使用功能强大的动画系统,利用时间线录制功能,使制作者制作动画变得轻而易举。
2020-05-21
基础教程:Hype 4入门基础
Hype是一款在MacOS系统下无代码的交互动效制作软件,是一个创作网页的技术平台。通过这个技术平台创作出来的内容,在后台会自动生成代码,可以直接在网上通过浏览器、移动设备等浏览使用。
2020-07-20