推薦：Flash教程:花吃蝴蝶的動畫演示(1)
非常不錯的一個Flash逐幀動畫制作教程，大家假如喜歡可以練習下！教程作出來的效果，那花的動作感覺有點滑稽，這個是一個Flash逐幀動畫制作的教程，每一幀都需

flash小游戲相信很網(wǎng)友都玩過，有沒有想過自己制作一個呢？本教程教用Flash工具設計開發(fā)一個青蛙跳荷葉的小游戲，作者提供了制作的思路，還有步驟效果的源代碼，對我們的學習很有利，希望大家能喜歡~

　　先看看游戲的最終效果：

預覽效果

　　制作步驟：

　　一、青蛙跳動起來。
　　二、往返移動的荷葉。
　　三、修改“往返移動的荷葉”。
　　四、跳上荷葉。
　　五、背景的移動。
　　六、更像是跳到荷葉上。
　　七、加上開始，結(jié)束。
　　八、增加游戲的可玩性（吃小蟲）。
　　九、添加平面，效果。

　　一、青蛙跳動起來

　　先完成的當然就是青蛙的跳動了，因為我們是以俯視的的角度，所以高低的狀態(tài)就是尺寸的大小，移動就是y坐標的減。效果及源代碼下載：

效果1

　　代碼及相關注釋：

　　//游戲的最大深度，后面會用的，要設一下最大的嘗試，因為我們用到一個鼠標拖動。
　　var numMaxDepth:Number = 1000;
　　//跳動的過程############################
　　//青蛙mc名稱
　　var mcPlayer:MovieClip;
　　//移動
　　function playerMove() {
　　//這是自定義的一個從初使值到最高值，再以同樣的增量回到初值的類,要結(jié)合onEnterFrame循環(huán)來移動。
　　//new casUpTopDown(10) 移動次數(shù)
　　mcPlayer.objUpTopDown = new casUpTopDown(10);
　　//速度
　　mcPlayer.numSD = 10;
　　//什么時候開始
　　mcPlayer.numStar = 100;
　　//青蛙移動的速度
　　mcPlayer.numMoveSd=4
　　//循環(huán)來移動
　　mcPlayer.onEnterFrame = function() {
　　if (this.objUpTopDown.run() != 0) {
　　this._xscale = this._yscale=(this.numStar this.objUpTopDown.run()*this.numSD);
　　this._y-=this.numMoveSd
　　} else {
　　//釋放資源
　　delete (this.onEnterFrame);
　　delete (this.objUpTopDown);
　　delete (this.numSD);
　　delete (this.numStar);
　　delete (this.numMoveSd);
　　}
　　};
　　}
　　//
　　//鼠標#############################
　　//mouseStyle, 鼠標樣式
　　_root.attachMovie("mouse", "mouseStyle", numMaxDepth);
　　var objMouse:Object = new Object();
　　// onMouseDown、onMouseMove、onMouseUp 和 onMouseWheel
　　objMouse.onMouseDown = function() {
　　//trace("按下");
　　};
　　objMouse.onMouseMove = function() {
　　//trace("移動");
　　_root.mouseStyle._x = _xmouse;
　　_root.mouseStyle._y = _ymouse;
　　};
　　objMouse.onMouseUp = function() {
　　//trace("松開");
　　playerMove();
　　};
　　Mouse.hide();
　　Mouse.addListener(objMouse);

　　casUpTopDown.as

　　class casUpTopDown {
　　//
　　var numV:Number = 0;
　　//最大次數(shù)
　　var numMax:Number;
　　//
　　var numFx:Number = 1;
　　//是否反方向
　　var isFx:Boolean = false;
　　//
　　function casUpTopDown(numMax:Number){
　　this.numMax=numMax
　　}
　　//
　　function run() {
　　if (numV 1 numV ;
　　return numV
　　} else {
　　if (numV-1>0) {
　　isFx = true;
　　numV--;
　　return numV
　　}else{
　　return 0
　　}
　　}
　　}//end fun
　　}

　　二、往返移動的荷葉

　　效果及源代碼下載：

效果2

　　現(xiàn)在我們來做游戲中另一個主要的元素：移動的荷葉，我們先讓它往返移動起來。我們在"青蛙跳動起來”的代碼上加入：

　　1.把所有程序生成的荷葉都放在一個容器里：
　　var mcHys:MovieClip = _root.createEmptyMovieClip("mcHys", 999);

　　2.這個mc里設置一些公有屬性：
　　//行距
　　mcHys.numHJ = 80;
　　//尺寸
　　mcHys.numWH = 58;
　　//下移速度
　　mcHys.numDownSd = 4;
　　//隨機起始的時間
　　mcHys.arrMoveStarTime = [0, 48, 60, 20, 48];

　　其中：mcHys.swapDepths(mcPlayer);
　　目的是把荷葉容器mcHys的與mcPlayer的深度交換。因為青蛙要在荷葉的上面。

　　3.寫入荷葉
　　用了兩個函數(shù)：
　　復制一批荷葉：getSomeHy(numCount:Number, mcHys:MovieClip)
　　設置每個荷葉的行為：setHeYeMove(mcHy:MovieClip, numSD:Number, numStarTime:Number)
　　//初使化荷葉
　　getSomeHy(4, mcHys);

　　注：這些方法在后來都會修改，我們現(xiàn)在的目的只是把要完成的目標完成了，修改是后面的事。

　　//移動的荷葉############################
　　function setHeYeMove(mcHy:MovieClip, numSD:Number, numStarTime:Number) {
　　mcHy.objUpTopDown = new casUpTopDown(480);
　　mcHy.numSD = numSD;
　　mcHy.numStar = mcHy._x;
　　//什么時候開始
　　mcHy.numStarTime = numStarTime;
　　mcHy.onEnterFrame = function() {
　　if (this.numStarTime--<0) {
　　if (this.objUpTopDown.run() == 0) {
　　this.objUpTopDown.isFx = false;
　　}
　　this._x = (this.numStar this.objUpTopDown.run()*this.numSD);
　　}
　　};
　　}
　　//荷葉容器
　　var mcHys:MovieClip = _root.createEmptyMovieClip("mcHys", 999);
　　mcHys.swapDepths(mcPlayer);
　　//行距
　　mcHys.numHJ = 80;
　　//尺寸
　　mcHys.numWH = 58;
　　//下移速度
　　mcHys.numDownSd = 4;
　　//隨機起始的時間
　　mcHys.arrMoveStarTime = [0, 48, 60, 20, 48];
　　//復制一批
　　function getSomeHy(numCount:Number, mcHys:MovieClip) {
　　for (var numI:Number = 0; numI var mcTem:MovieClip = mcHys.attachMovie("hy", "mcHy" numI, numI);
　　mcTem._y = (Stage.height-mcHys.numWH)-numI*(mcHys.numHJ mcHys.numWH);
　　mcTem._width = mcTem._height=mcHys.numWH;
　　setHeYeMove(mcTem, 1, getNoSameRandNum(mcHys.arrMoveStarTime));
　　}
　　//end for
　　}
　　//初使化荷葉
　　getSomeHy(4, mcHys);
　　//

　　三、修改"往返移動的荷葉"

　　我們發(fā)現(xiàn)我們寫出來的荷葉，并不是我們想要的，如里每一行只有一個荷葉的話，青蛙的選擇就很少了。所以我們應該在每一行放置若干個荷葉。效果及源代碼下載：

效果3

　　我們主要是修改：移動的荷葉 setHeYeMove(mcHy:MovieClip, numSD:Number, numStarTime:Number, numLeftRight:Number) 和復制一批：function getSomeHy(numCountI:Number, numCountJ:Number, mcHys:MovieClip) 這個兩個函數(shù)：

　　1) setHeYeMove主要修改的部分就是荷葉移動的狀態(tài)：目前在于每組荷葉與其它荷葉是交替往返移動。我們在這里定義了一個數(shù)組：
　　//隨機起始的時間
　　mcHys.arrMoveStarTime = [0, 48, 60, 20, 48];
　　配合：
　　//獲得不相同的隨機數(shù)
　　function getNoSameRandNum(arrA:Array)
　　來隨機改變荷葉的移動的起始時間。來完成作到這一點。

　　2) getSomeHy主要作用就是生成一個幾行幾列對隊列。不知讀者有沒有發(fā)現(xiàn)：假如不按鼠標，青蛙就會隨著荷葉往返移動，似乎就停在上面。因為我們加了初使化語句：

　　onEnterFrame不停的指定的：青蛙的坐標等于荷葉的坐標。

　　//青蛙附上第一個荷葉
　　mcPlayer.onEnterFrame = function() {
　　this._x = mcHys.mcHy0_1._x;
　　this._y = mcHys.mcHy0_1._y;
　　};

　　四、跳上荷葉

　　效果及源代碼下載：

效果4

　　要讓青蛙跳上荷葉，而且要隨著荷葉移動。我們只要作到：青蛙的坐標等于荷葉的坐標;然后我們還要檢測青蛙是否跳上荷葉呢？這個檢測代碼很顯然要放在青蛙移動的代碼之中： playerMove()。加入：

　　//檢測跳上
　　//
　　for (var mcI in _root.mcHys) {
　　if(this.hitTest(_root.mcHys[mcI])){
　　//貼上
　　this.onEnterFrame=function(){
　　this._x=_root.mcHys[mcI]._x
　　this._y=_root.mcHys[mcI]._y
　　}
　　break;
　　}
　　}

　　注：這里的檢測效率不高，因為我們是檢測所有的荷葉是否碰到青蛙，很顯然，我們只要檢測青蛙上一行的荷葉就可以了，這里的代碼沒有寫出來。有愛好的讀者可以自己修改。

　　五、背景的移動

　　效果及源代碼下載：

效果5

　　現(xiàn)在青蛙可以跳上荷葉，可是只能在這小范圍運動，我們要讓青蛙走的更遠。如何移動背景呢？只要把荷葉容器mcHys的Y坐標遞增，看上去青蛙就向上移動了。把： playerMove()中的this._y -= this.numMoveSd;
　　修改為：
　　//移動背景
　　_root.mcHys._y = this.numMoveSd;

　　背景移動了：
　　最忘了復制一行新的荷葉
　　getOneHy(3, mcHys);
　　當然也不要忘了刪除跳過的荷葉：（后面的版本會加上這個）

　　注：讀者會發(fā)現(xiàn)：getSomeHy這個函數(shù)不見，而換成了一個：getOneHy，因為筆者發(fā)現(xiàn)在復制一行要比復制幾行的功能更適合，這個游戲。

　　六、更像是跳到荷葉

　　效果及源代碼下載：

效果6

　　我現(xiàn)在的青蛙可以跳上荷葉了，不過問題是似乎不太逼真：青蛙總是落在荷葉的正中，而且從就自算青蛙落在荷葉的邊上也會變到荷葉的正中，所以我們要修正它：

　　我們還是要修改：playerMove()這個函數(shù)：

　　//檢測跳上
　　//
　　for (var mcI in _root.mcHys) {
　　if (this.hitTest(_root.mcHys[mcI])) {
　　//
　　var numTemPlayHeCha:Number = this._x-_root.mcHys[mcI]._x;
　　//
　　getOneHy(3, mcHys);
　　//貼上
　　this.onEnterFrame = function() {
　　//移動荷葉中心_x
　　this._x = _root.mcHys[mcI]._x numTemPlayHeCha;
　　//end if
　　//移動荷葉中心_y
　　if (this.numOnHysY != _root.mcHys[mcI]._y) {
　　if ((this.numOnHysY-this.numToHySd)>_root.mcHys[mcI]._y) {
　　_root.mcHys._y = this.numToHySd;
　　mcPlayer.numOnHysY -= this.numToHySd;
　　} else {
　　var temaaa:Number = Math.abs(mcPlayer.numOnHysY-_root.mcHys[mcI]._y);
　　_root.mcHys._y = temaaa;
　　mcPlayer.numOnHysY -= temaaa;
　　}
　　//end if
　　}
　　//end if
　　};
　　break;
　　}
　　}
　　程序思路：分別處理青蛙的x坐標和y坐標：

　　1)青蛙落在荷葉哪一個部位，就在這停在荷葉的哪個部位。
　　this._x = _root.mcHys[mcI]._x numTemPlayHeCha;
　　2)青蛙y坐標慢慢移動到荷葉的y坐標。為什么一定要移動到荷葉的y坐標，因為青蛙跳的距離是一定的。青蛙跳上荷葉不一定是會是最佳位置，所以要修正，不然后多跳幾次，發(fā)現(xiàn)青蛙根本跳不到下個荷葉，不信的讀者可以試一下。

　　七、加上開始，結(jié)束

　　1)到目前為止我們的青蛙還可以"漂”在水中，即使不跳到荷葉上。
　　2)刪除跳過的荷葉(上文提到的)

　　效果及源代碼下載：

效果7

　　八、增加游戲的可玩性（吃小蟲）。

　　這個游戲大致最算做完了，只是覺得沒有什么游戲性，那我們再加一個元素小蟲，隨機在荷葉中出現(xiàn)小蟲，假如青蛙跳上有小蟲的荷葉，就加10分。效果及源代碼下載：

效果8

　　程序思路：

　　1)要在荷葉上出現(xiàn)小蟲最簡單的方法就是在mc荷葉符號,里加入一個圖層，入一個mc的小蟲,并命名一個名字。
　　2)在產(chǎn)生荷葉的代碼中加一個隨機數(shù)。來判定是否顯示,假如顯示就設置所產(chǎn)生的荷葉中的"小蟲"電影符號的alpha值為100,否則為0。
　　3)在判定青蛙是否跳上荷葉的代碼處加入一段代碼：來判定當前的荷葉的小蟲"電影符號的alpha值,假如是100就證實有小蟲,分數(shù)加1。（分數(shù)我們可以一個_root.變量來存儲）

　　九、添加平面，效果

　　效果：

最終效果

分享：用Flash AS制作逼真的下雨動畫效果
Flash教程：用FlashAS制作逼真的下雨動畫效果先看下效果：（附.swf文件）制作過程一、新建一圖層，大小隨意；二、新建元件（影片剪輯）：1、制作雨滴并下