点击这里给我发消息 点击这里给我发消息
首页 > 行业资讯 > flash>详细内容

Flash游戏开发实例系列:迷宫篇

添加时间:2010-1-5
    相关阅读: 设计 开发 技术 页面 程序 flash 链接

效果预览图:

效果图

  源文件下载:点击这里进入下载页面

游戏背景:

  在暮色中,一支坦克小分队要去消灭敌人的飞机场,但途中陷入了敌人设置的一个迷宫里。玩家的任务就是带领这只小分队走出该迷宫,到达敌人的飞机场后,任务即完成。

游戏简介:

  迷宫游戏是一种经久不衰的游戏,其玩法也很简单,就是从起点开始找到出口。传统的迷宫游戏只能通过复杂的地图,多种出路组合来吸引玩家的兴趣。而本例中的这个迷宫游戏则不同,因为它的地图是随机生成的,这样就大大地增强了游戏的可玩性。这也是该游戏设计最有吸引力的地方。

  为了考虑到大部分读者,游戏并没有被设计的多复杂。但游戏的制作方法很容易掌握,读者学会后,可自行设计出更加复杂的迷宫游戏。

游戏玩法:

  游戏的玩法很简单。玩家只要通过敲击键盘上的方向键来控制“坦克”前进和后退,只到接触到“飞机”,游戏结束。单击“继续任务”按钮则可重新开始游戏。

游戏定义:

  在设计游戏前,总需要考虑这样几个问题,游戏环境的形成、规则的创建以及如何编写游戏的代码。但幸运的的是,这个迷宫游戏定义起来并不复杂。

  1.游戏环境。首先要考虑的是游戏在怎样的一个环境中进行。这是实现一个简单的顺序游戏最关键的部分。该游戏中,使用Array(数组)对象来控制实现迷宫的动态生成。这一点确保了游戏的可玩性。在其它游戏中,设计中也可以通过载入地图的方法来实现游戏的多样性。

  2.控制方法。玩家如何控制游戏中的角色,操作是否方便有决定了游戏的可玩性。设计者可以通过许多行为方法来控制游戏主角的运动。该游戏中,只要使用简单的随机行为就可以了,即使游戏主角的位置发生一定的便宜。玩家可以通过键盘的触发时间来控制游戏中主角——“坦克”的运动。

  3.游戏结束。其实,游戏中最困难的事情之一是如何来判定玩家的胜利和游戏的结束。主角碰壁则不难实现,使用hitTest碰撞检测就能轻松解决问题。庆幸的是,这个游戏中也能通过碰撞检测技术来判断“坦克”是否到达了出口,即是否碰到了飞机。

制作步骤:

  新建一个Flash文档,单击“属性”面板中的“尺寸”按钮,打开“文档属性”面板设置场景大小为,540px x 400px背景为黑色,帧频为12fps。如图1所示。在游戏制作之前,为了让大家对该游戏能有一个整体的感觉,也为方便以后的设计,我们先来看看游戏场景中层与帧的布置与设计。如图2所示。

图1

图2

? 设计元件

  1.游戏主角。游戏主角就是由玩家来操作的游戏角色。按快捷键Ctrl+F8打开“新建元件”面板新建一个名为“坦克”的影片剪辑元件。如图3所示。在“坦克”元件的场景中按快捷键Ctrl+R打开“导入”面板,导入一个坦克图片,如图4所示。在“属性”面板里设置“坦克”的高和宽都为24px。

图3

图4

  2.按快捷键Ctrl+L打开“库”面板,把库中的“坦克”元件拖入到“场景1”中。点选场景中的“坦克”元件,在“属性”面板命名其实例名为tank。如图5所示。接着点选场景中的“坦克”元件,按快捷键F9打开的“动作”面板并键入如下代码。

图5

// 按下任意键执行
onClipEvent (keyDown) {
// 纪录被敲击的键
 kd = Key.getCode();
// 如果没有碰到“飞机”元件
 if (!this.hitTest(_root.plane)) {
  cell = new Array();
  cell = fun_cellwall(_root.tankX, _root.tankY);
// 如果敲击右方向键
  if (kd == Key.RIGHT) {
// 如果通道畅通则移动“坦克”元件
   if (cell[0] == false) {
    _root.tankX++;
    this._x += 30;
   }
// 跳转到“坦克”元件的第4帧并停止播放
  gotoAndStop(4);
  } else if (kd == Key.DOWN) {   
   if (cell[1] == false) {
    _root.tankY++;
    this._Y += 30;
   }
  gotoAndStop(1);
  } else if (kd == Key.LEFT) {   
   if (cell[2] == false) {
    _root.tankX--;
    this._x -= 30;
   }
  gotoAndStop(2);
  } else if (kd == Key.UP) {
   if (cell[3] == false) {
    _root.tankY--;
    this._Y -= 30;
   }
  gotoAndStop(3);
  }
// 检测游戏是否碰撞“飞机”元件,有则跳转到第6帧
  if (this.hitTest(_root.plane)) {
   _root.gotoAndStop(6);
// 隐藏“飞机”元件
   _root.plane._visible = 0;
   }
 }
 // 定义fun_cellwall函数
 function fun_cellwall(a, b) {
  cw = new Array();
  for (i=0; i<_root.Maze.length; i++) {
   if (_root.Maze[i][4] == a && _root.Maze[i][5] == b) {
    cw = _root.Maze[i];
    return cw;
   }
  }
}
}

  如图4所示,选中“坦克”元件中按快捷键F6插入3个关键帧。按快捷键Ctrl+T打开“变形”面板把“坦克”元件换个方向。如图6所示。4帧中坦克面向分别为下、左、上、右。

图6

  3.迷宫出口。迷宫的出口是一架飞机,也就是故事梗概中敌人的机场^O^。只要“坦克”碰撞到飞机,则任务完成。新建一个“飞机”影片剪辑元件,从“库”面板中拖入到“场景1”中。在场景中点选该元件在“属性”面板中命名其实例名为“plane”。

  4.重玩设置。无论什么游戏,都需要有一个重玩的机制。制作一个按钮,按钮在按钮场景中用“文本”工具写上“继续任务”四个字。

 5.制作迷宫。前面笔者已经讲过,游戏中的迷宫完全是随机生成的。设计者所要做的工作就是给程序提供组成迷宫的四个线段。如图7所示,创建4个“线段”影片剪辑元件。元件创建好后,点选“线条”工具,在“线段1”的场景里绘制一条直线,点选绘制好的直线,如图8所示设置其“属性”面板。其它3个“线段”元件的设置方法和“线段1”一样,只是位置不一样。“线段2”的“属性“面板设置如图9所示,其宽为30px,Y轴的距离为15px。“线段3”宽度宽高和“线段1”一样,只是X轴的坐标为15px。“线段4”宽度宽高和“线段2”一样,只是Y轴的坐标为-15px。

图7

图8

图9

  6.按快捷键Ctrl+L打开“库”面板,右键单击库中的“线条1”元件,在弹出的菜单中选择“链接...”命令。如图10所示设置“链接属性”面板,给声音文件起个标识符名为“w1”,以便以后调用。其它三个“线段”元件的标识符分别为“w2”、“w3”和“w4”。

图10

? 设置主场景

  1.按快捷键Ctrl+E回到“场景1”。双击“图层1”的文字,将其改名为“飞机”。在该层的第4帧按F7键插入一个空白关键帧。从库中将“飞机”元件拖到场景上任意位置,并在“属性”面板设置其实例名为“plane”。

  2.如图2所示新建一个“坦克”层,该层的作用是放置游戏开始信息和“坦克”元件的。在该层第1帧中输入文字“游戏载入中 请稍等:)”。在第4帧插入一个空白关键帧,从库中将“坦克”元件拖到场景中,并在“属性”面板中设置其实例名为tank。在第6帧上按F5键插入帧。

  3.如图2所示创建一个“脚本”层。选中该层的第3帧插入一个空白关键帧。点选第3帧,按快捷键F9打开“动作”面板,键入如下代码。

// MazeH和MazeW是地图的高和宽,地图大小和复杂程度由这两个变量控制
MazeH = 12;
MazeW = 12;
// 定义变量TotalCells,其值为迷宫的面积,控制着迷宫所能容纳“线条”元件的数量
TotalCells = MazeH*MazeW;
// 定义一个新的数组Maze
Maze = new Array();
for (i=0; i<TotalCells; i++) {
// 定义两个新数组Room和Cell
 Room = new Array();
 Cell = new Array();
// 使用数组对象中的Push方法将数据添加到数组元素中,i/MazeW为取整,i%MazeW取余数
 Cell.push(true, true, true, true);
 Cell.push(int(i/MazeW));
 Cell.push(i%MazeW);
 Room.push(Cell);
 Maze.push(Room);
}
while (true) {
roomNum = random(Maze.length);
cellNum = random(Maze[roomNum].length);
// 取三个随机数
wallNum = random(4);
// 判断Maze数组的元素[roomNum][cellNum][wallNum]的值是否为假,如果为假,进行下一步循环
if (Maze[roomNum][cellNum][wallNum] == false) {
  continue;
 }
// 判断“线段”元件的编号,执行相应的操作
x = Maze[roomNum][cellNum][4];
y = Maze[roomNum][cellNum][5];
if (wallNum == 0 and x == mazeW-1) {
  continue;
} else if (wallNum == 1 and y == mazeH-1) {
  continue;
} else if (wallNum == 2 and x == 0) {
  continue;
 } else if (wallNum == 3 and y == 0) {
  continue;
 }
oppsCell = new Array();
// 根据不同“线段”元件的编号分别调用参数不同的函数,fun_findcell为自定义函数
if (wallNum == 0) {
  oppsCell = fun_findcell(x+1, y);
 } else if (wallNum == 1) {
  oppsCell = fun_findcell(x, y+1);
 } else if (wallNum == 2) {
  oppsCell = fun_findcell(x-1, y);
 } else if (wallNum == 3) {
  oppsCell = fun_findcell(x, y-1);
 }
 if (oppsCell[0] == roomNum) {
  continue;
 }
// 使迷宫地图能够产生一个通道
 if (wallNum == 0) {
  oppsWall = 2;
 } else if (wallNum == 1) {
  oppsWall = 3;
 } else if (wallNum == 2) {
  oppsWall = 0;
 } else if (wallNum == 3) {
  oppsWall = 1;
 }
// 用四个墙壁将空间封闭
 Maze[roomNum][cellNum][wallNum] = false;
 Maze[oppsCell[0]][oppsCell[1]][oppsWall] = false;
 Maze[roomNum] = Maze[roomNum].concat(Maze[oppsCell[0]]);
 Maze.splice(oppsCell[0], 1);
 //
 if (Maze.length == 1) {
  break;
 }
}
// 自定义函数fun_findcell,用来寻找没有封闭的单元格
function fun_findcell (a, b) {
 reCell = new Array();
 for (i=0; i<Maze.length; i++) {
  for (j=0; j<Maze[i].length; j++) {
   if (Maze[i][j][4] == a && Maze[i][j][5] == b) {
    reCell.push(i, j);
    return reCell;
   }
  }
}
}

  在第4帧中键入如下代码:

// 定义三个变量
Maz = Maze[0];
cellW = 30;
wn = 0;
// 控制游戏主角在迷宫中运动,并对路线进行判断
for (i=0; i<Maze.length; i++) {
 cellX = Maze[i][4];
 cellY = Maze[i][5];
 for (j=0; j<4; j++) {
  if (Maze[i][j] == true) {
   _root.attachMovie("w"+j, "ww"+wn, wn);
   eval("ww"+wn)._x = 105+cellW*cellX;
   eval("ww"+wn)._y = 35+cellW*cellY;
   wn++;
  }
 }
}
// 设置游戏主角的坐标
man._x=105;
man._y=35;
// 主角处于游戏进行状态
man.gotoAndStop(1);
// 设置迷宫出口坐标
exit._x=105+11*cellW;
exit._y=35+11*cellW;
manX = 0;
manY = 0;

  在第6帧和第7帧都添加语句“stop();”,用以停止游戏地运行。

  4.创建一个“重玩”层,在第6帧插入一个关键帧,从库中把“重玩”按钮元件放置到场景右边。点选该元件,按F9键打开“动作”面板,键入如下代码。

on (release) {
// 清除地图,回到第1帧中重新构造地图
 for(i=0;i<wn;i++){
  removeMovieClip("ww"+i);
 }
 gotoAndPlay (1);
}

  到这里迷宫游戏就制作完成了。

本文作者:
咨询热线:020-85648757 85648755 85648616 0755-27912581 客服:020-85648756 0755-27912581 业务传真:020-32579052
广州市网景网络科技有限公司 Copyright◎2003-2008 Veelink.com. All Rights Reserved.
广州商务地址:广东省广州市黄埔大道中203号(海景园区)海景花园C栋501室
= 深圳商务地址:深圳市宝源路华丰宝源大厦606
研发中心:广东广州市天河软件园海景园区 粤ICP备05103322号 工商注册