邢素萍,楊立力
基于Flash 8.0的色彩控制制作
邢素萍,楊立力
利用Flash 8.0的setRGB語(yǔ)句來(lái)設(shè)置顏色變量,實(shí)現(xiàn)控制背景和場(chǎng)景中“燈”的顏色變化。利用的知識(shí)有:實(shí)體命名;按鈕制作;設(shè)定變量;編輯按鈕腳本。通過(guò)這個(gè)小制作可進(jìn)一步領(lǐng)略Flash中“動(dòng)作”語(yǔ)言在制作動(dòng)畫(huà)效果以及網(wǎng)頁(yè)制作方面的優(yōu)勢(shì)。
影片剪輯、按鈕元件、場(chǎng)景、圖層
首先建立背景影片剪輯和兩種燈的影片剪輯,并且分別進(jìn)行實(shí)體命名;然后建立隱形按鈕,并且覆蓋在場(chǎng)景中的按鈕圖標(biāo)上。最后設(shè)定3個(gè)變量,分別對(duì)應(yīng)3個(gè)影片剪輯實(shí)體,在進(jìn)行按鈕腳本編輯時(shí)通過(guò)setRGB語(yǔ)句來(lái)控制場(chǎng)景中不同實(shí)體的顏色變化,效果展示如圖1所示:
1.1制作按鈕和背景
步驟1 啟動(dòng)Flash 8.0后,單擊【文件】/【新建】,新建一個(gè)Flash文件。單擊繪圖工具欄上的矩形工具,設(shè)置筆觸顏色為“無(wú)”,填充顏色為深綠色。在場(chǎng)景中先拖出一個(gè)矩形來(lái)如圖1所示:
圖1 繪制的矩形
步驟2 單擊選擇繪圖工具箱中的黑色箭頭,選擇繪制的矩形,然后在對(duì)應(yīng)的屬性設(shè)置面板中,如圖2所示:
圖2設(shè)置矩形屬性面板
設(shè)置大小為場(chǎng)景默認(rèn)大小550 px×400px,位置為x=260,y=200,使得矩形正好覆蓋場(chǎng)景。
步驟3 用黑箭頭工具單擊選中矩形,然后選擇【插入】/【轉(zhuǎn)換為元件…】命令,把繪制的矩形轉(zhuǎn)換為名為“底色”,類(lèi)型為“影片剪輯”的元件,將覆蓋在場(chǎng)景中的矩形轉(zhuǎn)化為一個(gè)電影片斷元件如圖3所示:
圖3 把矩形轉(zhuǎn)換為“底色”元件
圖4 “燈1”的布置圖
步驟5 使用【變形】面板,使場(chǎng)景中紅色的圓對(duì)齊如圖5所示:
圖5 對(duì)齊好的圓
全選所畫(huà)的所有的圓,在所有圓都被選中情況下,再次單擊【插入】/【轉(zhuǎn)換為元件…】命令,將這些圓轉(zhuǎn)化(在這里要充分使用【對(duì)齊】面板的對(duì)齊功能如圖6所示:
圖6【對(duì)齊】面板
為一個(gè)電影片段元件,名稱(chēng)為“燈1”。
在轉(zhuǎn)化這些圓為一個(gè)“MC”元件時(shí),由于背景層也是一個(gè)圖形,很容易被選擇上,為了避免選擇上背景矩形,可以把背景層鎖定或者選擇為不可見(jiàn)如圖7和圖8所示:
圖7 鎖定底色層
圖8使底色層不可見(jiàn)
步驟6 再新建一層“圖層3”,改名為“燈層2”,在這一層將剛才繪制的圓復(fù)制一個(gè)過(guò)來(lái)改變填充色為黃色如圖9所示:
圖9 把紅色的圓變成黃色
步驟7 同樣使用【對(duì)齊】面板,讓黃色的圓交叉分布在場(chǎng)景中如圖10所示:
圖10紅黃兩種燈的布置圖
同樣的操作方法,把這些黃色的圓一起轉(zhuǎn)化為一個(gè)電影片斷元件“燈2”。
步驟8 鎖定“燈層1”和“燈層2”,鼠標(biāo)單擊選中“底色層”的背景圖案,選擇【窗口】/【屬性】命令,在【屬性】對(duì)話框中為這個(gè)實(shí)例命名為“cover”,如圖11所示:
圖11 給底色進(jìn)行實(shí)例命名
類(lèi)似上一步,分別在【屬性】對(duì)話框中給另外的兩個(gè)電影片斷元件實(shí)例“燈1”和“燈2”命名實(shí)例名為“l(fā)ight1”和“l(fā)ight2”。
步驟9 新建一層命名為“按鈕”,在這層的第1幀中,先繪制3行顏色圖標(biāo)方框如圖12所示:
圖12 繪制按鈕圖標(biāo)
步驟10 單擊【插入】/【新建元件】新建一個(gè)按鈕元件“按鈕”,在按鈕元件的“單擊”幀單擊鼠標(biāo)右鍵,插入一個(gè)關(guān)鍵幀,在該幀上繪制一個(gè)矩形。選擇該矩形,在屬性面板上設(shè)置矩形大小,使之與先前繪制的矩形大小一致。
為了使按鈕元件與先前繪制的矩形大小一致,可以回到主場(chǎng)景,單擊選擇矩形,在相應(yīng)的【屬性】面板中可以看到矩形大小如圖13所示:
圖13 通過(guò)屬性面板查看對(duì)象大小
再回到按鈕元件中,可以直接在屬性面板中調(diào)整按鈕圖標(biāo)的大小
步驟11 回到主場(chǎng)景,從元件庫(kù)中將按鈕元件拖放到界面中,先覆蓋在一個(gè)顏色圖標(biāo)小方框上,雙擊對(duì)它進(jìn)行編輯,讓它正好覆蓋住一個(gè)方格。再?gòu)脑?kù)中,拖放隱形按鈕到界面中來(lái),分別覆蓋在9個(gè)顏色圖標(biāo)框上。最后布置場(chǎng)景如圖14所示:
圖14 場(chǎng)景中布置的最后效果圖
至此,已做好了顏色變幻的素材,這一部分的內(nèi)容比較靈活,可以自由選擇圖案的形狀和顏色,但仍有一些是在操作中需要注意的地方。
首先,3組圖案要放在不同的層上,在轉(zhuǎn)化為電影片斷元件時(shí),也要注意全選每一組圖案的所有圖形。其次按鈕也放在新的層中,在Flash制作中,要學(xué)會(huì)善于利用多層制作的方法,并能養(yǎng)成較好的習(xí)慣,因?yàn)檫@樣對(duì)于一個(gè)較為復(fù)雜的動(dòng)畫(huà)制作來(lái)說(shuō),是很有必要的,無(wú)論是修改還是增加功能時(shí),都能一目了然。
2.控制顏色變幻的制作
步驟1 在主場(chǎng)景中,再新建一層“動(dòng)作”,然后在第1幀處單擊鼠標(biāo)左鍵,在菜單中選擇【窗口】/【開(kāi)發(fā)面板】/【動(dòng)作】一項(xiàng),打開(kāi)【動(dòng)作】面板。然后在面板中選擇【語(yǔ)句】子菜單【變量】中的【set Variable】選項(xiàng),鼠標(biāo)左鍵雙擊【set Variable】選項(xiàng)如圖15所示:
圖15 建立變量
步驟2 在面板的括號(hào)中填入“mycover”,和“new Color(_root.col1)”,如圖16所示。
步驟3 用同樣方法,創(chuàng)建變量“mycolor1”,在【值】欄中填入“new Color(_root.color1)”,并選中其后面的復(fù)選框如圖16所示:
圖16 設(shè)定變量的表達(dá)式
步驟4 最后得到的第1幀的腳本代碼如下:
set(mycover,new Color(_root.cover));
set(mycolor1,new Color(_root.color1));
set(mycolor2,new Color(_root.color2));
以上腳本的含義是,新定義了3個(gè)Color對(duì)象,它們將分別用來(lái)控制剛才制作的3個(gè)電影片斷元件的實(shí)例。例如,語(yǔ)句中的set(mycolor1,new Color(_root.color1));表示的是“color1”這個(gè)實(shí)例的一個(gè)新的Color類(lèi)的對(duì)象,其他類(lèi)似。
步驟5 鼠標(biāo)單擊選中3行顏色控制按鈕上第一行的第一個(gè)按鈕,然后在【動(dòng)作】面板中添加這個(gè)按鈕的腳本,添加的腳本代碼如圖17所示:
on (release) {
mycover.setRGB(0x00e6b3);
}
圖17 給按鈕添加腳本
步驟6 在控制顏色按鈕第一行也就是控制背景色的按鈕一行,給第二個(gè)按鈕填寫(xiě)腳本,腳本代碼如下:
on (release) {
mycover.setRGB(0x3399e6);
}
步驟7 現(xiàn)在可以來(lái)測(cè)試一下控制效果了,可以看到,通過(guò)按鈕控制顏色的變化,在Flash中就這樣簡(jiǎn)單地實(shí)現(xiàn)了。
3.1關(guān)于設(shè)定變量的詳細(xì)說(shuō)明
要聲明時(shí)間軸變量,可以使用 set Variable 動(dòng)作或賦值(=) 運(yùn)算符。這兩種方法會(huì)產(chǎn)生同樣的結(jié)果。
要聲明本地變量,可以在函數(shù)體內(nèi)部使用 var 語(yǔ)句。本地變量的使用范圍只限于它的代碼塊,它會(huì)在該代碼塊結(jié)束時(shí)到期。沒(méi)有在代碼塊中聲明的本地變量會(huì)在它的腳本結(jié)束時(shí)到期。
要聲明全局變量,可以在該變量名前面使用 _global 標(biāo)識(shí)符。下面的示例會(huì)創(chuàng)建全局變量 myName:
_global.myName = "George";
3.2關(guān)于Cloor對(duì)象的說(shuō)明
Color 對(duì)象能夠設(shè)置影片剪輯的 RGB 顏色值和顏色轉(zhuǎn)換,并且可以在設(shè)置后獲取這些值。必須使用構(gòu)造函數(shù)new Color() 創(chuàng)建 Color 對(duì)象的實(shí)例后,才可調(diào)用其方法。
3.3關(guān)于setRGB()的說(shuō)明
myColor.setRGB(0xRRGGBB)
參數(shù):0xRRGGBB 要設(shè)置的十六進(jìn)制或 RGB 顏色。對(duì)于 RR、GG 和 BB,每種代碼由兩個(gè)十六進(jìn)制數(shù)字組成,這些數(shù)字指定每種顏色成分的偏移量。0x 告知?jiǎng)幼髂_本編譯器該數(shù)字是十六進(jìn)制數(shù)值。
說(shuō)明:其方法是指定 Color 對(duì)象實(shí)例的 RGB 顏色。調(diào)用此方法會(huì)覆蓋由 setTransform 方法設(shè)置的任何以前的設(shè)置。
對(duì)RGB值設(shè)定的時(shí)候,可以借助工具欄上的吸管工具。如果我們想要設(shè)置一種顏色,可以在Color工具欄上,選擇這種顏色,上面的數(shù)值框中顯示的數(shù)字,就是在腳本中為它設(shè)置該顏色所需要的參數(shù)如圖18所示:
圖18 如何確定顏色的RGB值
本文主要介紹了“動(dòng)作”中的setRGB顏色設(shè)置的用法,腳本語(yǔ)句本身沒(méi)有太大的難度,卻可以實(shí)現(xiàn)很好的制作效果,通過(guò)按鈕控制背景以及場(chǎng)景中“燈”的顏色,這有點(diǎn)像紅綠燈。通過(guò)這個(gè)例子的制作可進(jìn)一步領(lǐng)略Flash中“動(dòng)作”語(yǔ)言在制作動(dòng)畫(huà)效果以及網(wǎng)頁(yè)制作方面的優(yōu)勢(shì)。本文對(duì)時(shí)間軸中的幀沒(méi)有做任何操作,只是通過(guò)按鈕來(lái)控制各個(gè)圖層。對(duì)影片剪輯進(jìn)行實(shí)例命名,這樣才能通過(guò)按鈕腳本控制。以后的例子中將更多地體現(xiàn)這一點(diǎn)。
通過(guò)本例的學(xué)習(xí),可以類(lèi)似地制作紅綠燈控制、變色龍的變色等動(dòng)畫(huà)。
[1] 《Flash 8 中文版實(shí)用教程》李敏 [M]機(jī)械工業(yè)出版社2009年2月
[2] 《Flash 8動(dòng)畫(huà)與交互動(dòng)畫(huà)制作教程》潘明寒 [M]北京航空航天大學(xué)出版社 2008年1月
[3] 《Flash8.0中文版動(dòng)畫(huà)制作》林華 姜靈敏 [M]華南理工大學(xué)出版社 2007年8月
《微型電腦應(yīng)用》期刊簡(jiǎn)介
(MICROCOMPUTER APPLICATIONS)
《微型電腦應(yīng)用》期刊是由上海市微型電腦應(yīng)用學(xué)會(huì)主辦,上海交通大學(xué)等單位協(xié)辦,并經(jīng)國(guó)家科技部和國(guó)家新聞出版署批準(zhǔn)的電子信息科技和信息化建設(shè)與應(yīng)用的科技期刊。
本刊己入選:
* 國(guó)家科技部中國(guó)科技論文統(tǒng)計(jì)源期刊(中國(guó)科技核心期刊);
*《中國(guó)期刊網(wǎng)》、《中國(guó)學(xué)術(shù)期刊(光盤(pán)版)》全文收錄期刊;
* 中國(guó)學(xué)術(shù)期刊綜合評(píng)價(jià)數(shù)據(jù)庫(kù)來(lái)源期刊;
* 中國(guó)科學(xué)引文數(shù)據(jù)庫(kù)、中國(guó)科學(xué)計(jì)量指標(biāo)數(shù)據(jù)庫(kù)來(lái)源期刊;
* 華東地區(qū)優(yōu)秀期刊;上海市優(yōu)秀科技期刊。
本刊己被復(fù)旦大學(xué)、上海交通大學(xué)、同濟(jì)大學(xué)、東華大學(xué)等著名大學(xué)遴選為計(jì)算機(jī)及相關(guān)學(xué)科的核心期刊目錄。
本刊創(chuàng)刊于1985年1月,得到了中央領(lǐng)導(dǎo)、計(jì)算機(jī)業(yè)界和廣大讀者的支持和厚愛(ài),江澤民親自題寫(xiě)刊名,許多著名的兩院院士為該刊撰稿。
《微型電腦應(yīng)用》期刊組織機(jī)構(gòu):
期刊理事會(huì)理事長(zhǎng):何友聲院士
特約顧問(wèn):孫鐘秀院士 倪光南院士 萬(wàn) 鋼教授 朱寄萍教授級(jí)高工
嚴(yán)雋琪教授(女) 吳啟迪(女)
編委會(huì)名譽(yù)主任:何友聲院士 吳啟迪教授(女) 朱寄萍教授級(jí)高工 陳亞珠院士(女)
編委會(huì)名譽(yù)主編:吳啟迪教授(女)
編委會(huì)主任兼主編:朱仲英教授
國(guó)際刊號(hào):ISSN 1007-757X, 國(guó)內(nèi)刊號(hào):CN31-1634/TP。
URL: http://wxdnyy.periodicals.net.cn;http://wxdy.chinajournal.net.cn;
《微型電腦應(yīng)用》期刊為月刊,由中國(guó)科協(xié)全國(guó)省級(jí)“學(xué)會(huì)之星”、上海市科協(xié)“三星級(jí)”學(xué)會(huì)、上海市民政局、市社團(tuán)局“四A”級(jí)社會(huì)組織-----上海市微型電腦應(yīng)用學(xué)會(huì)主辦。國(guó)內(nèi)外公開(kāi)發(fā)行,郵發(fā)代號(hào):4-506,訂價(jià):10元/冊(cè),全年120元。歡迎到郵局訂閱,或向編輯部訂閱。
聯(lián)系地址:上海市華山路1954號(hào)上海交通大學(xué)內(nèi)鑄鍛樓314室,郵編:200030。
電話/傳真:021-62933230 E-mail:smcaa@sjtu.edu.cn smcaa@online.sh.cn
《微型電腦應(yīng)用》編輯部
Flash 8.0-based Color Control Production
Xing Suping,Yang Lili
(Computer and Software Institute ,Nanjing Institute of Industry Technology, Nanjing210046,China)
Using the Flash 8.0 setRGB statement to set the color variables, control background and the scene of "light" color change. The use of knowledge: entities named, button making, setting variables, edit button script. A taste of the action in the Flash language produced animation and web production advantages through this small production.
Movie Clip, Button Symbols, Scenes, Layers
TP311
A
1007-757X(2014)01-0061-03
2013.12.01)
邢素萍,南京工業(yè)職業(yè)技術(shù)學(xué)院 教授 研究方向 計(jì)算機(jī)應(yīng)用與多媒體教學(xué),南京,210046楊立力,南京工業(yè)職業(yè)技術(shù)學(xué)院 講師 研究方向 多媒體技術(shù),南京,210046