网页设计：[5]绘制“心”形图案

实验题目:    绘制“心”形图案                                            

实验概述：

【实验目的及要求】

了解Fireworks 8的 绘图原理

熟练掌握绘制路径对象和编辑路径对象的方法、技巧

掌握创建矢量图的基本方法及相关工具的使用

【实验原理】Fireworks 8的 绘图原理, 绘制路径对象和编辑路径对象的方法、技巧, 矢量图的基本方法及相关工具的使用。

【实验环境】（使用的软件）

AMD Athlon(tm) 64 X2 Dual Core Processor 5000+ 2。60GHz

1。87G内存

Windows操作系统

Macromedia Fireworks 8

实验内容：绘制“心”形图案

【实验过程】（实验步骤、记录、数据、分析）

准备工作

在C盘或其他盘新建一个文件夹，本次实训的内容将全部保存在该文件夹下。

用图形变形方式绘制一张心行、形图案

新建文件

在Fireworks中选择“文件”|“新建按”菜单命令，设置画布的“大小”为400X400，“背景颜色”选择“白色”。

单击“主要”工具栏上的“保存”按钮，以“heart。png”的文件名保存文件。

绘制“心”形图案

单击“工具”面板“矢量”工具中的“矩形”工具右下角的黑色三角形，在弹出的子菜单中选择“椭圆”工具。选择完毕后，在“属性”检查器设置“填充颜色”为“#FF0033”，“笔触颜色”设为“无”。

移动鼠标到画布上，按住【Shift】键的同时拖放鼠标左键，绘出一个圆。为了编辑方便，在“属性”检查器中将它的“宽”和“高”都设为120像素，将该圆放置在画布上中间偏左的位置。

选择“工具”面板中的“指针”工具，选中这个圆，选择“编辑”|“克隆”菜单命令，克隆这个对象。

执行完这个克隆操作后，克隆出来的副本正好堆叠在被克隆对象的上面并且成为所选对象，所以此时只要用指针工具将副本移开即可。调整两个圆的水平距离。

为了确保“心”形图案的对称性，需要两个圆在同一水平线上。所以接下来选择“窗”|“对齐”菜单命令，打开对齐面板。

选择“到画布”，再选择“垂直居中”，此时两个圆不但在同一水平线上，而且在画布上垂直居中。

选择“工具”面板的“指针”工具，按住键盘上的【Shift】键，同时选中两个圆，选择“修改”|“组合路径”|“联合”菜单命令，此时可以看到两个圆合二为一。

选择“工具”面板中的“部分选定”工具，选择下面中间的交叉点，然后竖直地移动该节点。

使用“工具”面板中“部分选定”工具，选择右图中的光标所示的点，按住键盘上【Delete】键，删除节点。

单击“主要”工具栏的“保存”按钮，保存文件。

用钢笔工具绘制一张“心”形图案

新建文件

在fireworks选择“文件”|“新建”菜单命令，设置画布的大小为400*400，“背景颜色”选择“白色”。

单击“主要”工具栏上的保存按钮，以“heart2。png”的文件名保存文件。

(2)绘制心型图案

选择“视图”|“网格”|“显示网格”菜单命令，使画布上出现网格。

选择“钢笔”工具，在画布中心处单击第一点，在第二点处单击拖曳，使其成为曲点。在第三点处单击、在第四点处单击并拖曳，也使其成为曲点。然后再单击第一点，使钢笔绘制的路径成为一个封闭的路径。

用指针工具选择该路径，在“属性”检查器中设置“填充颜色”为“#FF0033”，“笔触颜色”设为“无”。

选择“视图”|“网格”|“显示网格”菜单命令，取消画布上网格。

单击“主要”工具栏上的“保存”按钮，保存文件。

增加效果，美化心形图案

打开heart1。png或heart2。png文件。

选中刚制作好的“心”，单击“属性”检查器上“滤镜”按钮右侧的按钮。

在弹出的子菜单中选择“斜角和浮雕”|“内斜角”命令。

在“内斜角”的参数设置对话框中，选择“斜角边缘形状”为“平滑”，调整“宽度”值为17，预览后，如果对刚才设置的效果不满意，可以单击效果窗口中的“i”按钮重新进入设置窗口。

如果想要删除刚才设置的某种效果，可以先选中要删除的效果，让后单击“滤镜”右侧的减号“-”即可。

取消对任何对象的选择，单击“属性”检查器上的“符合画布”按钮。

单击“主要”工具栏的“保存”按钮保存文件。至此，整个心形图案的制作就完成了。

进一步增加效果，美化心形图案

打开heart1。png或heart2。png文件。

选择心形，进行克隆，将两个心的位置调整好。

选择直线工具，绘制一条斜线，在“属性”检查器设置“填充颜色”为“无”，“笔触颜色”设为“#FFCC00”，粗细为“10”。并给斜线添加“内斜角”的效果。

在“层”面板，用鼠标拖动层，来调整各层的叠放关系。

将文件另存为twoheart。png。

【结论】（结果）应用了Fireworks 8的 绘图原理绘制出了“心”形图案。

【小结】了解了Fireworks 8的 绘图原理。

熟练的掌握了绘制路径对象和编辑路径对象的方法、技巧。

掌握了创建矢量图的基本方法及相关工具的使用 。

指导教师评语及成绩：

附件：

实验报告说明

1．实验项目名称：要用最简练的语言反映实验的内容。要求与实验指导书中相一致。

2．实验目的与要求：目的要明确，要抓住重点，符合实验指导书中的要求。

3．实验原理：简要说明本实验项目所涉及的理论知识。

4．实验环境：实验用的软硬件环境（配置）。

5．实验方案设计（思路、步骤和方法等）：这是实验报告极其重要的内容。概括整个实验过程。

对于操作型实验，要写明依据何种原理、操作方法进行实验，要写明需要经过哪几个步骤来实现其操作。

对于设计型和综合型实验，在上述内容基础上还应该画出流程图、设计思路和设计方法，再配以相应的文字说明。

对于创新型实验，还应注明其创新点、特色。

6．实验过程（实验中涉及的记录、数据、分析）：写明具体上述实验方案的具体实施，包括实验过程中的记录、数据和相应的分析。如果实验是计算机上的程序或者设计类的，可提交电子版。但需要有教师的批改记录，并将电子版汇总后刻录在一张光盘上，加上封面。）

7．结论（结果）：即根据实验过程中所见到的现象和测得的数据，做出结论。

8．小结：对本次实验的心得体会、思考和建议。

9．指导教师评语及成绩：指导教师依据学生的实际报告内容，用简练语言给出本次实验报告的评价和价值。

注意：

·实验报告以电子文档形式上交。实验报告将记入平时成绩；

·每次实验开始时，交上一次的实验报告，否则将扣除此次实验成绩。

·教师要及时批改,并反馈给学生。每一学期电子版汇总后刻录在一张光盘上，加上封面。