Flash专栏： 基础教程 | 技巧运用 | MTV实例教程 | 游戏实例教程 | 实例教程 | AS教程(new)
photoshop专栏： 基础 | 进阶 | 技巧总汇 | 精彩实例 | 文字特效 | 滤镜魔术 | 实际应用
网页设计： Dreamweaver教程 | FireWorks教程 | CorelDraw设计 | Freehand/Illustrator教程 | 音乐转换教程
其他教程： 操作系统 | 程序设计 | 网站开发 | 图形图像 | 数据库 | 网络技术 | 安全相关 | 认证考试 | 硬件知识 | 服务器
Flash专栏>flash游戏实例教程>一个撞砖块的小游戏及源码   返回上一页
  日期:2004-10-05 16 作者:EmilMatthew 来源:flash8
天气预报 IP地址 手机号码 邮编 翻译 在线代理 在线评书 好dj


一个撞砖块的小游戏及源码


开学了，本以为可以继续开心的进行游戏及物理在FLASH中的相关设计的。 唉~~~可是开了学才知道一切都很现实，该学的东东还是得学（虽然很多我认为有些东西对我没用，比方说：对我来说很难的硬件），练FLASH变成了很少，一个月只做了一个小游戏，先请大家看看效果：
点击浏览该文件
先讲一下我的开发环境，我的签名档里你应该看得到（我觉得昨在外读书不应该多花父母的钱，要买好的电脑，应该自己挣），其实，这样配置的电脑，最大的一个好处，在于可以使你努力的去优化你的代码。
我用了一个很简单的方法来近似的测一个函数的执行时间：

var starts=getTimer();
var result=Fun(a,b...);
var ends=getTimer();
var k=ends-starts;
trace(k);
trace(result);
结果HITTEST的执行时间为3MS,而我一开始写的碰撞检测，平均要耗30MS，这在我的机子上是玩不了的，后来，经过优化后，变成了平均4MS，与HITTEST已相差无几，我觉得很满意。最后，至少在我的机子上，这个游戏还是能玩的。 我只挑本小游戏中几个最关键的部分讲一下：
1小球与砖块的碰：
这是一个球与矩形的碰撞问题，我讲一下我的思路。
其实，参考两个球的碰撞检测的话，可以想向，如果让小球贴着矩形的边缘走一圈，围出的那个类似于跑道的图形即为球体与矩形碰撞检测区域（小球的检测点为其圆心）。
如图
按此在新窗口浏览图片

解决这个问题：有两个方法比较好（可惜偶数学水平不够，还不会）
a)用曲线拟合的方法求出这个类似跑道的形状的函数表达式（图形学，计算方法及数值分析课程学过后就好了）比方说，是y=a(7-x)^6+b(3-x)^3-(5+x)^2,此时，只要用相关的点在图形内的判定便可以解决这样的碰撞检测了。 b)用离散数学的方法，用离散的方法求解图形的问题时，你要做的只是加减法，及逻辑判断，
对代码的执行效率的提高是很重要的。 由于我水平菜，只能用最土的方法来做了。
如图，把判定区域划分成8个部分，进行判定。
按此在新窗口浏览图片
其中的1，3，6，8用圆心和矩形的四个顶点的距离是否小于圆的半径来做。
而其它的只要用相关的触边判定就行了。
我现在用的比较优化的判定函数是这样的：(我就不逐句解释啦，真的不难，只不过有几句比较长而已，但一切都只为了优化，虽然看上去有些不美观。)
function HitBrackDetectTwo(ball, rect) {
if (ball._x>rect._x-rect._width/2-ball.r && ball._x<rect._x+rect._width/2+ball.r && ball._y>rect._y-rect._height/2-ball.r && ball._y<rect._y+rect._height/2+ball.r) {
if (ball._x<rect._x-rect._width/2) {
if (ball._y<rect._y-rect._height/2) {
if ((ball._x-(rect._x-rect._width/2))*(ball._x-(rect._x-rect._width/2))+(ball._y-(rect._y-rect._height/2))*(ball._y-(rect._y-rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._y<rect._y+rect._height/2) {
return 2;
} else if ((ball._x-(rect._x-rect._width/2))*(ball._x-(rect._x-rect._width/2))+(ball._y-(rect._y+rect._height/2))*(ball._y-(rect._y+rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._x<rect._x+rect._width/2) {
return 3;
} else {
if (ball._y<rect._y-rect._height/2+0.01) {
if ((ball._x-(rect._x+rect._width/2))*(ball._x-(rect._x+rect._width/2))+(ball._y-(rect._y-rect._height/2))*(ball._y-(rect._y-rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._y<rect._y+rect._height/2) {
return 4;
} else if ((ball._x-(rect._x+rect._width/2))*(ball._x-(rect._x+rect._width/2))+(ball._y-(rect._y+rect._height/2))*(ball._y-(rect._y+rect._height/2))<ball.r*ball.r) {
return 1;
}
}
} else {
return 0;
}
}

2小球与横杆的碰撞。
与上面的有点类似，相对简单些，要注意的一点就是，在刚好碰到杆的边缘时，小球应该是按原来的速度的相反方向返回，
函数如下：
function HitPoleDetectTwo(mcball, pole) {
if (mcball._x>pole._x-pole._width/2-7 && mcball._x<pole._x+pole._width/2+7 && mcball._y>pole._y-pole._height/2-mcball.r-1 && mcball._y<pole._y-pole._height/2-mcball.r+4) {
if (mcball._x<pole._x-pole._width/2+3) {
return 1;
} else if (mcball._x<pole._x+pole._width/2-3) {
return 2;
} else {
return 3;
}
} else if (mcball._y>pole._y-pole._height/2-mcball.r+2.9) {
return 0;
}
}
3自动给方块填色和程序：
先用一个数组，存放一些比较自己觉得比较好看的颜色值：
_global.a = new Array();
a[0] = 0xFF0000;
a[1] = 0x00FF00;
a[2] = 0x0000FF;
a[3] = 0x6699FF;
a[4] = 0xFF99FF;
a[5] = 0xCCCCFF;
a[6] = 0xFF3333;
a[7] = 0x996600;
a[8] = 0x669900;
a[9] = 0x663399;
a[10] = 0x00FFFF;
再做一个填色函数就行了：
function DrawColor() {
for (var i = 0; i<3; i++) {
for (var j = 0; j<6; j++)
}
}
4做一个游戏，稍微复杂点的时候，要想好整个游戏的流程，开始，成功及失败时调用哪几个函数，、，还要加上相关的全局变量来控整个游戏，如我这里的Playing，Starts和Failure等.
还有，程序应该是在纸上先写好的，至少是伪代码吧。
对一些比较重要的函数，要进行单个的调试，却保这些小的模块无误后，才开始写主程序。
最后经历的是调试---改进---调试的反复改进的过程。
下面是源码：
_root.onLoad = function() {
_global.a = new Array();
a[0] = 0xFF0000;
a[1] = 0x00FF00;
a[2] = 0x0000FF;
a[3] = 0x6699FF;
a[4] = 0xFF99FF;
a[5] = 0xCCCCFF;
a[6] = 0xFF3333;
a[7] = 0x996600;
a[8] = 0x669900;
a[9] = 0x663399;
a[10] = 0x00FFFF;
brack._visible = false;
Again._visible = false;
Scence_Border_right=222;
Scence_Border_height=299;
Initialize1();
};
function Initialize1() {//初始化场景中的函数
Start_Ball(ball);
Start_Bracks();
//Global Variable
Number_Brack = 18;
Starts = false;
Playing = false;
Failure = false;
ball.vx(0);
ball.vy(0);
ball.r(4);
speed = 6;
b._x=Scence_Border_right/2;
Starting._x=115;
Starting._y=115;
Again._x=115;
Again._y=150;
}
function Start_Ball(mc) {//初始化小球的速度及位置
mc._x = 50+random(100);
mc._y = 120+random(30);
mc.vx = ramdom(3)+5;
mc.vy = ramdom(3)+5;
}
function Copy() {//复制砖块的函数
var n = 0;
for (var i = 0; i<3; i++) {
for (var j = 0; j<6; j++) {
brack.duplicateMovieClip("brack"+i+"_"+j, n+50);
n++;
}
}
}
function DrawColor() {//着色函数，后来我否决了这个函数，原因是可以写在代码里
for (var i = 0; i<3; i++) {
for (var j = 0; j<6; j++)
}
}
function Start_Bracks() {//初始化砖块的位置及颜色。
Copy();
for (var i = 0; i<3; i++) {
var h = brack._height-2;
//Wether this effect to be done will be considered.为了视觉的需要，微调是必要的。
for (var j = 0; j<6; j++) {
eval("brack"+i+"_"+j)._x = brack._width*j+brack._width/2;
eval("brack"+i+"_"+j)._y = h*i+h/2;
eval("brack"+i+"_"+j).rectangle.setRGB(a[random(10)]);
//trace(barck._height*i+brack._height/2);BUG
}
}
// DrawColor();
}
function BorderCollisionDetect(mc) {//小球的碰边检测
if (mc.getBounds(_root).xMin<1) {
// 特别关注这个误差的调整及返回的值，对应的MC._X倒底是多少...
mc._x = 1+mc._width/2;
mc.vx *= -1;
}
if (mc.getBounds(_root).xMax>Scence_Border_right) {//Scence_Border_right注意这种常量的写法是很有益的，在别的场景中，用同样的一个函数，只要改一个变量值就行了。
mc._x =Scence_Border_right-mc._width/2;
mc.vx *= -1;
}
if (mc.getBounds(_root).yMin<1) {
mc._y = 1+mc._height/2;
mc.vy *= -1;
}
if (mc.getBounds(_root).yMax>Scence_Border_height) {
mc._y =Scence_Border_height-mc._height/2;
mc.vy *= -1;
}
}
function Horizon_BorderCollisionDetect(mc) {//杆的碰边阻档
//Good code for every where use.
if (mc.getBounds(_root).xMin<1) {
mc._x = 1+mc._width/2;
}
if (mc.getBounds(_root).xMax>Scence_Border_right) {
mc._x = Scence_Border_right-mc._width/2;
}
}
function HitBrackDetectTwo(ball, rect) {//小球和矩形在碰撞检测
if (ball._x>rect._x-rect._width/2-ball.r && ball._x<rect._x+rect._width/2+ball.r && ball._y>rect._y-rect._height/2-ball.r && ball._y<rect._y+rect._height/2+ball.r) {
if (ball._x<rect._x-rect._width/2) {
if (ball._y<rect._y-rect._height/2) {
if ((ball._x-(rect._x-rect._width/2))*(ball._x-(rect._x-rect._width/2))+(ball._y-(rect._y-rect._height/2))*(ball._y-(rect._y-rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._y<rect._y+rect._height/2) {
return 2;
} else if ((ball._x-(rect._x-rect._width/2))*(ball._x-(rect._x-rect._width/2))+(ball._y-(rect._y+rect._height/2))*(ball._y-(rect._y+rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._x<rect._x+rect._width/2) {
return 3;
} else {
if (ball._y<rect._y-rect._height/2+0.01) {
if ((ball._x-(rect._x+rect._width/2))*(ball._x-(rect._x+rect._width/2))+(ball._y-(rect._y-rect._height/2))*(ball._y-(rect._y-rect._height/2))<ball.r*ball.r) {
return 1;
}
} else if (ball._y<rect._y+rect._height/2) {
return 4;
} else if ((ball._x-(rect._x+rect._width/2))*(ball._x-(rect._x+rect._width/2))+(ball._y-(rect._y+rect._height/2))*(ball._y-(rect._y+rect._height/2))<ball.r*ball.r) {
return 1;
}
}
} else {
return 0;
}
} function HitPoleDetectTwo(mcball, pole) {//小球和杆的碰撞检测
if (mcball._x>pole._x-pole._width/2-7 && mcball._x<pole._x+pole._width/2+7 && mcball._y>pole._y-pole._height/2-mcball.r-1 && mcball._y<pole._y-pole._height/2-mcball.r+4) {
if (mcball._x<pole._x-pole._width/2+3) {
return 1;
} else if (mcball._x<pole._x+pole._width/2-3) {
return 2;
} else {
return 3;
}
} else if (mcball._y>pole._y-pole._height/2-mcball.r+2.9) {
return 0;
}
}
function CombineHitBrackDetect() {//总的球与矩形的碰撞检测，及碰后处理
for (var i = 0; i<3; i++) {
for (var j = 0; j<6; j++) {
var temp = HitBrackDetectTwo(ball, eval("brack"+i+"_"+j));
switch (temp) {
case 0 :
break;
case 1 :
this["brack"+i+"_"+j].removeMovieClip();
ball.vx *= -1;//A spacek is required.
ball.vy *= -1;
Number_Brack--;
break;
case 2 :
this["brack"+i+"_"+j].removeMovieClip();
ball.vx *= -1;
Number_Brack--;
break;
case 3 :
this["brack"+i+"_"+j].removeMovieClip();
ball.vy *= -1;
Number_Brack--;
break;
case 4 :
this["brack"+i+"_"+j].removeMovieClip();
ball.vx *= -1;
Number_Brack--;
break;
}
}
}
}
function CombineHitPoleDetect() {//球与杆的碰后处理
var temp = HitPoleDetectTwo(ball, b);
switch (temp) {
case 0 :
Failure = true;
break;
case 1 :
if (ball.vx>0) {
ball.vx *= -1;
ball.vy *= -1;
break;
} else if (ball.vx<0) {
ball.vy *= -1;
break;
}
case 2 :
ball.vy *= -1;
break;
case 3 :
if (ball.vx<0) {
ball.vx *= -1;
ball.vy *= -1;
break;
} else if (ball.vx>0) {
ball.vy *= -1;
break;
}
}
} function CombineHitTest()
function Win_OR_Failure() {//赢抑或失败的判定
if (Failure) else if (Number_Brack == 0)
}
function Failures() {//失败后的处理函数
Playing = false;
pl.attachMovie("pic_you_lose", "pics", 100);
pl._visible = true;
Again._visible = true;
}
function Win() {//赢后的处理函数
Playing = false;
pl.attachMovie("pic_you_win", "pics", 100);
pl._visible = true;
Again._visible = true;
}
function Control(mc) {//键盘控制
if (Key.isDown(Key.LEFT)) {
mc._x -= speed;
}
if (Key.isDown(Key.RIGHT)) {
mc._x += speed;
}
}
function Motion(mc) {//小球动态效果
mc._x += mc.vx;
mc._y += mc.vy;
}
_root.onEnterFrame = function() {//整个游戏以时间机制监控。
tell = Number_Brack;
if (Playing)
};
下面是游戏的源文件及我在做这个游戏时写的笔记，本游戏还有改进的地方啦，比方说，做得更整，增加关数，增加天下掉下的东东等，还有，那个碰撞的算法还有改进的地方，哈哈.欢迎大家提议见，共同提高。
点击浏览该文件
ps1:回到家里，有件非常搞笑的问题，请大家看看是怎么回事，这个游戏用是在FLASH MX上做的，导出成SWF仅为19.2KB，可是一换成用MX 2004导出，竟然有3.17之巨，请大家看看到底是怎么回事？ ps2:不知是不是我的机子的毛病，在闪吧发新贴时，只要一最小化就立刻死机，所以，本来我是10点就开始上传文件的，一连重启了四次机才把贴子发出去，现在已经是11点了，实在是郁闷
 
高手云集 版权所有 1998-2006