2010flash_12按钮.ppt

第十二节按钮制作
按钮是元件(符号)的一种,它可以根据按钮可能出现的每一种状态显示不同的图像,并且会响应鼠标动作,执行指定的行为(action)。下面就是一个按钮实例。
Company Logo
实例1 简单按钮
1、新建一电影文件,设置影片属性。
2、创建按钮组件:
(1)执行“插入/新建元件”命令。在弹出的组件属性对话框中,为新按钮输一个名字,比如“按钮1”,选择类型为“按钮”,最后按“确定”按钮。
Company Logo
▲按钮编辑环境
这时的时间轴转变为由四帧组成的按钮编辑模式。我们将要在这里编辑新按钮。按钮有特殊的编辑环境,通过在四帧时间轴上创建关键帧,可以指定不同的按钮状态。
弹起帧:表示鼠标指帧不在按钮上时的状态。
指针经过帧:表示鼠标指帧在按钮上时的状态。
按下帧:表示鼠标单击按钮时的状态
点击帧:定义对鼠标做出反应的区域,这个反应区域在电影中是看不到的。
(2)创建弹起帧状态的按钮图像。
用椭圆工具先画一个黑色无边框的圆。
Company Logo
(3)创建指帧经过帧状态的按钮图像。
单击经过帧,按F6插入一个关键帧,第一帧的图像就出现在舞台上,更改图形的填充色。
(4)创建按下状态的按钮图像。
单击向下帧,按F6插入一个关键帧,更改图形的填充色。
▲提示:运行动画时,点击帧在舞台上是看不到的,但是它可定义对鼠标单击所能够做出反应的按钮区域,也可以不定义点击帧,这时按下状态下的对象就会被作为鼠标的响应区。
Company Logo
(5)按钮制作完成,这时可发现按钮已出现在库中,切换到场景1,就可以直接从库中调用按钮了。
(6)在场景1中,选中按钮元件,单击右键,再快捷菜单中选择“动作”,此时动作面板被打开。
(7)在窗口中输入如下语句。
on (release) {
getURL("", "_blank");
}

注意:英文标点,且一定要有http://
Company Logo
实例2 动态按钮
1、新建影片,背景改为蓝色。
2、新建影片剪辑元件anim。在anim编辑状态下,画一无边圆形,填充为“放射状”渐变,左侧色块为100%黄色,右侧色块为0%白色。
3、在anim编辑状态下,选中所画放射状填充的圆形,将其转换为图形元件“glow”。
4、在anim编辑状态下,分别在第5、9帧处插入关键帧,将第5帧中的圆形放大150%;分别在各个关键帧之间创建动作补间。
5、创建一个按钮元件btn,在btn编辑状态下,在指针经过帧处插入关键帧,将影片剪辑anim拖放到舞台上。
Company Logo
6、在btn编辑状态下,添加新图层,在弹起帧画一蓝色放射状填充(要比剪辑元件anim 小一点),在指针经过帧插入关键帧,将圆形改为一个红色放射状填充,在点击帧插入帧。
7、回到主场景,将btn元件拖到舞台上。
8、测试保存影片。
注意:如果不能浏览到指帧经过状态的动态效果,是因为指帧经过帧中的影片剪辑anim实例尺寸太小,被上方的球体所覆盖,适当放大该实例的尺寸即可。
Company Logo
实例3 聚焦按钮
1、新建影片,背景改为黑色。
2、新建按钮元件normal。在normal编辑状态下,在弹起帧,用椭圆工具先画一个黑色无边框的圆;单击经过帧,按F6插入一个关键帧,更改图形的填充色。
Company Logo
3、创建一个按钮元件special,在special编辑状态下,在指针经过帧插入关键帧(弹起帧空白),在此帧绘制一个无填充色的圆环,选中圆环,在属性面板中设置线条颜色为红色,宽度为10,单击自定按钮,类型为点状线,同时设置圆环的尺寸为200*200。
注意:如果圆环中有两个点发生交叉重叠可以适当调整点状线形的参数,使点均匀分布。
Company Logo