按钮小动画效果制作
2017/03/09 15:19 分类: 技术交流 浏览:232
如何制作一个按钮动画效果呢?
准备素材
先用利用PS制作好一枚精致的小按钮图标,然后使用“WEB存储为所有格式”导出该按钮图标的PNG格式(导出格式选择-”png-24”)
接下来,就可以开始打开我们的An (原名:Flash),现在开始制作我们的按钮图标动画了;
1.打开软件,新建一个ActionScript3.0类型的文档
2.背景舞台设置一个深灰色
(可以在界面右侧的属性面板中找到---舞台)
3.使用左侧顶部菜单栏中的“文件”,选择“导入-导入到库”把我们的输出文件给导入到库中(库-可以在整体界面右侧的属性面板旁边选择)
4.接下来,使用快捷键“Ctrl+F8”创建一个新元件-元件类型选择“按钮”
5.在新的元件舞台上,使用我们的按钮元件的时间轴编辑动画“帧”(此时,可以直接从库中把我们的按钮图片拖入元件的舞台之上)
对应的时间轴状态如下:
6.这时候鼠标选择“按下”位置的帧右键弹出选择框,选择“插入关键帧”
得到如下状态的时间轴的“帧”
8.此刻,回到舞台上,选择我们对应该帧的图片,然后最右侧工具栏选择“任意变形工具”
9.使用鼠标将我们这一帧的图片内容等比例缩小一点(按住Shift键缩放)
10.然后,回到我们的主舞台之上(舞台界面左上角位置,点击如图所示的“场景1”),再从库里把我们的“按钮元件”拖拽至主舞台上摆放好
11.最后,只需点击”Ctrl+Entre”就可以预览我们的按钮小图标的点击动画效果了!
自己可以试着把鼠标移到按钮之上点击看效果哦!
赞 0