建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

当前位置: 建站学 > 图像设计 > Flash教程 >

如何制作flash按狃(2)

时间:2011-03-11 22:39来源: 作者: 点击:
图2.1.41 添加stopa(); 然后新建立一个按钮元件,按照我们刚才做的方法制作出两个按钮,分别是play和relplay。在时间轴中新建一图层,把play按钮从控制拖动到第1帧的合适位置,replay拖动到第30帧的合适位置。分别

  图2.1.41 添加“stopa();”

  然后新建立一个按钮元件,按照我们刚才做的方法制作出两个按钮,分别是“play”和“relplay”。在时间轴中新建一图层,把“play”按钮从控制拖动到第1帧的合适位置,“replay”拖动到第30帧的合适位置。分别单击两个按钮,打开动作面板,在“play”和“replay”按钮上面加如控制命令:

  “play”按钮上面的命令:

  on(release){

  play();

  }

  如图所示。

 

Flash教程:全面掌握按钮相关内容

  图2.1.42 “play”按钮的ActionScript

  “replay”按钮上面的命令,
  on (release) {
  gotoAndPlay(1);
  }
  如图2.1.43所示。

 

Flash教程:全面掌握按钮相关内容

  图2.1.43 “replay”按钮的ActionScript

  请参考源文件点击这里下载源文件

  这是我们第一次接触 Flash MX 2004的ActionScript,本书第三部分中会作详细地介绍。之所以在此节中介绍ActionScript,一是按钮与ActionScript的联系非常密切 ;二是给大家一个初步的印象。

  问题2:何制作隐形按钮?隐形按钮的作用是什么?

  解决思路

  隐形按钮是按钮功能的引申,一些超乎想象的效果就是通过隐形按钮来完成的。我们从上一个问题中知道了,按钮的第4帧“点击”帧里面的内容在舞台中是看不到的,我们就用这个特点来制作简单的隐形按钮。

  具体步骤

  1、运行Flash MX 2004 ,文档属性默认。
  2、新建一个元件,名称为“button”,类型为按钮。
  3、进入按钮元件编辑区,在第4帧里面我们利用矩形工具绘制一个矩形,颜色随意。
  4、返回场景1,【文件】|【导入】|【导入到舞台】命令,导入一幅图片,调整其在舞台的位置。
  5、在时间轴上新建一个图层,命名为按钮层,把刚刚制作的按钮从“库”中拖动到舞台中的合适位置。如图2.1.44所示。

Flash教程:全面掌握按钮相关内容

 

  图2.1.44 设置隐形按钮

  6、这个按钮在舞台中显现的是透明的绿颜色。因为按钮在第4帧“点击”帧里面的内容是看不到的,Flash 考虑到需要编辑的方便,统一设置了相同的绿颜色,而无论原来的“点击”帧里面的颜色是什么。
  7、发布测试,可以看到当鼠标移动到隐形按钮区域就会变成小手状,我们的隐形按钮制作成功,保存。

  请参考源文件点击这里下载源文件

  8、利用按钮与Flash的ActionScript我们可以制作出非常优秀的效果,这方面的内容我们将在第三部分ActionScript中向大家详细介绍。
  注 意 ——在制作隐形按钮的时候,不要在按钮编辑区的第1帧做按钮,因为第一帧在场景中是可见的,达不到我们制作的效果。我们直接在第4帧中插入一个空白关键帧,然后在编辑区中绘制反映区的大小就可以
  提 示 ——按钮编辑区中的第4帧“点击”帧在场景中是不可见的,编辑的时候,在主场景中显示的是绿色半透明状态。
  技 巧 ——在舞台中的隐形按钮与其他按钮没有什么区别,我们都可以利用工具进行编辑。
  试一试 ——在上一个问题解释中我们向大家介绍了另外一种制作隐形按钮的方法,朋友们不妨利用第二种制作方法试一试,看看有没有区别?
   分 析——按钮的作用是触发行为,隐形按钮可以达到欣赏者在非刻意的情况下触发事件,达到互动效果。
  特别提示
  在本例的源文件中,没有设置按钮的触发事件,因为触发事件是要用Flash的ActionScript控制的,我们会在第三部分中向大家详细介绍。

  特别说明

  按钮的重要作用我们已经在上一个问题中向大家强调了,隐形按钮的是按钮中的重中之重。掌握了此项技术,我们就可以利用隐形按钮的特点,发挥其独到的作用,制作出许多交互性动作。
  相关问题
  ◎如何使用公用库中的按钮?
  在Flash MX 2004中的公用库中向我们提供了许多制作精美的按钮范例,我们可以直接使用。单击【窗口】|【其他面板】|【公用库】|【按钮】命令,打开【库——按钮】面板。如图2.1.45所示。

 

Flash教程:全面掌握按钮相关内容

  图2.1.45 打开“库——按钮”面板

可以看到有许多已经制作完成的按钮,分门归类地保存在按钮公用库里面。我们可以直接拖放到按钮编辑区里面使用。在按钮公用库里面的按钮大多是动态效果的,就是按钮的四个帧里面都有动作。这方面的知识我们在下一个问题中向大家介绍。
  问题3:何制作发声按钮?如何在按钮中嵌套影片剪辑?

  解决思路

  从上两个问题的解答中,我们知道了按钮中的四个帧与其他元件是不相同的,但是在操作和理解上却没有大的差别。在第一部分中我们详细地介绍了按钮编辑区的四个帧的作用,我们就可以利用这些帧来解决问题。

  具体步骤

  1、运行Flash MX 2004,文档属性默认。
  2、新建元件,命名为“button”,类型为按钮。
  3、进入“button”按钮编辑区,我们可以看到按钮编辑区的四个帧。
  4、单击第1帧,在编辑区中利用椭圆形工具绘制一个红色的椭圆。
  5、在时间轴上新建一个图层,键入“button”静态文本。并同时延长第一层和第二层的帧数。如图2.1.46所示。

 

  图2.1.46 创建按钮

  6、再新建图层3,命名为音乐层。
  7、因为我们想要制作的效果是,当鼠标经过按钮的时候,按钮发出声音,所以我们就在按钮时间轴的第2帧“指针经过”中插入一个空白关键帧。
  8、单击【文件】|【导入】|【导入到库】命令,导入一段我们选择的音乐效果。
  9、导入的音乐会保存在我们的库面板中。如图2.1.47所示。

 

Flash教程:全面掌握按钮相关内容

  图2.1.47 库中的声音文件

  10、把这个声音文件拖动到音乐层的“指针经过”帧对应的舞台中。
  11、在音乐层里面的“指针经过”帧里面会有一个音乐的波形,这说明我们已经把音乐加到了这个帧里面了。如图2.1.48所示。

Flash教程:全面掌握按钮相关内容

 

  图2.1.48 时间轴上面的声音文件

  12、返回场景1,从库面板中把这个按钮拖放到舞台中。
  13、发布测试。当鼠标经过按钮的时候,按钮发出了声音,我们制作的发生按钮成功,保存。

  请参考源文件点击这里下载源文件

  14、如何在按钮中嵌套影片剪辑呢?其实与插入音乐都是同样的道理。
  15、按照上面的步骤制作一个常规按钮。
  16、新建一个影片剪辑,在这个影片剪辑里面制作一小段简单的旋转动画效果。
  17、双击进入按钮编辑区,新建一个图层。
  18、在这个图层的第2帧“指针经过”插入一个空白关键帧。
  19、把“库”面板中的影片剪辑拖动到这个帧对应的舞台里面。如图2.1.49所示。

Flash教程:全面掌握按钮相关内容

 

  图2.1.49 插入影片剪辑

  20、返回到场景1,发布测试。当鼠标移动到按钮的时候,就会播放影片剪辑。保存。

  请参考源文件点击这里下载源文件

  注 意 ——◎导入mp3格式音乐的时候,有的时候flash会提示导入不成功。这个问题是非常普遍的,我们将在后面的Flash mv章节中向大家详细介绍解决方法
   ◎制作发音按钮所用的音效,应该选择比较短的声音文件。
  提 示 ——制作发音按钮的时候,尽量把音效,文字放在不同的层里面,这样便于我们编辑修改。
  技 巧 ——除了在“指针经过”帧里面放置音效以外,我们还可以在其他帧里面放置音效,制作方法与上例相同。
  试一试 ——朋友们试一试制作一个发音按钮。
   分 析——在制作此例过程中,把音效、文字、矩形分别放置在不同的图层里面。原因是当我们修改它的时候非常方便。因为无论在按钮编辑区用多少层,在主场景中我们只导入了一个按钮元件,对动画作品的整体没有改变。

  特别说明

  我这一节中我们学习了制作声音按钮,以及嵌套影片剪辑的方法。还接触了一个重要的知识就是导入外部声音文件。导入外部声音文件与导入图片的方法是相同的。至于在导入中出现的错误我们将在以后的学习中详细讲述。

  相关问题
  如何制作可以变化颜色的按钮?
  首先要考虑按钮的四个帧是四个动作,我们只要把各帧里面的按钮颜色改变就可以达到效果。新建一个按钮元件,在第1帧利用矩形工具绘制一个蓝色的矩形,在第2帧插入关键帧,利用填充工具把举行的颜色转换为红色,
  按照此方法在第三帧填入绿色,如图2.1.50所示。

Flash教程:全面掌握按钮相关内容

 

  图2.1.50 改变各个帧的颜色

  然后返回到场景1进行测试。我们会看到按钮在场景中呈现的是蓝色,当鼠标放到按钮上的时候是红色,当鼠标按下的时候是绿色,从而通过三个镇的不同颜色达到了按钮动作的颜色转变。因为第4帧是反映区,在舞台中是看不到的,所以无需再此帧中设置。

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片