睿美印象网络欢迎您的到来,并真诚的希望能与您合作!
睿美印象网络
返回上一页
客服QQ
点击这里给我发消息
客服QQ
点击这里给我发消息
一切从沟通开始……

一步一步学做游戏 第七回:熊碰到奖品处理

作者:睿美印象网站建设工作室  发布日期:2012-12-05
第七回主要讲熊撞到奖品之后,奖品消失

预期达到的效果:http://www.html5china.com/html5games/mogu/index6.html

简单说下原理:

给奖品加上一个存是否被撞过的属性hit,默认值为false。当奖品撞到的时候。改变hit的值为true。描绘奖品的时候判断hit值是否有没撞到,被撞到的话就不描绘

一、给奖品加hit属性

JavaScript Code复制内容到剪贴板
//定义奖品数组Prizes和对象Prize,继承游戏对象GameObject   
var prizes = new Array();   
function Prize() {};   
Prize.prototype = new GameObject();//继承游戏对象GameObject   
Prize.prototype.row = 0;//奖品行位置   
Prize.prototype.col = 0;//奖品列位置   
Prize.prototype.hit = false;//是否被撞过  
二、熊撞到奖品事件

JavaScript Code复制内容到剪贴板
//撞到奖品   
function HasAnimalHitPrize()   
{   
    //取出所有奖品   
    for(var x=0; x<prizes.length; x++)   
    {   
        var prize = prizes[x];   
        //假如没有碰撞过   
        if(!prize.hit)   
        {   
            //判断碰撞   
            if(CheckIntersect(prize, animal, 0))   
            {   
                prize.hit = true;   
                //熊反弹下沉   
                verticalSpeed = speed;   
            }   
        }   
    }   
}  
三、在描绘奖品函数中加如判断是否有被碰撞 if(!prize.hit) ,没被撞过,则描绘出来

JavaScript Code复制内容到剪贴板
//撞到奖品   
function HasAnimalHitPrize()   
{   
    //取出所有奖品   
    for(var x=0; x<prizes.length; x++)   
    {   
        var prize = prizes[x];   
        //假如没有碰撞过,则描绘在画布上   
        if(!prize.hit)   
        {   
            //判断碰撞   
            if(CheckIntersect(prize, animal, 0))   
            {   
                prize.hit = true;   
                //熊反弹下沉   
                verticalSpeed = speed;   
            }   
        }   
    }   
}  
到此第七回的完整代码如下:

展开XML/HTML Code复制内容到剪贴板
第七回讲完,整个游戏功能的大概框架已经出来了,成功就在眼前~

后面我们的任务就是去完善这个简陋的游戏,比如说加开始按钮、熊的生命数、显示得分、奖品被碰到后旋转再消失、蘑菇被碰到后颤抖几下、音乐等等

讲到这了,相信大家已经对整个游戏的功能、流程差不多了解了。后面的回合就不讲那么详细了,浪费大家的时间是吧~

第八回,开始完善游戏,加开始按钮、生命数、现实得分

大家有什么建议的话,可以到论坛留言讨论交流:http://bbs.html5china.com/read.php?tid=2


转载请注明:睿美印象网站建设工作室www.ruimeiyx.com
分享到:
已有 0 条评论
暂无评论
睿美印象在线客服
客服部小睿:
点击这里给我发消息
设计部小美:
点击这里给我发消息
技术海绵哥:
点击这里给我发消息
在线淘客服:
睿美印象网络
淘客服小睿:
睿美印象小睿
淘客服小美:
睿美印象小美