动态网站制作指南 [  QQ表情  ]
[ 投票调查 ]
[ 企业邮箱 ]
[ 网站空间 ]
网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程
ASP源码 | .Net源码 | PHP源码 | JSP源码 | JAVA源码 | CGI源码 | VB源码 | C++源码 | Delphi源码 | PB源码 | VF源码 | 汇编 | 服务器
电脑书籍下载:程序设计书籍 | 数据库教程书籍 | 平面与多媒体书籍 | 网络通讯书籍 | 系统管理书籍 | 网络安全书籍 | 认证考试书籍
Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint
asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!
当前位置 > 网站建设学院 > 图形图象 > Fireworks教程
图形图象:Photoshop,Fireworks,CorelDraw,Flash,3Dmax,AutoCad,Maya,Director,Authorware,Illustrator,相关软件
文章搜索服务
邮件订阅
输入你的邮件地址,
你将不会错过任何关于:
[ Fireworks教程 ]的信息



本月文章推荐
.Fireworks绘制简洁精致的Rss图标.
.稚幼体字体效果制作.
.Fireworks图片魔术:黑白照片的彩.
.Fireworks制作精致浪漫的彩色网格.
.按钮制作<4>.
.一款动画Logo制作方法.
.下拉菜单全攻略之Fireworks篇.
.Macromedia Fireworks MX的新特性.
.Fireworks 2004 画明基77G显示器.
.Fireworks动画制作基本类型.
.FW中几种字体效果的制作.
.Fireworks中各种虚线的绘制方法.
.Fireworks蒙版制作图片窗格效果.
.Fireworks制作可爱“葱头”小P孩.
.Fireworks三维插件辅助绘制转动立.
.新手入门:FW雪花飘飘迎新春.
.Fireworks CS3切片工具的使用简述.
.Fireworks动画优化与导出详解.
.Fireworks制作水平或垂直的彩条背.
.Fireworks的描边表面研究.

稚幼体字体效果制作

发表日期:2005-7-2 |


首先来看下面的示范按纽图片:

  本节教程计划用三种方法来和大家一起学习这种圆角按钮的制作方法,希望大家可以从三种方法中分别学习到一些东西。

第一种方案:[常规性方案]

1、打开FW,新建一个文件,文件的大小、背景色自定义。

2、开始具体制作之前,先执行菜单命令“View--Guides--Edit Guides”,在弹出的对话框中进行设定:将Show Guides(显示辅助线)和 Snap to Guides(吸附到辅助线)前面的对勾选中,点击OK即可,具体设定如下图所示:

[注意:辅助线对后面的操作起着很大的作用,所以最好还是先看看这里的设定]

3、从上侧标尺栏拖出两条水平的辅助线,两条辅助线之间的距离大小就是我们要制作的圆角按钮的高度大小,如下图:
[注意:如果标尺栏不可见的话,可以执行菜单命令“View--Rulers”即可将标尺栏设为可见]

4、选取工具箱的椭圆绘制工具,配合Shift键,在两条辅助线中间绘制出一个圆形,圆形的直径大小和两条辅助线之间的距离大小要相等。选定绘制的圆形,执行快捷键操作“Ctrl+Shift+D”(相应菜单命令为“Edit--Clone”),这样就原地Clone(克隆)了一个圆形对象,选定克隆对象,向右拖动它,或者使用键盘上的向右的方向键向右拖动该克隆对象,调整后的两个圆形对象如下图所示:

5、选定左侧的圆形对象,这样圆形的路径节点就会体现出来,从左侧标尺栏拖出一条垂直方向的辅助线,该辅助线要恰恰通过圆形对象的垂直方向的那条直径,如下图所示:
[注意:如果不能确定辅助线是否恰恰经过直径的话,可以放大编辑视图来仔细观看;当然,你也可以先拖出辅助线,然后移动圆形对象进行调整。]

6、重复第5步的操作,在右侧圆形对象垂直直径处也拖出一条辅助线,如下图:

7、这样,辅助线在编辑区的中心就恰恰围成了一个矩形框。选取工具箱的矩形绘制工具,以辅助线左上角的交点处为起点,向右拖动矩形工具绘制出一个矩形,矩形的大小和辅助线在编辑区的中心形成的矩形框的大小相符,如下图所示:
[因为在一开始我们对辅助线进行编辑的时候就已经选定了“Snap to Guides(吸附到辅助线)”选项,所以这个矩形的绘制会很轻松]

8、现在可以将辅助线移除了,选定编辑区的所有对象,执行菜单命令“Mofify--Combine--Union”,这样就将三个路径对象联合成一个路径对象了,如下图所示:
[注意:Union命令和Join命令的区别,大家可以在选定三个操作对象的情况执行菜单命令“Modify--Join”,看看执行后的效果,两个命令的区别就不言而喻了。]

9、选定编辑区的联合对象,打开Fill填充面板,对其填充色进行编辑,这里采用的填充方式是Linear(线性渐变),填充的方案采用的“Black,White”,填充的方向是由下向上的填充,填充结果如下图所示:

10、在按钮上添加相关文字,这样我们的一个圆角按钮就制作成功了,如下图:

[第二种方案:技巧性方案] 1、首先从上侧标尺栏拖出两条辅助线,在两条辅助线中间绘制一个圆形对象,圆形的垂直直径大小和两条辅助线之间的距离大小相等,如下图所示:

2、选定编辑区的圆形对象,然后选取工具箱的Knife工具,我们应该发现,圆形对象的四个路径节点已经显示出来了,接下来从左侧标尺栏拖出一条垂直方向的辅助线,使该辅助线与圆形的垂直直径相重合,如下图所示:
[Knife工具的简介:在矢量图的操作模式下,该工具可以用来对路径进行切割操作,可以理解成一把刀子;在位图操作模式下选取该工具的话,就会变成橡皮擦,可以对位图进行擦除操作]

3、使用Knife工具,沿着辅助线自上而下进行切割操作,具体的操作步骤,请看下图的演示:

4、切割操作完成,使用点选工具,分别单击辅助线两侧的圆形对象部分,我们可以发现,圆形对象已经被切割成两个半圆了,如下图所示:

 

5、选定左侧的半圆,向左拖动,也可以使用键盘的方向键移动它到合适位置,如下图:

6、同样,将右侧的半圆,向右拖动到合适位置,然后,从左侧标尺栏拖出链条辅助线,分别放置在两个半圆的垂直直径处,如下图所示:

7、这样,辅助线现在已经形成了一个矩形框,和第一种方法的第7步的操作相同,在该矩形框内画出一个矩形,如下图所示:

8、现在可以将辅助线移除了,选定编辑区的所有对象,同样还是执行菜单命令“Mofify--Combine--Union”,这样就将三个路径对象联合成一个路径对象了,如下图所示:
[注意:这里我们可以使用“Modify--Join”命令,但是如果你细心观察的话,还是会发现执行该命令和Union命令的区别的,不妨自行试验一下。]

9、圆角按钮已经出现,后面的步骤不再赘述。

[第三种方案:最简单最有力的方案]1、选取工具箱的圆角矩形绘制工具,在编辑区绘制一个圆角矩形。2、选定圆角矩形对象,打开Object面板,调节Roundness数值大小,如果需要出现如上面两种方法产生的圆角矩形的话,将圆角数值的大小调节成100(最大值)即可,编辑区的对象是不是已经发生变化了?

[技巧:]使用圆角矩形工具在编辑区进行绘制的同时,配合使用键盘上的向上方向键就可以轻松的实现增大圆角大小,如果使用向下的方向键,就会在绘制的同时减小圆角数值的大小。大家可以试验一下!

[补充声明:]直到最后,才把最简单的方法告诉大家,不知道大家是不是有些恼怒,不过在这里想提醒各位一句,希望通过本篇教程的学习,各位能够多掌握一些解决同一个问题的几种思路、几种方法~~如果你认为这些没有必要的话,那我只能表示遗憾了~~;)

  下节,我们会使用我们制作的圆角矩形按钮图形来制作一个真正的动态的按钮效果,请关注< 接触效果按钮的制作 >!

上一篇:Fireworks常见问题解答(1) 人气:8348
下一篇:接触效果按钮的制作 人气:8883
浏览全部Fireworks的内容 Dreamweaver插件下载 常用网页广告代码全集
  最新网站源码 最新软件下载
2008-7-23 Menalto Gallery v2.3 Rc1 多国语
2008-7-23 深度学习网址导航系统 v2.6.1
2008-7-23 因特达crm2008客户关系管理系统
2008-7-23 60度 CMS v1.0 Build 080723
2008-7-23 幻影动漫网视频系统(Ppdong) v1.
2008-7-23 好易祝福墙 2008
2008-7-23 APJE私服发布系统 v2.0 PHP版
2008-7-23 毕业论文在线指导系统源码
2008-7-23 Jacky法律在线网站源码
2008-7-19 UltraEdit 简体中文增强版 14.10
2008-7-19 CentOS 5.2 i386 LiveCD
2008-7-19 Snapture多功能相机 v1.4
2008-7-19 iAcces中文输入法 v1.0Build016
2008-7-19 Cookbook烹饪秘籍 v2.5
2008-7-19 苹果专用DVD转换工具 v1.1.59汉化
2008-7-19 Modem修复软件ZiPhone修改版04.0
2008-7-19 AgileMessenger即时通讯工具美化
2008-7-19 Sketches画图软件 v0.7b6破解版


  发表评论
姓 名: 验证码:
内 容:
[ 汉字翻译拼音 ] [ 广告代码 ] [ 符号对照表 ] [ 进制转换 ] [ 经典小工具 ] [ 个税计算 ] [ 汉字简繁转换 ] [ 普通单位换算 ] [ 公制单位换算 ]
[ 生辰老黄历 ] [ 国内电话区号 ] [ 国家代码与域名缩写 ] [ 文字加密解密 ] [ 健康查询 ] [ 万年历 ] [ 手机号码查询 ] [ ip搜索 ] [ Google PR查询 ]
业务联系 | 广告刊登 | 频道合作 | 投稿荐稿 | 联系方式 | 加入收藏 | RSS订阅
Copyright © 2000-2008 www.knowsky.com All rights reserved | 网络实名:动态网站制作指南 | 沪ICP备05001343号
ホームページ制作 不動産検索システム 求人情報
防水工事·改修工事 フットサル大会 探偵