flash导航图标制作

炫丽导航图标制作教程先看下最后效果图： 步骤： 1、打开flash，点击菜单栏中的“插入”——“新建元件”（快捷键Ctrl F8），将元件命名为btn1，文件类型为“影片剪辑”； 2、选择“矩形工具”，将线条颜色设为#CCCCCC，将填充颜色设为#000000，将笔触大小设为2，然后绘制图形，如 3、选中圆角方形的轮廓，再在菜单栏中选取“修改”——“形状”——“将线条转换成填充”；4、用选用工具将斜角矩形的下边一部分选中如图2，并将其删除如图3，最后将该层锁定； 进行粘贴，并将图层1 锁定； 6、新建一个图层，命名为“发光1”，选择“椭圆形工具”，将填充色调为#AF00AF，将轮廓色调为无，绘制一个椭 圆，然后将其转化成电影剪辑，命名为light1，选中该电影剪辑，给该剧集剪辑添加一个发光滤镜，将模糊X、模糊 7、将里面的元件再复制粘贴在“发光1”图层，然后放到合适的位置，如图6所示： 9、新建一个图层，命名为“发光2”，选择“椭圆工具”，将填充色调为#DB1299，将轮廓色调为无，绘制一个椭圆，并将其转化为影片剪辑，添加发光效果（发光颜色为#DB1299），设置参数如图9 所示，效果如图10 所示； 图1010、再新建一个图层，命名为“发光3”，将里面的电影剪辑再复制至该层，然后根据图11 放置； 图11 11、将图层“发光2”、“发光3”拖入到遮罩层“遮罩1”内，如图11； 图11 12、将所有图层的眼睛关闭，再将图层 的脸部打开，将白色部分复制，然后新建一个图层，命名为“up”，按住Ctrl V，用选用工具选中该该图形的下半部分，如图12所示；然后按住Ctrl 将下半部分剪切掉图12 13、新建一个图层，命名为“down”，然后按下快捷键Ctrl V，将方法12剪切的个别粘贴至该层。

14、将图层up 里面的图形形状改为#40076B，将图层down 里面的图形的形状改为#5C1DB8，分别将他们转化成影 片剪辑； 15、将图层 里的图形转换为电影剪辑，并命名为“btnMc”，再讲实例名命名为“btnMc”。最后将所有图层按图13 所示的排序摆放； 图13 16、将图层“发光2”、“发光3”、“up”、“down”的第一帧拖曳到第六帧flash课件模板制作系列教程之按钮导航(上)，分别在图层“发光2”、“down”的第20 F6flash课件模板制作系列教程之按钮导航(上)，在图层“发光3”、“up”的第 24 F6，然后将该四个图层的第六帧里面的电影剪辑的alpha 值设定为 0，将图层“up”的第 24 帧上的电影剪辑的透明度设为 90，将图层“down”的第 20 帧上的电影剪辑的 透明度设为50，再给他们添加补间动画，最后将所有图层的帧延长至40 帧处，如图14 所示； 图14 17、新建一个图层，并命名为“label”，在第一帧添加一个标签，命名为“out”，在第六帧添加一个空白关键帧， 并添加一个标签，命名为“over”，如图15 所示； 图15 18、最后新建一个图层，命名为“actions”，在第一帧输入下面代码： stop(); btnMc.onRollOver function(){/*当鼠标经过按钮时，就从标签over 开始播放*/ gotoAndPlay("over"); function(){/*当鼠标离开按钮时，就从标签out 开始播放*/ gotoAndPlay("out"); Enter组合键测试效果。

下面给图标下方添加一个发光的效果，是按钮很 19、新建一个图层，命名为“bottom-glow”，将“发光3”图层后面的元件复制至该层，然后将所有图层隐藏，只 将“bottom-glow”和“图层1”打开，把bottom-glow 图层的元件调为如图16 所示的位置； 图16 20、新建一个图层，命名为“遮罩2”，在该图层绘制一个矩形，并将该层设定为遮罩层（“bottom-glow”图层在遮 罩层内），如图17 所示； 图17 21、将图层“遮罩2”和“bottom-glow”的第一帧拖至第7 帧，然后在图层“bottom-glow”的第24 帧处插入关键 帧，将该图层的第7 帧上的电影剪辑的透明度设为0，最后创建补间动画，如图18 所示； 图18 22、单个按钮制作基本上完成，最后在actions 图层上新建一个图层，输入文字“first”，如图19 所示； 图19 23、回到主画面，将文档大小设定为 1024768 像素（可以自己定义大小），导入一张素材图片成为背景，并将该 图层锁定。 24、再新建一个图层，用圆形工具绘制一个矩形，填充为白色无轮廓（选择红色是为了让效果非常显著），并将该 层锁定，如图20 所示； 图20 25、再新建一个图层，将其命名为“按钮”，将库中的电影剪辑“btn1”拖入到舞台，最终效果如图21 所示； 图21 此时可以按下组合键Ctrl Enter测试影片的效果。

26、再添加一个按钮，右键点击库中的影片剪辑“btn1”，选择“直接复制”，将其改名为“btn2”，如图22 所示； 图22 27、将影片剪辑“btn2”，拖入到舞台，与“btn1”对齐，如图23 所示； 图23 28、此时必须设置第二个按钮的文字，双击进入第二个按钮，将“first”改为“second”，再返回至主画面，得到的 效果如图24 所示； 图24 29、后面按钮的制作，与第二个按钮制作同理，最后的效果如图25 所示； 图25