flash导航按钮制作

flash导航按钮制作 炫丽导航按钮制作 先看下最终效果图: 步骤: 1、打开flash，点击菜单栏中的“插入”——“新建元件”(快捷键Ctrl + F8)，将元件命名为btn1，文件类型为“影片剪辑”; 2、选择“矩形工具”，将笔触颜色设为#CCCCCC，将填充颜色设为#000000，将笔触大小设为2，然后绘制图形，如图1所示: 图1 3、选中圆角矩形的轮廓，再在菜单栏中选择“修改”——“形状”——“将线条转换成填充”; 4、用选择工具将圆角矩形的下面一部分选中如图2，并将其删除如图3，最后将该层锁定; 图2 图3 5、选中图形中的黑色部分并复制，然后新建一个图层，命名为“遮罩1”，按下快捷键Ctrl + Shift + V进行粘贴，并将图层1锁定; 6、新建一个图层，命名为“发光1”，选择“椭圆形工具”，将填充色调为#AF00AF，将轮廓色调为无，绘制一个椭圆，然后将其转换成影片剪辑，命名为light1，选中该影片剪辑，给该影片剪辑添加一个发光滤镜，将模糊X、模糊 Y的值设为61，将强度设为131%，品质为低，颜色值为#AF00AF，如图4，效果如图5; 图4 图5 7、将上面的元件再复制粘贴在“发光1”图层，然后放在适合的位置，如图6所示: 图6 8、将“发光1”图层拖曳到“遮罩1”图层下，并将“遮罩1”图层转换成遮罩层，设置与效果如图7、8; 图7 图8 9、新建一个图层，命名为“发光2”，选择“椭圆工具”，将填充色调为#DB1299，将轮廓色调为无，绘制一个椭圆，并将其转换为影片剪辑，添加发光效果(发光颜色为#DB1299)，设置参数如图9所示，效果如图10所示; 图9 图10 10、再新建一个图层，命名为“发光3”，将上面的影片剪辑再复制到该层，然后按照图11放置; 图11 11、将图层“发光2”、“发光3”拖入到遮罩层“遮罩1”内，如图11; 图11 12、将所有图层的眼睛关闭，再将图层1的眼睛打开，将黑色部分复制，然后新建一个图层，命名为“up”，按住Ctrl + Shift + V，用选择工具选中该该图形的下半部分，如图12所示;然后按住Ctrl + X将下半部分剪切掉 图12 13、新建一个图层，命名为“down”，然后按下快捷键Ctrl + Shift + V，将步骤12剪切的部分粘贴到该层。 14、将图层up里面的图形颜色改为#40076B，将图层down里面的图形的颜色改为#5C1DB8，分别将它们转换成影片剪辑; 15、将图层1里的图形转换为影片剪辑，并命名为“btnMc”，再讲实例名命名为“btnMc”。最后将所有图层按图13所示的顺序摆放; 图13 16、将图层“发光2”、“发光3”、“up”、“down”的第一帧拖曳到第六帧，分别在图层“发光2”、“down”的第20帧处按下F6，在图层“发光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"); } btnMc.onRollOut = function(){ /*当鼠标离开按钮时，就从标签out开始播放*/ gotoAndPlay("out"); } 该按钮制作差不多完成，按下Ctrl + Shift + 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、回到主场景，将文档大小设置为1024×768像素(可以自己定义大小)，导入一张素材图片作为背景，并将该图层锁定。 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