|
中级会员
 
|
1#
大 中
小 发表于 2007-1-3 10:48 只看该作者
用fw mx 制作 mac风格边框
& o+ Y/ s$ D: D% k. [ h163k团购网站系统官方服务论坛 以前大家常用线条来表现浅浮雕效果，现在我们在fireworks mx(以下简称fw mx)里可以用效果(effect)面板来轻松制作。 bbs.163k.com' t5 T; ~9 m6 I
如下图则是用线条来制作的一个mac风格的边框，我们用fw mx打开源文件就会发现制作比较繁琐，有没有简单的方法来制作呢？答案是肯定的，方法就是用效果(effect)面板！本例用来说明用fw mx制作边框的过程，希望能为fw mx爱好者提供一个新的思路。bbs.163k.com3 P) U5 R9 Q& N6 q
; p, [+ p8 o; Qbbs.163k.com.png文件
5 z5 v9 j# H4 C5 p, P7 t/ X8 ]163k团购网站系统官方服务论坛
& x4 c; J/ ]5 { 一、边框制作 163k团购网站系统官方服务论坛9 z0 q5 @- C' ?% o w; {
1.打开fw mx，建立一个340x110的新文件。
3 p3 k( h* A+ i% `团购网站系统,团购网程序 2.从工具栏中选择“矩形”工具或按快捷键（u），画一个328x98，填充色为（#cecfce）无边框的矩形（以下如无说明，所画矩形都为无边框）。
0 U/ c, l Y( ^1 x3 o/ Y163k团购网站系统官方服务论坛 3.要想达到如下图所示的图形时，必须要使用菜单栏：修改==>组合路径==>打孔和联合来制作了。
, k5 r% R0 _. B4 p- r为互联网事业发展提供源动力！
$ d4 `- l3 X' H) t团购网站系统,团购网程序 按u键画一个320x73的矩形，填充为黑色。移动至合适的位置，本例中为距左4px，距下为5px。同时选中两个矩形，使用打孔命令，但得到了效果和我们要求的图形还是有差别的，没关系，画一个18x18的矩形，置于右下角，菜单栏：修改==>组合路径==>联合就得到了我们要求的图形。163K网站系统官方论坛; G/ I: u" y% p+ ^8 t' F
4.选定所生成的图形，按ctrl+shift+d或菜单栏：编辑==>克隆，选中效果面板：阴影和光晕==>发光，设置如下图：
, ]6 ~- I) d8 S- _bbs.163k.com 为互联网事业发展提供源动力！4 @% q/ p2 m8 b8 {1 ~0 a
设于第三步生成的图层下面，我们的图形不是有了一个好看的边框呀，这样做比只用一个图层来制作有更大的灵活性。163k团购网站系统官方服务论坛- y5 c3 H- s& X6 u s6 f9 B
5.选中第三步中生成的图形，选中效果面板：阴影和光晕==>内侧阴影，填充色为（#f0f0f0）设置如下图：
/ s* i1 Z- E5 x/ I163k团购网站系统官方服务论坛 为互联网事业发展提供源动力！. o* ?# E6 s* |
选中效果面板：阴影和光晕==>内侧阴影，填充为（#adadad）设置如下图：
" r! g+ l! q# u( \6 Abbs.163k.com 9 S$ @, O! @$ z& g% T% V
注意图中的角度，第一次为315，第二次为135，最后我们得到的就是一个有浮雕效果的合成路径了吧，现在知道为何要用两次内侧阴影了吧。效果如下图：163K网站系统官方论坛& D. h+ C P/ |$ `& y& v% ^
 bbs.163k.com0 Z+ e7 v7 H, T Y& j* }
二、小按钮的制作
- w4 L& Q$ Z0 b163k团购网站系统官方服务论坛 根据刚才制作的方法，我们来制作一下旁边的小按钮和线条，最后可以得到如下图的小按钮（下图放大300%）
5 h: [5 Q2 p( D为互联网事业发展提供源动力！ 163k团购网站系统官方服务论坛1 T/ z3 L, ~8 X
加以改动就可以得到新的小按钮吧。
+ q: `6 W4 T, t- l- bbbs.163k.com
+ h* Z8 ?) m+ Z! kbbs.163k.com 线条的制作就很容易了，画一270x12的矩形，放置到合适位置，设置如下，就ok了。163k团购网站系统官方服务论坛0 z% T+ ]( j5 u2 U) P
5 o0 \7 r% L- V1 k; N/ y为互联网事业发展提供源动力！ 用线条画出右下角的装饰线，按（ctrl+g）组合一下。bbs.163k.com0 H' U: K r/ n5 o. S4 w: {: E
三、背景 为互联网事业发展提供源动力！: u/ k$ C. \2 C1 W. y. t/ G
1.画一矩形置于所有图层下面，填充为（#ff9900）放置于合适位置，设置如上图，只不过填充纹理里把“水平线4”改为“网格线1”就ok。团购网站系统,团购网程序( h7 b, k* ^4 w1 O* |5 g
2.添上合适的文字，最后效果如下图：
1 K9 [4 V; L$ h163K网站系统官方论坛
- M$ `/ ^9 l" Y1 c9 Y为互联网事业发展提供源动力！团购网站系统,团购网程序+ d( P) j" ]" v" b5 A
.png文件
+ g# S6 N6 M8 U/ ^) G* dbbs.163k.com 同样的效果可以有不同的制作步骤，大家如果觉得这种方法比较简单，修改也方便，可以自己动手试一下。163k团购网站系统官方服务论坛& Y5 z* H$ B9 _$ o7 F
0 t6 \6 U- [6 w团购网站系统,团购网程序5 r6 w8 p; s8 N/ k9 W$ |7 E/ V2 b
|
