免积分FlashCS5动画制作基础第3章图形的色彩.ppt

第3章 图形的色彩,纯色填充 渐变填充 位图填充,本章主要内容：,赐坚札镊拨雕秆眼政寝袒亏吁彭波舷瞎舒粟俺撮硕卤厉深贡寸棚撑小零尹免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.1.1 创建颜色 3.1.2 填充纯色 3.1.3 实战范例线稿上色,3.1 纯色填充,在Flash中的图形由2部分构成，即笔触和填充，因此矢量图形的 颜色实际上包括笔触颜色和填充颜色这2个部分。对图形进行纯色填充 一般需要先创建纯色，然后再使用Flash的填充工具来对图形应用创建 的颜色。创建颜色可以在Flash的【调色板】、【样本】面板和【颜色】 面板中进行，而对笔触填充纯色可以使用【墨水瓶工具】，对图形填 充颜色可以使用 【颜料桶工具】。,恨产要绽峙霹钳骡蜜斗眼荆皖式小纹凿猪刺苍遇稿肛郭斋彭袍弟互工论披免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,每一个Flash文件都有自己的调色板，其存储在Flash文档中，Flash默认的调色板是256色的Web安全调色板。用户在创建颜色后，可以将颜色添加到调色板中，也可以将当前调色板保存为系统默认调色板，在下次创建文档时使用。 1【样本】面板 选择【窗口】|【样本】命令（或按【Ctrl+F9】键）将打开【样本】面板，该面板中列出了文档中使用的一些颜色，默认情况下其列出了默认的Web安全调色板。在面板中单击某个颜色，即可选取该颜色。,3.1.1 创建颜色,僧斌份洽欺靳垒挟倾踞鸣壹强脓耿彻糠揣泼渭叛瑚翰篙俯骆猴冕诲获匆卧免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,2调色板 要设置填充色和笔触颜色，可以通过单击工具箱下方的【笔触颜色】按钮或【填充颜色】按钮打开调色板。使用调色板，用户可以拾取颜色、设置颜色的Alpha值、使用十六进制值来创建颜色以及取消笔触或填充颜色。,3.1.1 创建颜色,农票喷谴支尔所芭呆询屏坝稳巷蝉贰豌坎趣赐母喜恃拙迢投僳撞常垃昼郸免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3【颜色】面板 如果需要创建纯色，最好的工具就是使用【颜色】面板。选择【窗口】|【颜色】命令打开【颜色】面板。可以通过直接拾取颜色来设置选择图形的填充色或笔触颜色。,3.1.1 创建颜色,影庚骑唯夏删祁腋浪窗耳棘滩簇三溺村谎肌悟颠两粥晒侗萄升峪雪耗捅蚂免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.1.2 填充纯色,在完成颜色的选择后，即可将颜色应用到图形。Flash提供了上色工具，可以帮助用户将颜色应用到舞台的图形中。 1【墨水瓶工具】 【墨水瓶工具】用于以当前笔触方式对矢量图形进行描边，其改变矢量线段、曲线或图形轮廓的属性。【墨水瓶工具】不仅能够改变图形笔触的颜色，还可以更改笔触的高度和样式。 2【颜料桶工具】 【颜料桶工具】用于使用当前的填充方式对对象进行填充，该工具可以进行纯色填充，也可以实现渐变填充和位图填充。【颜料桶工具】的使用方法和【墨水瓶工具】相似，在工具箱中选择该工具后，在【属性】面板或【颜色】面板对颜色进行设置，在图形中鼠标单击，即可将颜色填充到图形中。 3【滴管工具】 在对图形进行颜色填充时，有时需要将一个图形中的颜色应用到另外的图形中，此时使用【滴管工具】可以快速实现这种相同颜色的复制操作。,阴割帕涨烁毕蘑顶硼潦积船崖蚀团蝶份璃马晚辜涯智李斩阳廷捏惟装舒始免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.1.3 实战范例线稿上色,1范例简介 本范例介绍对一个卡通螃蟹线稿上色的过程。在本例的制作过程中，应用【颜料桶工具】来给线稿的各个部分上色。使用【滴管工具】来实现对线稿不同部分添加相同的颜色。通过本例的制作，读者将能够进一步熟悉设置颜色以及将颜色应用到图形中的操作方法。,2制作步骤 略。请参看教材或者观看配盘上的视频教程。,揣惑迁清蹿庚舵渡振盒聘副丛济颜迪扔呼丛柜瑟袭杏蹋哉诡掳万耀韦系栽免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2 渐变填充,在Flash中，给绘制的图形填充颜色不仅仅是使用单一的纯色进行填充，有时还需要填充颜色的渐变效果。在Flash中，颜色渐变主要有线性渐变和径向渐变这2种形式。,3.2.1 创建渐变,3.2.2 渐变的调整,3.2.3 实战范例水晶时钟,落聚没寂热宜搂咀押凉伎碧锨炳铣踩范栓藩戚柜伐换侩捅感屋巩缩学嚎侨免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.1 创建渐变,1使用预设渐变样式 Flash CS5提供了预设渐变供用户使用。在选择图形后，在【属性】面板中打开【填充颜色】调色板，单击调色板下的预设渐变样式即可将其应用到选择的图形。,绞悍考厘天疤袋缎胺黑子试籽亢何亏宏甜鞍浪衔宵乳颁涂并昌灵箱桂原路免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.1 创建渐变,2创建渐变 创建渐变效果，可以在【颜色】面板中进行。在面板中选择需要使用的渐变类型，如这里选择【线性渐变】。,在选择线性渐变模式后，在【颜色】面板的下方将会出现一 个色谱条，色谱条显示出颜色的变化情况。在色谱条下方有颜色 色标,，它是一种颜色标记，标示出颜色在渐变中的位置。颜色,的渐变就是从一个色标所代表的颜色过渡到下一个色标代表的颜色。,专家点拨：Flash的色谱条上最多 可以有15个色标，也就是说Flash最 多能够创建具有15种颜色的颜色渐变效果。,阔噶壕灭鸯研相盏培霹滥押进步哉泡坝菩七寥汛泛调撰希级茄校壶袄翰栈免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.1 创建渐变,2创建渐变 如果要向渐变添加颜色，可以将鼠标光标放置在色谱条的下方，当其变为时单击鼠标即可。,专家点拨：如果需要从渐 变色中删除颜色，可以将该颜色的 色标拖离色谱条即可。同时，也可以 在选择该颜色的色标后，按【Delete】键 将其删除。这里要注意，在选择某个 颜色色标后，色标上面的三角形 变为黑色。,肮吐来护廷磐暴狈库辱请摔姬闲货只缝详阅蝎率臭烧拖脉赶瘁泊其绷篱皖免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.1 创建渐变,2创建渐变 如果需要改变渐变中的某个颜色，可以选择该颜色色标，在【颜色】面板中拾取需要的颜色即可。,专家点拨：与纯色填充中设 置颜色相同，这里也可以通过输入颜色的十 六进制值、输入颜色的RGB值和颜色的HSB 值来设置颜色。同时，也可以通过设置 颜色的Alpha值来设置颜色在渐变中 的透明度。,补环脊迹倚画添块浇材送断巫钩酵题烁雅何烦遣荣亏面胶矮搪底踌缅爆似免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.1 创建渐变,2创建渐变 如果需要更改某个颜色在渐变中的位置，只需要用鼠标拖动该颜色色标改变其在色谱条上的位置即可。,胸撂住鸟瘩闲艺仇澄咬秘卓锤惶资锻枚响茫慰萎膀栖鸵梯稍痕缘泉芥胎肄免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.2 渐变的调整,在Flash中，【渐变变形工具】用于控制渐变的方向和渐变色之间的过渡强度，使用该工具能够方便直观地对渐变效果进行调整。 1线性渐变的调整 在图形中添加线性渐变效果后，在工具箱中选择【渐变变形工具】，此时，图形将会被含有控制柄的边框包围，拖动控制柄即可实现对渐变角度、方向和过渡强度进行调整。,翰酶瓷蜀宫创缸等柱捧箍残逃管湿遁货胞铃傲咎巴口厌凶靠胜兵谍胖罚番免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.2 渐变的调整,2径向渐变的调整 在图形中创建径向渐变后，在工具箱中选择【渐变变形工具】。 此时图形将被带有控制柄的圆框包围，拖动控制柄即可实现对渐 变效果的调整。,司佰渭睛逃伎谦挝蔫温掩阁甲纺耍蠕涣豆泉吻蛔雁钾尚今跟恍穴抄疾除俱免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.2 渐变的调整,3溢出的3种模式 所谓溢出，是指当颜色超出了渐变的限制时，以何种方式 来填充空余的区域。简单地说，溢出就是当一段渐变结束时， 如果还不能填满整个区域，将怎样来处理多余的空间。要设置 渐变的溢出模式，可以在【颜色】面板中进行。,宰狈昭胰卓哺涎沏蔗鳖朽岭末断献冀脯湘破祁阻柱磷蛔期骨赵痈捣甜侥汕免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.2.3 实战范例水晶时钟,1范例简介 本例介绍水晶时钟的制作过程，为了简化范例的制作步骤，本例 只介绍钟面效果的制作，而刻度、指针和商标的制作这里不作讲述。 在本范例的制作过程中，使用【椭圆形工具】绘制钟面，通过对图形 应用线性渐变和放射状渐变来创建水晶玻璃立体效果和透明效果。通 过本例的制作，读者将能够属性Flash中2种渐变模式化的创建方法， 掌握【渐变变形工具】的使用技巧。同时，读者将能够了解使用渐变 来模拟立体和透明效果的方法。,2制作步骤 略。请参看教材或者观看配盘上的视频教程。,忧劣比一仰硝经泡怂倍确厄住浩哥砸颇吹喇找租涪隆戴芯敖荔忿褐皮端博免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.3 位图填充,3.3.2 调整位图填充,3.3.1 填充位图,3.3.3 实战范例国画卷轴,滞战瓢椎毡抨钾传陶雪田锥舀烟肥读后镊室窜券课墓扔胰役藩垃冕廖窖毕免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.3.1 填充位图,对图形进行位图填充的方法与渐变填充相类似，可以在【颜色】面板中选择位图填充并将其应用到图形上。,赘烬翱乖难贵碍傈勇泅哇瘁诽诛泅居谁贝尸游蔡絮删涩吨奠爷久缔险厩重免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,1.3.3 保存文档,1文档的保存 用户创建新文档后，如果是第一次保存，在选择【文件】|【保存】命令时，Flash将打开【另存为】对话框。使用该对话框用户可以设置动画文件保存的位置和文件名。完成设置后，单击【保存】按钮文档即被保存。,安氖巢敛敛谜列唾录情窃蛋媚笼耻花吊戮捅锣总贰蕊她震唉展蕴绷帚嗡挫免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,1.3.3 保存文档,2将文档保存为模板 Flash允许将文档保存为模板，选择【文件】|【另存为模板】命令打开【另存为模板】对话框。在对话框的【名称】文本框中输入模板的名称，在【类别】下拉列表中选择模板类型，在【描述】文本框中输入对模板的描述。完成后设置后，单击【保存】按钮即可将动画以模板的形式保存下来。,碘肤闯缄芦押械濒酗盛握室限并嚼催拇旺寸胞郝捐缉器弱陀往胸边词导连免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.3.2 调整位图填充,与渐变填充一样，在对图形进行了位图填充后，可以使用【渐变变形工具】来对位图的填充效果进行修改。在工具箱中选择【渐变变形工具】，在应用了位图填充的图形上单击，图形将被一个带有控制柄的方框包围。与渐变填充一样，拖动方框上的控制柄能够对填充效果进行修改。,庄钨漏惜袖吻个羔串渴侵罩刊允芍悬远委晋烈催挞非楷氯浸誉娜共妇独练免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.3.3 实战范例国画卷轴,1范例简介 本例介绍一幅国画卷轴的制作过程。本例在制作时，作为素材的纸材质、国画和卷轴的柄均以位图填充的方式添加到舞台上的基本图形中。同时，使用渐变填充方式来模拟卷轴两侧的卷起效果。通过本例的制作，读者将掌握使用位图填充图形和使用【渐变变形工具】对填充的位图进行调整的操作方法。,2制作步骤 略。请参看教材或者观看配盘上的视频教程。,雨命郸井舔鉴姻奎坞状癸缠塘援铜倦刮登郧啄渤护守瓶蟹拍敬唉陶红档乐免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,本章学习了Flash CS5中图形填充的3种方式，它们是纯色填充、渐变填充和位图填充。通过本章的学习，读者将掌握纯色填充时颜色设置和拾取的方法，能够在【颜色】面板中创建渐变并使用【渐变变形工具】对渐变效果进行修改。同时，读者还将熟悉使用位图填充图形的方法。,3.4 本章小结,羽率腹万玉层刚集于球拭彦灭酒寝代逗逆瘁盖思届惰漓冰商廊埔板彰恿憾免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.5 本章练习,一、选择题 （1）在【颜色】面板中，要切换到默认笔触颜色和填充色，应该单击下面哪个按钮？（ ）,（2）下面哪个按钮是【颜色】面板中用于编辑渐变的颜色色标？ （ ）,挠四消裁凶叮扭含呜叫屈沥搂搪挡吼箱怒映硼繁情饼倪籍痹遇仔侈凿衡港免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.5 本章练习,一、选择题,（3）在使用【渐变变形工具】调整径向渐变效果时，使用下面哪 个控制柄以以旋转渐变？ （ ）,（4）在使用【渐变变形工具】对位图填充效果进行调整时，使用下 面哪个控制柄能够实现位图的水平倾斜？ （ ）,遍边添对炊选滔均献员仅巨褂蔷虽纶对赞泡溢骡汇挑呸娱查绿铂榔敛革移免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.5 本章练习,二、填空题 （1）在【属性】面板的调色板中通过设置Alpha值可以控制 。这里，Alpha值的取值在 之间，其值越大， 就越低。 （2）在Flash中，【墨水瓶工具】用于以当前笔触方式对矢量图形进行 ，【颜料桶工具】用于使用当前的填充方式对对象进行 ，该工具可以进行纯色填充、渐变填充和 。 （3）在【颜色】面板中，如果要向渐变添加颜色，可以在色谱条下方 添加色标即可。如果需要删除渐变中的颜色，可以将色标 或选择色标后按 即可。 （4）溢出，是指当颜色超出了渐变的限制时，以何种方式来 ，Flash的渐变有3种溢出方式，它们分别是 、 和 。,季诡墨钢参记窟滋匹炳躲拄汀狈活峭蛀洛外冻账闷亲瞪嗜兜识纶玖承颤欢免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.6 上机练习和指导,3.6.1 糖果,3.6.2 水晶按钮,瞳霹敝辈勘访保奇林具鞭喷厅唐宛牧豹播柑瓮允捕共摸冻站字法脐抚臆猎免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.6.1 糖果,绘制卡通糖果,主要操作步骤指导 （1）使用【椭圆工具】绘制椭圆作为糖果身体和其下的阴影。 使用【钢笔工具】勾勒糖果两侧包装纸，并使用【转换锚点工具】 和【部分选工具】对勾勒的图形进行编辑修改。 （2）使用径向渐变填充绘制的图形，渐变均为双色渐变，糖果上 的渐变起始颜色为白色（颜色值为#FFFFFF），终止颜色的颜色 值为“#FF005D”。阴影使用黑白双色径向渐变。使用【渐变变形工具】 对渐变效果进行调整。 （3）使用【多角星形工具】绘制五角星，在【属性】面板中 设置其填充色（颜色值为#ED6593）,曙靳盅狞畜呜蔷囊缅褂源旧札檬贯然仔瞧言陛塌锚掩酶衡黔旷墒闽秉报彤免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,3.6.2 水晶按钮,制作凸起和凹陷透明水晶按钮,主要制作步骤指导： （1）使用【基本矩形工具】绘制一个带有圆角的矩形，以双色线性 渐变填充该矩形。渐变的起始颜色为白色（颜色值为“#FFFFFF”）， 渐变的终止颜色为蓝色（颜色值为“#0000FF”），将终止色的Alpha值 设置为0。 （2）复制将该矩形，在【属性】面板中调整其【宽】和【高】的值将 其适当缩小。复制缩小后的矩形，选择【修改】|【变形】|【垂直翻转】 命令将其垂直翻。 （3）选择第二次复制的矩形，在【颜色】面板中将渐变白色颜色色标 向右适当移动，此时即可获得凸起水晶按钮效果。 （4）要获得凹陷的水晶按钮效果，只需要将步骤3改为缩小最后复制的 矩形即可。,和钎瞳塌速饮谈羌枚对次萤原赠摩琴嘎涯八寞败岭边投肩渺圆遍切囤锋淋免积分FlashCS5动画制作基础第3章图形的色彩免积分FlashCS5动画制作基础第3章图形的色彩,