iH5初级教程：动画必备-H5+时间轴动画.docx

《iH5初级教程：动画必备-H5+时间轴动画.docx》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、iH5初级教程：动画必备，H5+时间轴动画第一种：放缩。1、选中舞台，点击工具栏页面工具，添加一个页面。2、选中页面，点击工具栏时间轴工具，添加时间轴。3、选中时间轴，点击工具栏图片工具，在舞台上拉出一个框，添加图片，4、选中图片，点击工具栏轨迹工具，添加轨迹。5、把图片缩小，放在舞台左上角，点ADD添加关键帧记录图片的状态。6、在时间轴窗口第一个框输入2点回车，放大图片，点ADD添加关键帧。7、时间轴属性面板总时长3秒，自动播放循环播放为YES。预览时，图片会从小变大，最后会有一秒的停顿。第二种：旋转

2、。1、选中舞台，点击工具栏页面工具，添加一个页面。2、选中页面，点击工具栏滑动时间轴工具，在舞台上画出一个区域，作为滑动区域。3、选中滑动时间轴，点击工具栏图片工具，在舞台上画一个区域，添加图片。1、选中图片，点击工具栏轨迹工具，添加轨迹，2、在轨迹最开始的地方点ADD添加关键帧，3、在时间轴窗口第一个框输入2点回车，图片属性面板旋转360度，点ADD添加关键帧。4、滑动时间轴属性面板，总时长设为2，滑动放大比例0.2，滑动放大比例越小越稳定，越大动画越快，滑动方向为上，自动跳转控制点为NO，这样就可以

3、手动操控旋转角度，如果自动跳转控制点为YES，滑动一下，就会自动跳转到下一个关键帧。预览时，向上滑动，图片旋转一圈，向下滑动，滑动时间轴反向播放。第三种：拟合轨迹。1、选中舞台，添加图片。选中图片，点击工具栏动效工具，添加动效。动效属性面板时长为5，动效类型旋转，开始前隐藏为NO。2、选中舞台，添加页面，选中页面，点击工具栏时间轴工具，添加时间轴，总时长5，把图片剪切黏贴到时间轴下，作为时间轴的子对象。3、选中图片，点击工具栏轨迹工具，添加轨迹，点ADD添加第一个关键帧，在时间轴窗口的第一个框输入5，点

4、回车，移动图片位置，再点ADD添加关键帧。预览时，图片会一边移动一边旋转。知识点：放缩：使用时间轴的两个关键帧控制图片放大缩小。旋转：使用滑动时间轴的两个关键帧控制图片旋转360度。向上滑动，图片选择。拟合轨迹：时间轴下添加素材，素材下添加旋转动效与控制图片移动的轨迹。TIPS:1、先点击工具栏上的时间轴工具添加时间轴，选中时间轴，点击图片工具添加素材，选中素材，点击工具工具添加轨迹，点击时间轴窗口上的ADD添加关键帧。2、如果要修改关键帧里记录的素材的属性，必须选中关键帧为橙色，再移动素材的位置或修改

5、大小透明度等。3、在时间轴窗口的第一个框内填入数字1，点回车，则时间轴窗口里的控制关键帧位置的小方块就自动到达1秒的位置，点击ADD添加关键帧，关键帧处于1秒的位置。如果需要准确调整关键帧的位置，可以在第二个框内填入数字，例如2，则关键帧会移动到2秒处。