///pc/img/blank.gif" width="12" height="8">当前位置:///default.htm" class="under">亿度网络 -> ///pc/index.htm" class="under">网页制作教程 -> Fireworks

///pc/homepage/fwjch/img/000.gif" width="100" height="20">
///pc/homepage/fwjch/img/title_00.gif" width="13" height="20">  

///pc/homepage/fwjch/img/003.gif" width="18" height="16" align="absmiddle">新手上路
///pc/homepage/fwjch/img/009.gif" width="17" height="16" align="absmiddle">网页最佳选择
///pc/homepage/fwjch/img/009.gif" width="17" height="16" align="absmiddle">基本概念
///pc/homepage/fwjch/img/009.gif" width="17" height="16" align="absmiddle">初识Firework 3
///pc/homepage/fwjch/img/006.gif" width="30" height="16" align="absmiddle">制作一个简单的例子
///pc/homepage/fwjch/img/004.gif" width="30" height="16" align="absmiddle">创建
///pc/homepage/fwjch/img/004.gif" width="30" height="16" align="absmiddle">绘制元件
///pc/homepage/fwjch/img/004.gif" width="30" height="16" align="absmiddle">制作动画
///pc/homepage/fwjch/img/004.gif" width="30" height="16" align="absmiddle">加入特效
///pc/homepage/fwjch/img/004a.gif" width="30" height="16" align="absmiddle">调整并输出
///pc/homepage/fwjch/img/002.gif" width="18" height="16" align="absmiddle">网页基本功
///pc/homepage/fwjch/img/002.gif" width="18" height="16" align="absmiddle">网页进阶处理
///pc/homepage/fwjch/img/002.gif" width="18" height="16" align="absmiddle">网页强化
///pc/homepage/fwjch/img/002.gif" width="18" height="16" align="absmiddle">网页高手
///pc/homepage/fwjch/img/008.gif" width="18" height="16" align="absmiddle">自动化处理


///pc/img/message.gif" width="64" height="54" alt="请您留言" border="0">
谈谈您的看法

 

 

 


第四节:制作一个简单的例子

三、 绘制元件

///pc/homepage/fwjch/img/fire1015.gif" width="440" height="178" alt="绘制元件">

图4 绘制元件

  在画布上拖动鼠标即可画出一个十角星(如图4a);选取“细部选取工具” ///pc/homepage/fwjch/img/fire1016.gif" width="20" height="19"> ,单击十角星,就会发现十角星图片四周出现了许多节点(如图4b),说明十角星已经被选中,选取菜单指令“Window\Fill”,开启Fill(填充)浮动面板,在填充浮动面板中我们选择(如图5a)

    1. 填充方式:Solid

    2. 填充颜色:白色

    3. 边缘(Edge):反锯齿(Anti-Alias)

    4. 填充纹理(Texture):Fiber

    5. 纹理亮度值:0%

  同理打开“Stroke”面板并将其设置为(如图5b)

///pc/homepage/fwjch/img/fire1018.gif" width="439" height="269" alt="Fill和Stroke属性浮动面板">

图5 Fill和Stroke属性浮动面板

  用鼠标左键按住一个棱角的节点,拖动鼠标即可改变棱角的位置和方向,这样我们通过改变棱角的位置和方向就可以为十角星设计出一个新的形象(如图6a)

  选中白色十角星,然后Ctrl+c、Ctrl+v复制两个十角星,将它们的填充分别改为绿色、红色,其他不变(如图6b)

///pc/homepage/fwjch/img/fire1020.gif" width="440" height="200" alt="改变外观 复制图形">

图6 改变外观 复制图形

  选中白色十角星,按下F8键,出现了元件属性对话框(Symbol Properties),我们为这个元件起一个名字,在名字(Name)栏中输入“xing1”;类型(Type)选择Graphic,单击“ok”按钮如(图7a)

  同理,将绿色、红色十角星定义为xing2、xing3元件。

  选取菜单指令“Window\Library”开启“Library(资料库)”浮动面板,就会发现我们所编辑的十角星已经被加入到Library中了(图7b)

///pc/homepage/fwjch/img/fire1022.gif" width="472" height="240" alt="加入资料库">

图7 加入资料库

  另外,原来画布内的图形自动转换成了分身(Instance),当我们选取元件分身时,它的左下方会出现“箭头”图示。(如图8)

///pc/homepage/fwjch/img/fire1024.gif" width="212" height="187" alt="元件的分身">

图8 元件的分身

  如果对刚才的元件不是很满意,我们还可以进一步编辑,双击Library中的元件图形,进入元件编辑窗口,我们就可以按照自己的意愿去进一步修改元件,编辑完元件后,将窗口关闭,这时我们就会发现不仅元件有了变化,而且分身也发生了相应的变化。

  这种本体与分身的观念,很适合用来制作动画,我们可以通过修改元件方便地修改所有的分身;另外,由于分身是元件的复制品,因此,使用分身还可以大量减少GIF动画文件大小;如果不想让某个分身跟随元件而改变,我们可以这样来实现:选中该分身,然后选取菜单“Modify/Symbol/Break Link”切断分身与元件之间的链接,这时,该分身就成了一个独立的对象,将不再受元件的影响。

 

上一节 下一节   

 

///pc/img/message.gif" width="64" height="54" alt="请您留言" border="0">
谈谈您的看法

 

 

网页制作 网页设计 网站建设 网站设计 网站制作 做网站 做网页