WEB動畫制作與設(shè)計課件：對象的編輯與修飾（三）

對象的編輯與修飾對象的編輯與修飾對象的編輯與修飾【案例學(xué)習(xí)目標(biāo)】

使用不同的浮動面板編輯圖形?！景咐R要點】

使用矩形工具繪制花瓣元件，使用顏色面板、變形面板、對齊面板來完成按鈕的制作。【課堂案例】—制作數(shù)字按鈕一、制作按鈕元件1、新建文檔

屬性為：寬度設(shè)為650像素，高度設(shè)為200像素。2、新建元件名稱為“按鈕圖形”，類型為：圖形元件。3、繪制按鈕圖形（1）選擇“橢圓”工具，“筆觸顏色”設(shè)為無，“填充顏色”設(shè)為深紅色（#990000），并在“屬性”面板中將“寬”、“高”選項分別設(shè)置為20。【課堂案例】—制作數(shù)字按鈕一、制作按鈕元件3、繪制按鈕圖形（2）選中該圖形，在“變形”面板中，將“寬度”，“高度”選項設(shè)置為65，單擊“復(fù)制并應(yīng)用變形”按鈕，新復(fù)制出一個圓形，并設(shè)置“填充顏色”設(shè)為白色?！菊n堂案例】—制作數(shù)字按鈕一、制作按鈕元件3、繪制按鈕圖形（3）繪制按鈕高光效果。

【課堂案例】—制作數(shù)字按鈕二、制作花瓣元件1、新建“花瓣”圖形元件2、選擇“矩形”工具，將“筆觸顏色”設(shè)為深紅色（#990000），“填充顏色”設(shè)為粉色（#FFCCCC），在“屬性”面板中將“矩形邊角半徑”選項設(shè)為50，在舞臺窗口中心位置繪制圓角矩形?！菊n堂案例】—制作數(shù)字按鈕二、制作花瓣元件3、雙擊“庫”面板中的“按鈕圖形”元件的圖標(biāo)，進(jìn)入“按鈕圖形”元件的舞臺窗口。單擊“時間軸”面板下方的“插入圖層”按鈕，將“庫”面板中的圖形元件“花瓣”拖曳到按鈕上。并選擇“任意變形”工具，將中心控制點拖曳到控制框下方中間的控制點上?！菊n堂案例】—制作數(shù)字按鈕二、制作花瓣元件4、選擇“變形”面板，將“旋轉(zhuǎn)”選項設(shè)為30，多次單擊“復(fù)制并應(yīng)用變形”按鈕鞋，復(fù)制出多個花瓣圖形。并調(diào)整相應(yīng)圖層的位置。【課堂案例】—制作數(shù)字按鈕三、編輯元件1、導(dǎo)入“按鈕底圖”文件。2、將“庫”面板中的圖形元件“按鈕圖形”拖曳到舞臺窗口中，成為實例，復(fù)制6次按鈕實例并將其水平放置?！菊n堂案例】—制作數(shù)字按鈕三、編輯元件3、選擇“文本”工具T，文字大小為18，文字顏色為白色的字母“One、Two、Three、Four、Five、Six、Seven”。【課堂案例】—制作數(shù)字按鈕【功能】可以將多個圖形按照一定的規(guī)律進(jìn)行排列，并能夠快速地調(diào)整圖形之間的相對位置、平分間距、對齊方向。一、對齊面板

選擇“窗口對齊”命令或按Ctrl+K組合鍵，彈出“對齊”面板，如圖所示。一、對齊面板

1、“對齊”選項組“左對齊”按鈕

：設(shè)置選取對象左端對齊?！八街旋R”按鈕

：設(shè)置選取對象沿垂直線中對齊?！坝覍R”按鈕

：設(shè)置選取對象右端對齊。“頂對齊”按鈕

：設(shè)置選取對象頂端對齊。“垂直中齊”按鈕

：設(shè)置選取對象沿水平線中對齊。“底對齊”按鈕

：設(shè)置選取對象底端對齊。一、對齊面板

2、“分布”選項組“頂部分布”按鈕

：設(shè)置選取對象在橫向上上端間距相等?！按怪本又蟹植肌卑粹o

：設(shè)置選取對象在橫向上中心間距相等?！暗撞糠植肌卑粹o

：設(shè)置選取對象在橫向上下端間距相等?！白髠?cè)分布”按鈕

：設(shè)置選取對象在縱向上左端間距相等?！八骄又蟹植肌卑粹o

：設(shè)置選取對象在縱向上中心間距相等?！坝覀?cè)分布”按鈕

：設(shè)置選取對象在縱向上右端間距相等。一、對齊面板

3、“匹配大小”選項組“匹配寬度”按鈕

：設(shè)置選取對象在水平方向上等尺寸變形（以所選對象中寬度最大的為基準(zhǔn)）?！捌ヅ涓叨取卑粹o

：設(shè)置選取對象在垂直方向上等尺寸變形（以所選對象中高度最大的為基準(zhǔn)）。“匹配寬和高”按鈕

：設(shè)置選取對象在水平方向和垂直方向同時進(jìn)行等尺寸變形（同時以所選對象中寬度和高度最大的為基準(zhǔn)）。一、對齊面板

4、“間隔”選項組“垂直平均間隔”按鈕

：設(shè)置選取對象在縱向上間距相等?！八狡骄g隔”按鈕

：設(shè)置選取對象在橫向上間距相等。5、“與舞臺對齊”選項“與舞臺對齊”按鈕

：選擇此選項后，上述設(shè)置的操作都是以整個舞臺的寬度或高度為基準(zhǔn)的?！竟δ堋繎?yīng)用變形面板可以將圖形、組、文本以及實例進(jìn)行變形。二、變形面板

選擇“窗口>變形”命令或按Ctrl+T鍵，彈出“變形”面板，如圖所示。

“縮放寬度”

和“縮放高度”

選項

：用于設(shè)置圖形的寬度和高度?！凹s束”按鈕

：用于約束“寬度”和“高度”選項，使圖形能夠成比例地變形?！靶D(zhuǎn)”選項

：用于設(shè)置圖形的角度?！皟A斜”選項

：用于設(shè)置圖形的水平傾斜或垂直傾斜?！爸刂七x區(qū)和變形”按鈕

：用于復(fù)制圖形并將變形設(shè)置應(yīng)用給圖形?！叭∠冃巍卑粹o

：用于將圖形屬性恢復(fù)到初始狀態(tài)。二、變形面板任務(wù)一：繪制荷花【操作提示】（1）新建一個Flash文檔，在舞臺上創(chuàng)建一個覆蓋整個舞臺的矩形，并為其填充由淺藍(lán)色到深藍(lán)的線形漸變?！?/p>

舉一反三】任務(wù)一：繪制荷花【操作提示】（1）新建一個Flash文檔，在舞臺上創(chuàng)建一個覆蓋整個舞臺的矩形，并為其填充由淺藍(lán)色到深藍(lán)的線形漸變?！?/p>

舉一反三】任務(wù)一：繪制荷花【操作提示】（2）利用“橢圓工具”和“選擇工具”繪制荷葉，為其填充從淺綠到深綠的徑向漸變色，再將繪制的荷葉群組。（3）利用“線條工具”和“選擇工具”繪制一個荷花的花瓣，為其填充從淺粉紅到深粉紅的徑向漸變色，并將其轉(zhuǎn)換為圖形元件。（4）利用“任意變形工具”和“變形”面板的復(fù)制并變形功能將花瓣制作成荷花，然后使