本类共有 4110 篇文章,今日更新 0

Flash游戏制作:弹力球

[ 来源:http://www.91now.com/down/ | 作者: | 时间:2007-5-21 18:04:41 | 浏览: 人次 ]

  弹力球是一个很有趣的小游戏,有点像我们玩的乒乓球,不过这个游戏里玩家只有你一个,你必须尽力用鼠标去控制滑板将小球反弹回去,千万不能碰到四周的墙壁,否则游戏以失败而告终。每成功将小球反弹一次将得到50分,而每碰到一次墙壁会扣掉500分,玩家在每次游戏中一共有六次机会。


  注意:当你的鼠标在游戏范围内时,鼠标中心的水平和垂直延长线决定左右挡板和上下挡板中心的位置。

  下面我们就开始具体的游戏制作。

  启动Flash,新建一个影片,然后选取modify/document菜单命令,在弹出的document properties面板中如图2所示设置影片的属性:


图2

  我们分以下三个大步骤制作,文章末尾提供.fla源文件下载学习。

  "

  "

  "



  一、游戏基本元素的准备

  本步骤我们首先要准备好在游戏中要用到的一些元素和素材。

  1.先我们来制作游戏中的主角,弹力小球。选取insertànew symbol菜单命令,在弹出的create new symbol面板中设置组件类型为movie clip,并给组件取名为ball,如图3所示:


图3

  2.在组件ball的编辑区内,用椭圆工具画一个正圆形,然后用填充工具填充上适当的颜色,颜色可以根据自己的喜好进行选择,本例中我们将小球填充为草绿色,填充好的小球如图4所示:


图4

  3.接下来制作游戏中的挡板。还是选取insertànew symbol菜单命令,在弹出的create new symbol面板中设置组件类型为movie clip,并给组件取名为Horizontal Paddles,即水平挡板,在组件Horizontal Paddles的编辑区内,用矩形工具画一个长的圆角矩形,并填充上草绿色,然后将其放置到坐标为(-39.5,143.0)处(具体坐标值可以在properties面板中设置),如图5所示:


图5

  4.按照同样的方法制作一个一模一样的圆角矩形,将其放置到坐标为(-39.5,128.3)的位置,最后如图6所示:


图6

  5.按照制作组件Horizontal Paddles一样的方法,制作一个movie clip组件Vertical Paddles,不同之处是此组件是垂直挡板,我们完全可以将组件Horizontal Paddles旋转90度后,就可以得到所要的效果,如图7所示:


图7

  6.因为游戏中我们需要用鼠标控制水平和垂直挡板,所以就需要将鼠标坐标值传递给挡板,所以我们需要做一个空的mc,来充当这个间接传递坐标的任务。选取insert/new symbol菜单命令,在弹出的create new symbol面板中设置组件类型为movie clip,并给组件取名为Mouse Tracker,仅此而已,不需要进行其它任何工作。

  7.当然游戏中也少不了一些按钮,本游戏我们需要一个重新开始的按钮,风格和样式可以自己选择,本实例中我们的重玩按钮如图8所示:


图8

  到目前为止,我们游戏的准备工作就告一段落了,接下来是游戏中最最关键的一步,action控制代码的添加。


  二、游戏action控制代码的添加

  1.为了方便我们对游戏进行修改和调试,我们一般都需要把大部分的控制代码专门放到一个独立的mc中,这也是一个制作的好习惯。

  2.选取insertànew symbol菜单命令,在弹出的create new symbol面板中设置组件类型为movie clip,并给组件取名为Paddle Controller。

  3.在组件Paddle Controller的编辑状态下,我们新建两个图层layer2和layer3,连上组件莫认的layere1,一共有三个独立的图层。

  4.在图层layer2上,我们使用文本工具在编辑区中画两个大小适中的文本框,如图9所示:


图9

  5. 在properties面板中分别设置这两个文本框为dynamic text类型,即动态文本框,左边的文本框我们用来显示得分,右边的文本框我们用来显示剩余的生命,所以分别在properties面板中设置它们的变量名var为score和lives,如图10和图11所示:


图10


图11

  6.然后将图层layer2延续到第22帧。

  7.在图层layer3上输入文本GET READY,作为游戏开始的提示信息,并将此帧延续到第18帧,如图12所示:



图12

  8.在图层layer3的第19,20,21三帧分别插入三个空白关键帧,然后在第22帧插入关键帧,从图库中将前面做好的重玩按钮放到编辑区中,如图13所示:



图13

  9.并给重玩按钮添加as:

  on (release) {
    Score = 0;
    Lives = 5;
    gotoAndPlay(1);
  }
  //初始化游戏得分和生命值,并且跳到第一帧重新开始游戏

  10.回到图层layer1,在第1帧,第20帧和第21帧插入三个关键帧,给第1帧添加如下as:

  xStep = Number(random(5))+6;
  yStep = Number(random(5))+3;
  //设置两个随机变量,其中xStep的范围是6-11,yStep的范围是3-8,random(N)这个随//机函数会产生一个从0到N的随机数
  xModifier = random(10);
  yModifier = random(10);
  //设置两也随机变量,范围都是从0到10
  if (Number(xModifier)>5) {
    xStep = xStep-(xStep*2);
  }
  if (Number(yModifier)>5) {
    yStep = yStep-(yStep*2);
  }
  //根据xModifier和yModifier这两个随机树取值的不同,对xStep和ystep两变量值//进行修改
  if (Number(lives) == 0) {
    gotoAndStop(22);
  }
  //如果lives值等于0,即生命值为0,则游戏结束,跳到第22帧也就是游戏结束画面

  11. 第20帧添加如下as

  horX = getProperty("/mousetrack", _x);
  setProperty("/hor", _x, eval("horX"));
  //取得对象mousetrack的横坐标,并赋给水平挡板hor,这样就控制了水平挡板和鼠标//的横坐标始终相等,使它们保持在一条垂直线上
  vertY = getProperty("/mousetrack", _y);
  if (Number(vertY)<245) {
    setProperty("/vert", _y, eval("vertY"));
  } else {
    setProperty("/vert", _y, 245);
  }
  //设置垂直挡板的位置,并且规定了挡板的最大纵坐标值为245
  BallX = getProperty("/Ball", _x);
  setProperty("/Ball", _x, Number(BallX)+Number(int(xStep)));
  BallY = getProperty("/Ball", _y);
  setProperty("/Ball", _y, Number(BallY)+Number(int(yStep)));
  //设置弹力小球的坐标值,经过一系列计算后,产生了一个随机的坐标值

  12. 第21帧添加如下as

  Lose = 0;
  LeftConstraint = getProperty("/hor", _x)-47;
  RightConstraint = Number(LeftConstraint)+94;
  UpperConstraint = getProperty("/vert", _y)-47;
  LowerConstraint = Number(UpperConstraint)+94;
  yAccel = vertY-getProperty("/mousetrack", _y);
  xAccel = horX-getProperty("/mousetrack", _x);
  //定义一系列变量,LeftConstraint,RightConstraint,UpperConstraint,LowerConstraint
  //设置了小球所能活动的范围
  if (Number(getProperty("/Ball", _y))>270 or Number(getProperty("/Ball", _y))<30) {
    if ((Number(getProperty("/Ball",_x))>Number(LeftConstraint)) and (Number(getProperty("/Ball", _x)){
      yStep = yStep-(yStep*2);
      xStep = int(xStep-(0.15*xAccel));
      Score = Number(Score)+50;
    } else {
      Lose = 1;
    }
  }

  //此段程序判断小球是否碰到了水平挡板上,如果碰到了,则分数加50,然后设置小//球的反弹坐标,否则,标志位lose记为1,说明碰到了墙壁

  if (Number(getProperty("/Ball", _x))>270 or Number(getProperty("/Ball", _x))<30) {
    if ((Number(getProperty("/Ball",_y))>Number(UpperConstraint)) and (Number(getProperty("/Ball", _y)){
      xStep = xStep-(xStep*2);
      yStep = int(yStep-(0.15*yAccel));
      Score = Number(Score)+50;
    } else {
      Lose = 1;
    }
  }
  //此段程序判断小球是否碰到了垂直挡板上, 如果碰到了,则分数加50,然后设置小//球的反弹坐标,否则,标志位lose记为1,说明碰到了墙壁。

  if (Number(Lose) == 0) {
    gotoAndPlay(20);
  } else {
    setProperty("/Ball", _x, 150);
    setProperty("/Ball", _y, 150);
    Lives = Lives-1;
    Score = Score-500;
    gotoAndPlay(1);
  }
  //若没有让小球触到墙壁,即lose的值为0,则回到第20帧,继续游戏,如果小球触到了墙壁,则重新设置小球的位置,并且分数减去500,生命值扣掉1,回到第一帧开始游戏

  13.最后的时间线如图14所示,到这里,本游戏中最关键的action就添加完了,下面我就可以开始布置主场景了。


图14


  三、游戏场景的布置

  1.回到主场景中,新建立layer2到layer4四个图层。

  2.在图层layer1中,我们铺上一幅游戏背景图,可以自己在Flash中画,也可以从外部导入一幅图片,如图15所示:


图15

  3.在图层layer2中,将组件Mouse Tracker拖到舞台上,作为传递鼠标值的中间角色,并在properties面板中给其命名为mousetrack。

  4.在图层layer3中,分别将组件Horizontal Paddles,Vertical Paddles和Paddle Controller放到舞台的合适位置,分别在properties面板中命名为hor,ver和Controller,如图16所示:



图16

  5.然后在图层layer3的第1帧加as:

  stop();
  /Controller:Lives = 5;
  /Controller:Score = 0;
  //初始化游戏得分和生命值分别为0和5

  6.最后将组件ball放到图层layer4中,在properties面板中给其命名为Ball,并给图层layer4的第1帧加as:

  setProperty("/mousetrack", _visible, "0");
  startDrag("mousetrack", true, 55, 55, 245, 330);
  setProperty("/quitspot", _visible, 0);
  //设置对象mousetrack在游戏中不可见,并且对mousetrack进行拖动,使对象//mousetrack紧跟鼠标运动。

  7.这样整个游戏就做完了,最后的主场景和时间线分别如图17和图18所示:

  
图17                    图18


原文件下载学习



广告位