Fireworks 应用（2）ppt课件

1、第第1515章章 Fireworks Fireworks 运用运用 44.33.4 4 制造弹出菜单制造弹出菜单4.4 绘绘 制制 图形图形4.4.1 绘图工具概览绘图工具概览 图4.39 绘制矢量图形工具4.4.2 绘制页面草图绘制页面草图1什么是页面草图什么是页面草图2页面草图实例页面草图实例轮廓图轮廓图 在在 Fireworks中运用各种绘图工具可以轻松地中运用各种绘图工具可以轻松地进展网页草图的绘制，例如，图进展网页草图的绘制，例如，图4.43 所示的就是所示的就是一个用一个用 Fireworks 绘制的草图。该草图是一个网绘制的草图。该草图是一个网页的轮廓，可以作为进一步设计的根底，

2、也可直页的轮廓，可以作为进一步设计的根底，也可直接作为接作为“跟踪图像来指点网页制造。跟踪图像来指点网页制造。图4.43 页面草图最终效果绘制该页面草图的步骤如下。绘制该页面草图的步骤如下。1新建一个宽度为新建一个宽度为 750 像素、高度为像素、高度为 700 像像素、画布颜色为白色的文档。素、画布颜色为白色的文档。2单击单击“工具面板中的工具面板中的“矩形工具矩形工具 ，设置设置“笔触颜色为笔触颜色为“黑色，黑色，“填充为填充为“无无，拖动绘制一个宽为，拖动绘制一个宽为 740 像素，高为像素，高为 690 像素像素的矩形。的矩形。3拖出两条竖向引导线留意左右对称，拖出两条竖向引导线留意左

3、右对称，然后单击然后单击“工具面板中的工具面板中的“刀子工具刀子工具 ，沿，沿引导线切割，删除中间切割掉的部分，如图引导线切割，删除中间切割掉的部分，如图4.44所所示。示。 第 1 条引导线 第 2 条引导线 删除中间路径 图4.44 切割矩形途径4拖出两条竖向引导线留意左右对称，再拖出两条竖向引导线留意左右对称，再拖出一条程度引导线。单击拖出一条程度引导线。单击“工具面板中的工具面板中的“钢钢笔工具笔工具 ，先在左边的切割点上单击鼠标，然后，先在左边的切割点上单击鼠标，然后在第在第 3 条和第条和第 5 条引导线的交点上单击鼠标左键，条引导线的交点上单击鼠标左键，此时按住鼠标拖出节点的控制

4、柄，拖动控制柄，当此时按住鼠标拖出节点的控制柄，拖动控制柄，当两控制柄处在第两控制柄处在第 5 条引导线上时释放鼠标左键，一条引导线上时释放鼠标左键，一条曲线途径就绘制出来了，如图条曲线途径就绘制出来了，如图4.45 所示。所示。第 3 条引导线 第 4 条引导线 第 5 条引导线 左边切割点 曲线路径终点 图4.45 用“钢笔工具绘制弧线途径5用与步骤用与步骤4一样的方法绘制另一条曲一样的方法绘制另一条曲线途径。线途径。6先用引导线确定中间摆放先用引导线确定中间摆放“标志图案的标志图案的位置，然后单击位置，然后单击“工具面板中的工具面板中的“矩形工矩形工具具 ，在引导线中间绘制一个矩形，并用

5、，在引导线中间绘制一个矩形，并用“文本文本工具工具 在矩形内输入文字在矩形内输入文字“标志图案。标志图案。7单击单击“工具面板中的工具面板中的“线条工具线条工具 ，在标志图案顶端两边绘制两条直线，直到曲线途在标志图案顶端两边绘制两条直线，直到曲线途径终点，如图径终点，如图4.46 所示。所示。 图4.46 用工具绘制图形并输入文字8用用“矩形工具矩形工具 在画布左边绘制一个矩形，在画布左边绘制一个矩形，并用并用“线条工具线条工具 在矩形右侧绘制一条横着的在矩形右侧绘制一条横着的直线和一条竖着的直线，用直线和一条竖着的直线，用“钢笔工具钢笔工具 在竖在竖着直线的上端和矩形右上顶点绘制一条曲线途径

6、，着直线的上端和矩形右上顶点绘制一条曲线途径，用用“指针工具指针工具 框选该步骤绘制的图形后按框选该步骤绘制的图形后按【Ctrl + G】键将其组合，如图】键将其组合，如图4.47 所示。所示。 图4.47 用绘图工具绘制图形 9在组合图形内输入文在组合图形内输入文字字“welcome。 10用用“矩形矩形工具工具 在在刚组合的图形下绘制一个宽刚组合的图形下绘制一个宽度与组合图形一样，高度究度与组合图形一样，高度究竟的矩形，在矩形内绘制几竟的矩形，在矩形内绘制几条直线代表文字，并在条直线代表文字，并在矩形右小角绘制两条曲线途矩形右小角绘制两条曲线途径作为修饰性花边，如径作为修饰性花边，如图图4

7、.48 所示。所示。图4.48 用绘图工具绘制图形 11按【按【Ctrl + S】键保管文件。】键保管文件。12用用“线条工具线条工具 绘制绘制 4 条直线，摆放条直线，摆放在如图在如图4.49 所示的位置。所示的位置。 图4.49 绘制直线并摆放13选择选择“椭圆工具椭圆工具 按住【按住【Shift】键在上】键在上图两条横着的直线中间绘制一个圆，再用图两条横着的直线中间绘制一个圆，再用“刀子刀子工具工具 从圆中间切割，将其左半部分放在如图从圆中间切割，将其左半部分放在如图4.50所示的位置，右半部分删除。所示的位置，右半部分删除。 切割圆后的左半部 第 1 条直线 第 2 条直线 图4.50

8、 切割正圆并摆放14用用“钢笔工具钢笔工具 绘制一条曲线途径，将其绘制一条曲线途径，将其起点放置在上图第起点放置在上图第 1 条直线上，终点与上图的第条直线上，终点与上图的第 2 条条直线终点对齐。直线终点对齐。15绘制一个矩形，在矩形内输入文字绘制一个矩形，在矩形内输入文字“图片，图片，再绘制几条直线，摆放在如图再绘制几条直线，摆放在如图4.51所示的位置。所示的位置。 图4.51 绘制图形并摆放16绘制一个矩形，在矩形内绘制几个由两条短绘制一个矩形，在矩形内绘制几个由两条短直线构成的直线构成的“十字图形，用十字图形，用“文本工具文本工具 在在“十字图形后分别输入十字图形后分别输入“工程工程 1、“工程工程 2等，等，此时的画布如图此时的画布如图4.52 所示。所示。 图4.52 绘制图形并输入文字 17绘制一条直线将其与下面剩下部分分开。绘制一条直线将其与下面剩下部分分开。 18反复步骤反复步骤1517再绘制下面两部再绘制下面两部分，最后得到的效果如图分，最后得到的效果如图4.43 所示。所示。 19按【按【Ctrl + S】键保管文件。】键保管文件。 2 0 绘 制 完 页 面 草 图 后 ， 就 可 以 在 绘 制