论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > Fireworks教程
Tag:切片,gif,动画,文字,图标,照片,网页,效果图,表情,按钮,工作,8.0,cs,视频教程

按钮制作<1>

文章类别:Fireworks | 发表日期:2008-9-20 19:31:04

文 / donger

按钮一

按钮一
请看下面这款按钮,想不想学会了进行变形用到别的地方去呢,比如说颜色换成红颜色,心形的外形送给心爱的人呢,呵呵,提供了原文件,需要的朋友可以直接另存为,在fireworks中打开来进行编辑。

制作方法如下:
一、 打开fireworks,新建文件,设置背景色为白色。选择工具面板中的圆形工具
按住shift画一个圆,颜色为蓝色。RGB值分别为51,153,255。使用effect(效果)面板,在下拉框中选择shadow and glow->drop shadow增加阴影,其中distance(距离)为8,opacity(透明度)为60%,softness(柔和)为20。柔和度设置得大点,这点挺重要。加了阴景效果后的图形如下。

二、把上面这个圆进行复制,(点住圆,按住alt键,拖到空白处即可)。在effect(效果)面板中把drop shadow前面的钩去掉,这样做是为了去掉阴影。改变其RGB值改为:51,51,204。
再用同样方法复制一个圆,颜色为白色。选择工具面板中的变形工具 ,把白色的圆稍稍拉小一点。放在蓝色圆形的左上方。位置如下图所示。

二、 用箭头工具把二个圆一起选中,使用菜单modify->combine->punch。这样就出来一个月牙形的外形 。接着我们需要对这个月牙形进行设置。打开fill(填充)面板,其中edge(边缘)中的feather(羽化)设为19;object(对象)面板中设置stroke为路径的外部,
在layer(层)面板中设置其混合模式为darken(变暗)。这样第一个深颜色的月牙形就OK啦。旋转及放置位置如下图所示。


三、把上面所做的月牙形进行复制,填充颜色的RGB改为:102,255,255。选择objet(对象)面板,stroke设为路径中心 。在layer(层)面板中设置透明度为84 ,混合模式为lighten(发亮)。在fill(填充)面板中设置feather为18。此时月牙形为透明,按CTRL+G ,就能看到原来的颜色了。看下图月牙的外形及放置位置。


三、 再接着做二个相同的月牙形,颜色为白色。其中object(对象)面板设置同绿色的那个月牙形,fill(填充)面板中一个feather设为30,另一个设为17。
放置位置如下图,放在同一个位置,feather17的月牙形在feather30月牙形的上面。

四、 再做二个小的月牙形,用上面的方法,颜色为白色,圆的半径大至为52px。Layer(层)面板中设置其模式为正常模式,透明度为100。在object(对象)面板中设置stroke为路径中心 。Fill(填充)面板中设置其中一个feather为2,另一个为8。
放置位置如下图

五、 至此,这个按扭就全部完工了。是不是蛮复杂的呀,呵呵。

上一篇:按钮制作<2> 人气:2804
下一篇:选择性的JPG压缩<1> 人气:1312
Fireworks视频教程

Fireworks视频教程
Windows视频教程
Windows操作
[文]
WORD教程
Word教程
[文]
Excel教程
Excel教程
[文]
PowerPoint教程
PowerPoint
[文]
Dreamweaver
Dreamweaver
[文]
FIREWORKS
Fireworks
[文]
FLASH教程
Flash教程
[文]
photoshop平面设计
PhotoShop
[文]
CorelDraw
CorelDraw
[文]
C语言教程
C语言教程
[文]
html
Html教程
[文]
DivCss布局
Div+Css布局
[文]
Javascript
Javascript
[文]
ACCESS数据库
ACCESS数据库
[文]
ASP教程
ASP教程
[文]
SQLServer数据库
SQLServer
[文]
ASP.NET教程
ASP.NET教程
[文]
FlashAS
FlashAS
[文]
视频教程列表
计算机基础入门及办公自动化: 网页制作开发视频教程: 平面广告设计视频教程 初级程序设计及ASP动态网站开发 Asp.net动态网站开发视频教程 Flash 动画角本编程视频教程
文章教程搜索
 
Fireworks推荐教程
Fireworks热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058