云竹社区 » 〖电脑应用及硬件专区〗 » fireworks mx2004 之shapes初体验

打印

[讨论] fireworks mx2004 之shapes初体验

qhf488

新手上路

Rank: 1

UID: 1306
帖子: 42
精华: 0
积分: 24
贡献: 0
云币: 458 云币
阅读权限: 10

发短消息
加为好友
当前离线

1^# 大中小发表于 2008-4-17 08:00 只看该作者

fireworks mx2004 之shapes初体验

　　估计最近让大家高兴的一个消息无外于是mm公司刚刚推出的“三剑客”mx2004试用版了！想必大家都已经开始试用了吧！这里我们不谈别的，只管来看fwmx2004，呵呵，fwmx2004到底还是真的带给了我们一些让我们心动的东西：更新的软件界面；虚线描边的加入；增强的模糊滤镜--添加了动态模糊、径向模糊等滤镜；完美的双字节支持--对于汉语的支持非常棒了；更加亲和的材质填充展现；增强的位图颜色替换、处理工具；当然还有我们今天要重点谈到的shapes--好多漂亮的shapes等我们来使用啊！那么如何来灵活运用这些shapes呢？今天我们就一起来看看！* y+ H9 u0 o' ?0 }

　　我们可以发现，在fwmx2004中，涉及到的shape组有两处。一是工具箱上罗列的形状组，如下图所示：
, y' T& {, y0 y( w

! m7 k% d; v( W- j% E( B' G* N

　　二是浮动面板组的shapes面板：$ { {( _2 z* c! S' V: \% W9 z& W
4 M( D/ @: [9 p4 M! z5 ~ {$ p

: k5 M) X1 h0 h# M9 H( [
, }# W4 m6 \% l" X6 I
6 t5 V+ N: x) o7 u+ E9 m2 \
　　下面就两处形状的使用方法分别来看一看。1 F+ k1 V- L3 F* z2 b9 E# V) s
( m* u* U1 U9 }3 C1 r- ?
　　一、工具箱上的形状组的使用方法详解
$ @$ _& B1 A, e6 x
　　（一）基本操作方法

　　1、选取工具箱shape组的箭头绘制工具，然后在编辑区直接绘制，会出现如下图所示的图形：% c2 M% L# h0 i9 O
( c5 p+ ^ X( O, p4 K4 ^! w

: ~2 v# O/ k* t: J. S
9 D! L3 @+ h! @: q+ Q5 }0 I
　　2、选中箭头对象，我们除了可以调整它的填充颜色，描边形状外，大家应该可以注意到，在该绘制对象上有六个黄色的菱形标记。如下图所示：" |9 g! ^. I+ Z4 g) Z
# f4 z- q' {5 g( ]) \' k

4 r; w6 C& {! ~# i) v% x; v& |
: d2 G4 h1 j! Z7 P/ X6 P1 }
, I1 M* g1 o: c- W0 B( T
　　3、如果大家对微软的word软件中的图形工具经常使用的话，相信对这些菱形的图标不会陌生，而且估计你首先想到的就是会用你的鼠标去拖拽它们。呵呵，会有什么效果出现呢？我们依次来看看各个数值标示的调整点的拖拽情况：. r6 j- v4 ^% v

　　a、1号点6 k; s, e4 L3 p) J+ r
4 i$ n" U3 J+ G5 I4 w
　　当我们选中该调整点的时候，就出现一个黄色背景的提示框：roundness。圆角数值调整。向箭头的方向拖动鼠标，会发现原来的默认直角会变成圆弧的样式。/ D. e) E. ~3 ~1 }6 J3 K- _
7 m1 G9 e8 g' O( a. \: ]

, M6 q2 k" _# g6 \7 J
1 ~9 Y1 ^2 @6 O$ k9 Z6 j
　　b、2号点 R3 ]- u6 W% p, f+ R! h r

　　当我们选中该点进行调整的时候，不会出现相应的背景提示框。但是奇妙的事情是我们可以向下、向左右方向进行拖拽了（不能向上，也就是说，不能比箭头的现有水平高度还小），形成了弯角箭头，如下图所示：

- o* O' O% b4 a6 }) l# E( b% T' m
; n! U2 l( p$ K7 B$ E
) @$ F$ Z7 w# A) k
　　拖拽后的效果如下图所示：

8 M' V4 H2 ~7 t/ }4 }* q3 J) t9 l; ^

　　c、3号点
/ c( Y$ o- E1 G
　　当我们选中该点，会出现背景提示框：thickness。这样，我们知道了该调整点的作用是用来调整箭头的厚度或者说是宽度了。下图调整的前提是已经将箭头变成了弯角箭头，大家可以在没有变成弯角箭头的前提下拖动该点，看看效果如何。
) z* H; Q5 R- W2 }. _

* g+ k1 U$ Q* c w

　　拖拽后的效果如下：
% j( }: t0 B. a2 ]

* ?$ T' q) U1 R

3 M/ b Y4 e9 w
　　d、4号点! r. m! y/ F! A2 k/ f$ F
8 ^- {5 s$ h' E5 N) ?
　　选中该点，会出现背景提示框：arrow size。可知，该调整点的作用是用来调整箭头的大小的。直接用鼠标拖动，随意调整自己需要的角度大小即可了。调整方式如下图所示：$ f; |& `. d' r6 V. C2 o7 v3 h

5 ?$ E& c7 L8 Y+ E7 a$ ?* }: |
　　e、5号点
6 i8 \, K" r- @+ O! ]) @
　　选中该点，我们就可以直接向左向右直接拖动鼠标来调整箭头的总体长短了，很实用的，调整方式如下图所示：/ ?* ?! t- c$ e0 r. G6 N% u

0 y! F& g. m8 }+ [2 `+ U

　　f、6号点. k z) y& x: f& ~7 b

　　选中该点，会出现相应背景提示框：arrow tip。直接用鼠标拖动（只能向箭头的左右方向拖动），就可以改变箭头的大小了！请看下图演示：
+ j7 N0 J& E3 ~# |, B2 V2 X

4 ?- D4 A" J! C& U+ s# K
　　好了，通过我们对上面箭头形状工具的详细介绍，想必大家对fwmx2004的形状工具有了进一步的认识了吧？大家不妨一个一个拿来试试看啊，看看还有什么更新奇的东西！(休息，休息……)
" H+ v/ p1 B# \2 _# e% \& Y+ K. w
　　（二）个案介绍6 q( D8 [* W ]6 |

　　休息完毕了！呵呵，不知道大家是否已经测试完毕了，接下来，我们一起再来看看工具箱里的其它个别工具的调整技巧，看看我们想的是否一样哈？！
- V, q" Z% P. S3 Q: ^* B3 h( O$ V
　　1、矩形相关工具介绍。; z& Y( m$ U$ H# Z, A$ B
, `! U/ i/ Z3 k! R. C9 l) }" {
　　矩形绘制工具从我们使用fw那一天起就一直都在使用，这个不用多讲，和矩形相关的绘制工具在fwmx2004中有所增强：在形状绘制工具里面我们可以发现下图所示的两个图形工具：beveled rectangle(斜面矩形)和chamfer rectangle（内切面矩形）。这两个工具的使用有些意思，或者说mm公司有些过分的“善解人意”吧！因为换个角度来说这两个工具其实根本上就一种工具，为什么这么说，我们还是亲自画画吧！, A# [) m% s, o) d

/ f6 y" U) m% {
　　（１）beveled rectangle(斜面矩形)/ x4 `$ B6 c% E

　　a、首先我们使用beveled rectangle(斜面矩形)工具在编辑区进行随意绘制（大家可以看看配合shift键产生的效果），如下图所示： H8 e: z }$ W: g

6 R$ x2 d, f! F3 F2 c
0 ?- e, \: H4 G/ L: D2 |
　　b、可以发现共有5个黄色的菱形调整点，右下角的调整点的功能，我们通过在该点单击鼠标可以获知：resize，很好理解，可以对绘制的形状进行形状的再次调整，而且是方向随意的调整，请看下图操作演示：
3 a3 t8 r6 ]& ]# C# p

3 L& m" E) U# ?; }2 Q. Q
. Q6 D& i: U! \& d; a: _% Q
　　c、在斜面矩形的边上共有四个调整点，选中任意一个调整点，就可以进行水平方向的缩放调整了

/ D; l& o9 N: b" m6 h
( X# n/ m& U' Z
　　d、向两侧调整的最大极限是变成矩形。向内部调整的最大极限就是上下方的调整点各自重合，形成如下图所示效果，叫什么形状我也搞不清楚了，呵呵：

" @5 V, D5 U& {+ w, C6 ?) R

　　e、在选中边线上四个调整点的任意一个调整点的时候，我们会发现出现黄色的背景提示框：alt/opt for individual corners 。具体的作用是什么，按下键盘上的alt键，然后单击任意一个调整点，看看发生了什么变化？呵呵，斜面矩形的角的形状发生了变化，再次单击，是不是又有变化发生呢？其实，共有3种形状的变化，这个大家都已经看到了，我就不再用图例演示了！& K& `# B8 ?' q' |
# D) X6 u! i7 h& O3 p9 W6 g
　　f、好，松开我们按下的alt键吧！把鼠标移到边线上四个调整点的任意一个上面，单击鼠标，呵呵，又有什么效果发生了？是不是四个角的形状同时发生了变化？换个调整点再次单击鼠标，仍然有变化发生，够奇妙！具体的几种形状我们看下图所示：

% n; H- ~* g. A, l1 h, R; H5 c
+ b o2 p/ u8 W+ J
# O d W4 ?- ~1 W: Y
　　（２）通过上面的介绍，chamfer rectangle（内切面矩形）工具看来就不用多讲了，因为大家只需要在编辑区绘制一下，然后参照上面的调整方法进行调整，什么就都清楚了！
! r( s+ W9 w# ?8 H. ]5 E

0 ^4 }: I/ ^! i- [' M

( s8 G1 n4 y$ ~- W1 l8 a
　　（３）说完上面两个形状绘制工具，继续看工具箱的其他和矩形工具相关的形状绘制工具，发现了rounded rectangle（圆角矩形）绘制工具，这个是fwmx就已经有的了，但是绘制后经过调整，发现，原来这个工具也是应该和上面两个工具合并在一起的，简直就是同出一辙，不知道大家是不是这样以为呢？而且圆角矩形工具发生了一个变化，原来在fwmx中可以对圆角的角度大小进行调整，但是在fwmx2004中，却不见了调整的选项，下图是fwmx中的圆角大小调整的截图，红色矩形框内就是圆角大小的调整选项了。8 V( }9 k" v7 _

: O* F! x- F3 I: m6 ?- q* _5 N

　　如此看来，mm公司又有漏洞了么？看看矩形工具的属性调整框，我们会发现，和fwmx一样，圆角数值调整框依然存在，如下图所示。如此看来，我们需要精确大小的圆角矩形的话，还是使用矩形工具更好一些！8 T+ G7 x: q; j: i7 ]* T! D! W

8 v3 E, ?% r5 P7 Y% A8 n

. \0 [; K% ^' g: [+ l8 G1 W( ^, l
　　２、圆形相关工具
. W$ O; [1 f6 @- z5 Z3 P
　　（１）doughnut tool（圆环工具）

　　选取工具箱的该工具，在编辑区上进行绘制，会出现如下图所示图形：

4 A; c- i- t; O% Q
; x0 R8 w$ x) a" o
　　经过处理，我们可以同时看到选中该图形后三个控制点的相关的提示框：
4 i. Q1 s, R; j# c8 ^0 K
　　a、最上端的控制点功能可以说是最大的，单击该控制点然后分别按照顺时针或者逆时针的方向拖动该控制点，就会出现将圆环切割分离的效果，如下图所示：

; m/ g5 l2 F! ]/ a7 L
0 [4 ]$ ] g, c
　　如果配合键盘上的alt键，然后拖动，就会出现不同角度的切割线，如下图：
请注意：本步是可逆的，如果你对切割线的出现位置不满意，仍然可以直接选中调整点进行角度大小调整，甚至你可以拖动调整点到上一个调整点这样两个调整点就自然重合了。当然，这些操作都不需要配合键盘上的alt键了。请大家自行试验吧！
/ }/ ?: u& E6 H% Y: ~

' L4 ]1 A, j0 p: L% j$ N8 {
: l6 E6 p" X+ Y% {1 t* W7 w

　　呵呵，有什么用处呢？此刻选取工具箱的超级选择工具就可以选中任意的一个扇形进行颜色调整了。如果你想仔细的调整，可以执行菜单命令“modify--ungroup（快捷键是ctrl+shift+g）”就可以将上面的图形打散了，原来这个圆环已经被刚才的那些线段切割成了不同的扇形了。
% Y/ I$ a4 ^/ o' J& j$ N

+ s3 `1 d  }8 D7 s& ^! M5 B( D4 }
0 S4 E  Z* I# U- Q

　　b、点中中部的调整点，单击鼠标，圆环就会变成圆形了。如果选中该调整点，直接向内或者向外拖动鼠标，就可以调整圆环的中心大小了！1 r0 I6 o9 D$ X) \; n8 T
2 e5 t. X, p. U
　　c、中部右侧的调整点同样是用来调整圆环内部圆形的大小的，不另作介绍了。

　　（2）pie toll（饼形图绘制工具）3 @2 H7 U# h! e- C) @
7 j: Y5 [, A) b; `5 \
　　这个工具和上面的圆环工具其实又重复了，因为通过我们的实际操作会发现，我们只要调整圆环工具绘制的圆环的中心调整点就可以将圆环调整成圆形，而饼形绘制工具的操作也和圆环的边缘调整点的调整基本上是完全相同的，请大家自行测试！' G9 P+ h' g6 v+ g( q$ o. p
3 q/ G  s' R/ n& {
　　3、多边形、星形相关工具

　　(1) smart polygon（正多边形）工具

　　a、从工具箱选择该工具，在编辑区单击鼠标即可出现一个正多边形，默认情况下时出现一个正7边形。可以看到图形对象上有4个调节控制点，请看下方处理的标示图片：

7 H/ k* e- s' E
! i( e, b9 P( O2 |. C/ p2 l
　　b、1号点：

　　用鼠标选中该控制点，会出现背景提示框：scale/rotate（缩放/旋转）。很明显通过拖动该点即可调整正多边形的大小，而且可以对该图形对象进行旋转调整。

　　2号点：选中该点，会出现背景提示框：sections：7（截面：7个）。不要松开鼠标，向下拖动鼠标，发生了什么变化？一方面，sections的数值发生变化--减少了，另一方面，多边形的截面也相应的减少了，效果如下图所示范：9 V/ T8 X$ O2 F8 S2 D
0 k: h h3 h/ h

+ N5 [" D7 G. j- |4 T5 ?

, o/ i- l/ S2 B; H; y
　　把鼠标向上拖动，sections的数值就会增加了，而且多边形的截面也会增加。
2 I" P- x. c+ {: `" l
　　3号点：选中该点会出现提示框：inner polygon（内部多边形）。向边缘方向拖动鼠标，会出现什么变化？内部也出现了一个多边形，而且增加了一个reset inner polygon（恢复原状）的控制点，具体的操作和上面介绍的圆环的操作基本类似了！请自行体会。变化效果请看下图：8 G. H8 S: u, H- F/ j. Q+ |

6 r% N& ?, y( Q4 A$ P1 W. U
　　4号点：选中该点，出现的提示框是：sides:7;alt/opt-drag to split（边数：7；配合alt/opt键拖动进行拆分）这个控制点也是比较有意思的，选中该点后向上拖动鼠标，发生了什么变化？和3号点恰恰相反了，向上拖动的结果是增加了多边形的边数，只要鼠标不停止，就会一直增加下去，相反，向下拖动鼠标，就会减少多边形的边数。如果配合键盘上的alt键，单击鼠标，或者沿上下的任意方向拖动鼠标，然后选取工具箱的超级选择工具，单击鼠标，就会发现，多边形已经被等分了。同样，执行菜单命令“modify--ungroup（修改--打散群组）”命令，就会发现平分多边形得到的各个小多边形。如下图所示：
7 I" h* G4 A/ c( @% n5 \) ~

9 P+ V! Z( m! W6 B
　　（2）star（星形）工具

　　星形工具如果大家能好好研究一下的话，相信大家会做出很多漂亮的效果的，随后我会用专门的教程来介绍通过对星形工具绘制的对象进行调整而形成的五花八门的效果。这里我们只对星形工具做一个简单的介绍。+ v! V& m! W1 I

　　a、从工具箱选择该工具，在编辑区单击鼠标即可出现一个五角星，可以看到图形对象上有5个调节控制点，请看下方处理的标示图片：" e. M* s9 x9 ?' ^: O

4 T& l# d5 z, Y0 A/ ~' Z
) v* C; G. |2 Q* s, Z9 d+ l# Q
　　b、1号点和2号点在鼠标移过或者单击的时候没有什么提示框，可以分别选中这两个调整点，向上或者向下方向拖动鼠标，来对星形对象的形状进行调整；3号点和4号点在鼠标移过或者单击时候出现提示框：roundness，可以通过向左右方向或者上下方向的调整来对星形对象的外观进行调整，请自行试验，或者关注随后的系列教程；5号点出现的提示框为：points：5，同样，通过向上来增加星形对象的角的数目，向下来减少角的数目。通过我们的调整，我们可以做出很多漂亮的效果，请看如下图所示：
7 N2 K/ ^4 s. n$ Y$ p' p% s. z; ?

9 X7 g+ X) C+ }# o

+ Q% Q$ T, T; q8 o# W
　　相关图形的制作技巧会在后面的教程中详细介绍的。
% z8 q# } E0 V I L
　　（3）l-shape（l形状）绘制工具" C) s( c2 m. @
% \$ K9 \; E/ G" Z3 y: y
　　该工具的使用方法较简单，控制点的调节请参照箭头形状的调整方法。% c. h: B7 ?6 M, \# Q0 e J$ b

　　4、线形相关工具! Y6 j& S9 ^: G2 A! i
5 K0 c9 B. I5 b2 ]
　　（1）connector line(折线)
, P0 k6 T, d8 }# |3 z
　　从工具箱中选取该工具，然后在编辑区拖动鼠标进行绘制，会出现如下图所示的图形。

/ T' U3 z6 f$ T( s
# \- ?; @1 k$ A

　　从上图可知，此图形对象共有５个调整点，上部左侧的控制点和下部右侧的控制点均可以进行上下、左右任意方向的拖动调整，从而对折线形状进行调整；上部右侧和下部左侧的控制点通过水平拖动，可以改变折线连接处为圆角；居中的控制点可以用鼠标选中左右拖动，从而改变折线的左右对称性，如果单击该控制点，即可对折线对象实现逆时针方向的90度旋转。当然，我们可以对折线对象进行fill（填充）及其stroke（描边）的各项内容的调整，下面图例为进行各项调整后得到的图形对象：( H ^0 J9 i& H5 a' }

, a5 t3 z( u4 S, v
　　（2）spiral(螺旋线)
! c6 [6 B; J1 y* x: t$ D1 f' y1 A
　　在很久以前，很多人为实现螺旋线的效果想方设法，现在不需要了，因为直接通过spiral图形绘制工具即可轻松实现螺旋线的效果，直接选取工具箱的spiral工具，在编辑区进行绘制，出现如下效果图（描边采用了虚线描边）：# i: i1 \! A+ V' F

9 l9 {& A4 m! T9 u2 I# G2 _

5 {( d. A% i+ f5 B6 j6 f0 R
　　从上图可以看到，螺旋线图形的调整点有两个，左侧的不用说了，肯定是对螺旋线的层数进行调整了，选中控制点，向上、向下拖动鼠标吧！果然，螺旋线的层数产生了增加、减少的变化；中心的控制点是用来控制螺旋线的封闭还是开放的，只需要通过单击鼠标即可实现闭合、开放的改变，轻松……好了，图形比较简单，但是实用，看看能产生什么效果：
$ ^5 d1 F* ~1 C& G: `" t" z

& t: d d$ {3 r0 ]5 T4 m

　　好了，工具箱的形状绘制工具就说这么多了，其中的奥秘肯定还有很多，需要我们大家一起来发掘啊！接下来我们会对shaps形状面板进行详细的讲解，请关注！

TOP

‹‹ 上一主题 | 下一主题 ››