這篇教程為“Flash AS 入門教程”的一部分。查看全套教程>>>>。

　　源文件下載

　　本節(jié)應(yīng)掌握的知識(shí)要點(diǎn)：

　　① startDrag和stopDrag應(yīng)用；②with 語(yǔ)句應(yīng)用；

　　鼠標(biāo)拖拽也是使用比較多的特效形式，這一節(jié)我們將學(xué)習(xí)一個(gè)簡(jiǎn)單的鼠標(biāo)拖拽動(dòng)畫。要學(xué)習(xí)以下幾個(gè)新的語(yǔ)句：

　　startDrag();動(dòng)作，使目標(biāo)影片剪輯在影片播放過程中可拖動(dòng)。語(yǔ)法格式是：

　　myMovieClip.startDrag(lock, left, top, right, bottom)；

　　myMovieClip 要拖動(dòng)的影片剪輯實(shí)例名。

　　Lock 是一個(gè)用true或false表示的布爾值，true指定可拖動(dòng)的影片剪輯鎖定到鼠標(biāo)位置中央，false則為不鎖定。

　　left, top, right, bottom 參數(shù)是 相對(duì)于影片剪輯的父級(jí)坐標(biāo)的值，可以設(shè)置這些值來指定該影片剪輯拖動(dòng)的左、上、右、下的矩形范圍。

　　小括號(hào)中的這些參數(shù)是可選的。

　　stopDrag() 停止拖動(dòng)當(dāng)前影片剪輯（不需要參數(shù)）

　　with 語(yǔ)句，可以在小括號(hào)中指定對(duì)象（比如影片剪輯）作為參數(shù)，并使用大括號(hào)中的語(yǔ)句計(jì)算該對(duì)象中的表達(dá)式和動(dòng)作。使用with語(yǔ)句，可以簡(jiǎn)化代碼的書寫。語(yǔ)法格式是：

　　with (動(dòng)作腳本對(duì)象或影片剪輯的一個(gè)實(shí)例。) {

　　一個(gè)動(dòng)作或一組動(dòng)作。 }

　　請(qǐng)看示例動(dòng)畫“實(shí)例1-9”。

　　>>>>>點(diǎn)擊查看動(dòng)畫效果<<<<<

　　實(shí)例1-9 鼠標(biāo)跟隨

　　這是一個(gè)及其簡(jiǎn)單的鼠標(biāo)拖拽效果，畫面上一串彩色星星隨著鼠標(biāo)的移動(dòng)而翻卷擺動(dòng)，當(dāng)我們點(diǎn)擊一下右下角的按鈕鼠標(biāo)，星星就不再跟隨著鼠標(biāo)移動(dòng)，而定位在了剛才點(diǎn)擊鼠標(biāo)的位置，當(dāng)把鼠標(biāo)滑過按鈕，星星又處于被拖拽狀態(tài)了。實(shí)現(xiàn)這個(gè)效果其實(shí)非常簡(jiǎn)單。

　　看看源文件，庫(kù)中有兩個(gè)影片剪輯和一個(gè)按鈕，xing1是一個(gè)星圖形的移動(dòng)漸隱補(bǔ)間動(dòng)畫，xing2中嵌套了幾個(gè)分別改變了色調(diào)的xing1的實(shí)例。

　　主場(chǎng)景上共3幀，有【按鈕】、【mc】和【as】三個(gè)圖層，【mc】圖層上放置的是xing2影片剪輯，其實(shí)例名為“xing_mc”，【as】圖層上和按鈕實(shí)例上分別添加了如下語(yǔ)句：

　　【as】圖層上的語(yǔ)句：

　　第1幀

　　i = 0;

　　xing_mc._visible = 0;// 設(shè)置影片剪輯不可見

　　xing_mc.startDrag(true,0,0,550,400);

　　//在 (0,0)至 (550,400) 的矩形范圍內(nèi)拖拽xing_mc影片剪輯。

　　第2幀：

　　i = i+1; //變量i每次加1

　　if (i<=36) { //設(shè)置條件i小于或者等于36

　　xin_mc.duplicateMovieClip("xin_mc"+i, i);//以新名稱"xin_mc"+i，層深度為i復(fù)制影片剪輯

　　with (_root["xing_mc"+i]) {//定義數(shù)組對(duì)象_root["xin_mc"+i]為with語(yǔ)句的參數(shù)

　　_rotation = i*20; //設(shè)置新復(fù)制影片剪輯的旋轉(zhuǎn)度數(shù)

　　_xscale = xin_mc._xscale+i*5;//設(shè)置新復(fù)制影片剪輯的橫向縮放比例

　　_yscale = xin_mc._yscale+i*5;//設(shè)置新復(fù)制影片剪輯的縱向縮放比例

　　}

　　} else {

　　i = 0; //如果不滿足if語(yǔ)句里的條件，則i=0

　　}

　　第3幀

　　gotoAndPlay(2);

　　這段程序的流程很簡(jiǎn)單，是前面已經(jīng)學(xué)習(xí)過的知識(shí)，一開始在第1幀定義變量i的初始值為0，設(shè)置場(chǎng)景上的影片剪輯實(shí)例不可見，并在一個(gè)矩形范圍內(nèi)可以由鼠標(biāo)拖拽。

　　第2幀先由表達(dá)式i=i+1將i的值計(jì)算為1，再按照if語(yǔ)句里設(shè)定的條件進(jìn)行判斷，符合當(dāng)i的值小于或等于36條件時(shí)就執(zhí)行大括號(hào)“{}”里面的語(yǔ)句塊，復(fù)制xing_mc影片剪輯，由參數(shù)sing_mc+i計(jì)算出第1次新復(fù)制的影片剪輯名為xing_mc1，并由參數(shù)i分配其層深度為1；再由with里面的語(yǔ)句計(jì)算出讓新復(fù)制的影片剪輯順時(shí)針旋轉(zhuǎn)20度，縱橫向等比例放大5個(gè)百分點(diǎn)。

　　第一次執(zhí)行完后，再由第3幀上的語(yǔ)句指令播放頭返回第2幀，于是再第二次進(jìn)行判斷并復(fù)制影片剪輯，每一次反復(fù)時(shí)i的值遞增1，直至超出設(shè)定的條件后由else里面的語(yǔ)句將變量i重新定義為0。

　　然后再重復(fù)上面的判斷復(fù)制過程，如此反復(fù)。

　　由于在第1幀上設(shè)置了作為復(fù)制父本的影片剪輯由鼠標(biāo)拖拽，而新復(fù)制出的影片剪輯的坐標(biāo)位置默認(rèn)是與父本的坐標(biāo)一致，所以每次新復(fù)制出的影片剪輯的坐標(biāo)位置就會(huì)由當(dāng)時(shí)父本影片剪輯的位置而定，這樣就形成了無數(shù)彩色星星跟隨著鼠標(biāo)翻卷擺動(dòng)的動(dòng)畫效果。

　　第2幀出現(xiàn)了一個(gè)with語(yǔ)句，利用這個(gè)語(yǔ)句，將影片剪輯或其它對(duì)象的引用作為其參數(shù)，可以簡(jiǎn)化程序語(yǔ)句的書寫，不必在大括號(hào)中的每一行語(yǔ)句前面重復(fù)書寫對(duì)象的名稱。

　　如果不用with語(yǔ)句，要為新復(fù)制出的影片剪輯設(shè)置屬性就應(yīng)該寫成：

　　_root["xin_mc"+i]._rotation = i*20;

　　_root["xin_mc"+i]._xscale = xin_mc._xscale+i*5;

　　_root["xin_mc"+i]._yscale = xin_mc._yscale+i*5;

　　當(dāng)用with語(yǔ)句為相同對(duì)象設(shè)置指令時(shí)，語(yǔ)句行越多就越顯其優(yōu)勢(shì)。

　　執(zhí)行了startDrag語(yǔ)句，就可以使指定的影片剪輯在動(dòng)畫播放過程中保持可拖動(dòng)狀態(tài)，一次只能拖動(dòng)一個(gè)影片剪輯。直到執(zhí)行 stopDrag() 停止拖動(dòng)為止。或直到對(duì)其它影片剪輯調(diào)用了 startDrag() 動(dòng)作為止。

　　現(xiàn)在看看按鈕上的語(yǔ)句：

　　on (rollOver) {

　　xing_mc.startDrag(true,0,0,550,400); //鼠標(biāo)滑過按鈕時(shí)拖拽影片剪輯

　　}

　　on (release) {

　　stopDrag(); //點(diǎn)擊按鈕時(shí)停止拖拽當(dāng)前影片剪輯

　　}

　　通過鼠標(biāo)滑過按鈕和點(diǎn)擊鼠標(biāo)，就可以切換xing_mc影片剪輯的拖拽狀態(tài)。

　　課后練習(xí)：素材源文件下載

　　下載課后練習(xí)素材源文件，按照以下要求做一個(gè)鼠標(biāo)拖拽動(dòng)畫：

　　1．動(dòng)畫開始播放時(shí)，將場(chǎng)景上的小松鼠翻轉(zhuǎn)身，由面朝右方變?yōu)槊娉蠓剑ㄌ崾荆嚎s放比例為-100，或者將縮放比例乘以-1）；執(zhí)行拖拽小松鼠影片剪輯，鎖定鼠標(biāo)中心，設(shè)置拖動(dòng)范圍在場(chǎng)景尺寸之內(nèi)；隱藏場(chǎng)景上的小松鼠影片剪輯實(shí)例。

　　2．用if語(yǔ)句定義條件復(fù)制出8個(gè)小松鼠影片剪輯，在with語(yǔ)句內(nèi)設(shè)置新復(fù)制的影片剪輯的橫坐標(biāo)位置按50像素遞增，高度和寬度均按4個(gè)像素遞減。

　　3．在右下角的按鈕上添加語(yǔ)句，實(shí)現(xiàn)當(dāng)鼠標(biāo)點(diǎn)擊按鈕時(shí)停止拖拽小松鼠，并開始在場(chǎng)景范圍內(nèi)拖拽右下角的彩環(huán)；當(dāng)鼠標(biāo)滑過按鈕時(shí)，停止拖拽彩環(huán)，開始在場(chǎng)景范圍內(nèi)拖拽小松鼠。

　　4．提示：別忘了定義并初始化變量；

　　>>>>>點(diǎn)擊查看動(dòng)畫效果<<<<<

　　課后練習(xí)1-9效果：

　　這篇教程為“Flash AS 入門教程”的一部分。查看全套教程>>>>。

最新評(píng)論