第三章  按钮制作篇
3.1  按钮元件概述
按钮元件是Flash的基本元件之一，它具有多种状态，并且会响应鼠标事件，执行指定的动作，是实现课件交互效果的关键对象。
从外观上，“按钮”可以是任何形式，比如，可能是文字，可能是一幅位图，也可以是矢量图；可以是矩形，也可以是多边形；可以是一根线条，也可以是一个线框；甚至还可以是看不见的“透明按钮”。
按钮有特殊的编辑环境，通过在四个不同状态的帧时间轴上创建关键帧，可以指定不同的按钮状态，如图所示。
改变button按钮的形状
图3.1.1  按钮的四帧编辑环境
【弹起】帧：表示鼠标指针不在按钮上时的状态。
【指针经过】帧：表示鼠标指针在按钮上时的状态。
【按下】帧：表示鼠标单击按钮时的状态。
【点击】帧：定义对鼠标做出反应的区域，这个反应区域在影片播放时是看不到的。
【点击】帧比较特殊，这个关键帧中的图形将决定按钮有效范围。它不应该与前3个帧的内容一样，但这个图形应该大到足够包容前3个帧的内容。
图3.1.2  按钮的帧内容可以随意扩充
根据实际需要，你还可以把按钮做成如上图所示的结构。
从图中可以看到，按钮的3个“状态关键帧”中，可以放置除按钮本身以外的任何Flash对象，其中：【状态音效】图层设置了2种音效；【按钮动画】图层使鼠标不同操作出现不同动画效果，而【按钮底图】中可放置不同的图片。利用这个特点，我们可以把按钮做成有声有、变化无限的效果！
3.2  普通按钮
【实例说明】
按钮是元件（符号）的一种，它可以根据按钮可能出现的每一种状态显示不同的图像，并且会响应鼠标动作，执行指定的行为（action）。本例是一个简单按钮实例，在鼠标未接近按钮时，箭头显示为白；当鼠标移至按钮时，箭头显示为蓝；在按钮上按下鼠标时，箭头显示为黑。
【技术要点】
熟练图形编辑技巧，了解一般按钮的制作过程，理解按钮编辑器的时间轴上4个帧各自的意义和作用。
【制作步骤】
1、新建一个Flas档，设置文档属性。
2、创建按钮元件：
(1)执行“插入/新建元件”命令（或者按Ctrl+F8快捷键）。在弹出的元件属性对话框中，为新按钮输一个名字，比如“普通按钮”，选择类型为“按钮”，最后按“确定”按钮。
(2)这时的时间轴转变为由四帧组成的按钮编辑模式，如图3.2.1所示。我们将要在这里编辑新按钮。
图3.2.1 按钮的编辑模式
(3)创建“弹起”帧的按钮图像。用椭圆工具先画一个黑无边框的圆，然后用钢笔工具绘制出白的箭头。把它们叠放在一起。
            向上            经过            向下              执行
图3.2.2 按钮四桢的效果
(4)创建“指针经过”帧的按钮图像。单击指针经过桢，按F6插入一个关键桢，第一桢的图像就出现在舞台上，分别更改图形的填充。如图3.2.2所示
(5)创建“按下”帧的按钮图像。单击按下桢，按F6插入一个关键桢，分别更改图形的填充。如图3.2.2所示
(6)创建“点击”帧的鼠标效应区域。单击点击桢，按F7插入一个空白关键桢，然后用绘图工具制作鼠标响应区域。如图3.2.2所示
【提示】
提示：运行动画时，点击桢在舞台上是看不到的，但是它可定义对鼠标单击所能够做出反应的按钮区域，一般情况下这一帧可以省略掉，这时“按下”状态下的对象就会被作为鼠标的响应区。
（7）这四帧全部设置好以后。单击时间轴窗口左上角的按钮，回到主场景中。按Ctrl+L快捷键打开库窗口，从其预览窗口中把刚才做好的按钮拖到编辑区中。
3、按Ctrl+Enter快捷键，预览效果。
3.3  文字按钮
【实例说明】
本例是一个简单文字按钮实例，在鼠标未接近按钮时，文字显示为红；当鼠标移至按钮
时，文字显示为绿；在按钮上按下鼠标时，文字显示为蓝。
【技术要点】
熟练图形编辑技巧，了解一般文字按钮的制作过程，理解按钮编辑器的时间轴上4个帧各自的意义和作用。
【制作步骤】
1、新建一个Flas档，设置文档属性。
2、创建按钮元件：
（1）使用“插入/新建元件”命令（或者按Ctrl+F8快捷键），在弹出的“创建新元件”对话框中，将元件命名为“开始按钮”，行为中选择“按钮”，然后单击“确定”按钮，如图3.3.1所示：
图3.3.1  新建按钮元件的效果
（2）创建“开始按钮”元件的时间轴和舞台如图3.3.2所示：
图3.3.2  按钮的编辑模式
（3）选用工具箱中的“文本工具”，展开属性面板将文本的字体属性设置为“宋体”，字号为“30”，字体颜为“红”，并单击“居中”按钮，如图3.3.3，然后在元件舞台中拖曳出一个文本框。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。