博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
(译)加入敌人和战斗:如果使用cocos2d制作基于tiled地图的游戏:第三部分
阅读量:5932 次
发布时间:2019-06-19

本文共 13478 字,大约阅读时间需要 44 分钟。

hot3.png

免责申明(必读!):本博客提供的所有教程的翻译原稿均来自于互联网,仅供学习交流之用,切勿进行商业传播。同时,转载时不要移除本申明。如产生任何纠纷,均与本博客所有人、发表该翻译稿之人无任何关系。谢谢合作!
原文链接地址:
程序截图:
  这篇教程是Ray Wenderlich的《如何使用cocos2d制作基于tiled地图的游戏》系列教程的后续。如果你还没有看过前面两部分的教程,可以在我的博客上找到另外两篇我翻译Ray的教程。
  在第二部分教程中,Ray教大家如何在地图中制作可碰撞的区域,如何使用tile属性,如何制作可以拾取的物品以及如何动态修改地图、如何使用“Heads up display”来显示分数。
  在这个教程中,我们将加入敌人,这样的话,你的忍者就可以向它们扔飞镖啦,同时还增加了胜利和失败的游戏逻辑。但是,首先,你得下载一些相关的 。
  这个zip文件里面包含以下内容:
    1.一个敌人精灵
    2.一个忍者飞镖,从Ray的《如何使用cocos2d制作一个简单的iphone游戏》中拿过来的。
    3.两张按钮的图片,在教程的后面有使用。
  在继续学习之前,不要忘了把这些资源加入到你的工程中。

增加敌人

  到第二部分教程结束的时候,游戏已经很酷了,但是它还不是一个完整的游戏。你的忍者可以轻而易举地四处游荡,想吃就吃。但是,什么时候玩家会胜利或者失败呢。我们不妨想象一下,有2个敌人在追杀你的忍者,那么这个游戏会显得更加有趣。

敌人出现的位置点

  好了,回到Tiled软件(此教程使用java版),然后打开你的Tile地图(TileMap.tmx)。
  往对象层中加入一个对象,在player附近就行,但是不要太近,否则敌人一出现玩家就Game over了。这个位置将成为敌人出现的位置点,把它命名为“EnemySpawn1”。
  对象组(对象层中的所有对象组成一个对象组)中的对象被存储在一个NSMutableDictionary中,同时使用对象名字作为key。这意味着每一个位置点必须有一个唯一的名字。尽管我们可以遍历所有的key来比较哪个是以“EnemySpawn”开头,但是这样做效率很低下。相反,我们采用的做法是,使用一个属性来表示,每个给定的对象代表一个敌人出现的位置点。
  给这个对象一个属性“Enemy”,同时赋一个值1.如果你想在这个教程的基础上扩展,并且增加其它的不同类型的敌人,你可以使用这些敌人的属性值来表示不同类型的敌人。
  现在,制作6-10个这种敌人出现位置点对象,相应的它们离player的距离也要有一些不同。为每一个对象定义一个“Enemy”属性,并且赋值为1.保存这张地图并且回到Xcode。

开始创建敌人

  好了,现在我们将把敌人实际显示到地图上来。首先在HelloWorldScene.m中添加如下代码:
复制代码
//
in the HelloWorld class
-
(
void
)addEnemyAtX:(
int
)x y:(
int
)y {
CCSprite 
*
enemy 
=
 [CCSprite spriteWithFile:
@"
enemy1.png
"
];
enemy.position 
=
 ccp(x, y);
[self addChild:enemy];
}
//
 in the init method - after creating the player
//
 iterate through objects, finding all enemy spawn points
//
 create an enemy for each one
NSMutableDictionary 
*
 spawnPoint;
for
 (spawnPoint 
in
 [objects objects]) {
if
 ([[spawnPoint valueForKey:
@"
Enemy
"
] intValue] 
==
1
){
=
 [[spawnPoint valueForKey:
@"
x
"
] intValue];
=
 [[spawnPoint valueForKey:
@"
y
"
] intValue];
[self addEnemyAtX:x y:y];
}
}
复制代码
  第一个循环遍历对象列表,判断它是否是一个敌人出现的位置点。如果是,则获得它的x和y坐标值,然后调用addEnemyAtX:Y方法把它们加入到合适的地方去。
  这个addEnemyAtX:Y方法非常直白,它仅仅是在传入的X,Y坐标值处创建一个敌人精灵。
  如果你编译并运行,你会看到这些敌人出现在你之前在Tiled工具中设定的位置处,很酷吧!
  但是,这里有一个问题,这些敌人很傻瓜,它们并不会追杀你的忍者。

使它们移动

  因此,现在我们将添加一些代码,使这些敌人会追着我们的player跑。因为,player肯定会移动,我们必须动态地改变敌人的运动方向。为了实现这个目的,我们让敌人每次移动10个像素,然后在下一次移动之前,先调整它们的方向。在HelloWorldScene.m中加入如下代码:
复制代码
//
 callback. starts another iteration of enemy movement.
-
 (
void
) enemyMoveFinished:(id)sender {
CCSprite 
*
enemy 
=
 (CCSprite 
*
)sender;
[self animateEnemy: enemy];
}
//
 a method to move the enemy 10 pixels toward the player
-
 (
void
) animateEnemy:(CCSprite
*
)enemy
{
//
 speed of the enemy
ccTime actualDuration 
=
0.3
;
//
 Create the actions
id actionMove 
=
 [CCMoveBy actionWithDuration:actualDuration
position:ccpMult(ccpNormalize(ccpSub(_player.position,enemy.position)), 
10
)];
id actionMoveDone 
=
 [CCCallFuncN actionWithTarget:self
selector:@selector(enemyMoveFinished:)];
[enemy runAction:
[CCSequence actions:actionMove, actionMoveDone, nil]];
}
//
 add this at the end of addEnemyAtX:y:
//
 Use our animation method and
//
 start the enemy moving toward the player
[self animateEnemy:enemy];
复制代码

 

 
  animateEnemy:方法创建两个action。第一个action使之朝敌人移动10个像素,时间为0.3秒。你可以改变这个时间使之移动得更快或者更慢。第二个action将会调用enemyMoveFinished:方法。我们使用CCSequence action来把它们组合起来,这样的话,当敌人停止移动的时候就立马可以执行enemyMoveFinished:方法就可以被调用了。在addEnemyAtX:Y:方法里面,我们调用animateEnemy:方法来使敌人朝着玩家(player)移动。(其实这里是个递归的调用,每次移动10个像素,然后又调用enemyMoveFinished:方法)
  
  很简洁!但是,但是,如果敌人每次移动的时候面部都对着player那样是不是更逼真呢?只需要在animateEnemy:方法中加入下列语句即可:
复制代码
//
immediately before creating the actions in animateEnemy
//
rotate to face the player
CGPoint diff 
=
 ccpSub(_player.position,enemy.position);
float
 angleRadians 
=
 atanf((
float
)diff.y 
/
 (
float
)diff.x);
float
 angleDegrees 
=
 CC_RADIANS_TO_DEGREES(angleRadians);
float
 cocosAngle 
=
-
1
*
 angleDegrees;
if
 (diff.x 
<
0
) {
cocosAngle 
+=
180
;
}
enemy.rotation = cocosAngle
复制代码
 
  这个代码计算每次玩家相对于敌人的角度,然后旋转敌人来使之面朝玩家。

忍者飞镖

  已经很不错了,但是玩家是一个忍者啊!他应该要能够保护他自己!
  我们将向游戏中添加模式(modes)。模式并不是实现这个功能的最好方式,但是,它比其他的方法要简单,而且这个方法在模拟器下也能运行(因为并不需要多点触摸)。因为这些优点,所以这个教程里面,我们使用这种方法。首先将会建立UI,这样的话玩家可以方便地在“移动模式”和“掷飞镖”模式之间进行切换。我们将增加一个按钮来使用这个功能的转换。(即从移动模式转到掷飞镖模式)。
  现在,我们将增加一些属性,使两个层之间可以更好的通信。在HelloWorldScene.h里面增加如下代码:
复制代码
//
 at the top of the file add a forward declaration for HelloWorld,
//
 because our two layers need to reference each other
HelloWorld;
//
 inside the HelloWorldHud class declaration
HelloWorld 
*
_gameLayer;
//
 After the class declaration
@property (nonatomic, assign) HelloWorld 
*
gameLayer;
//
 Inside the HelloWorld class declaration
int
 _mode;
//
 After the class declaration
@property (nonatomic, assign) 
int
 mode;
复制代码
  同时修改HelloWorldScene.m文件
复制代码
//
 At the top of the HelloWorldHud implementation
@synthesize gameLayer 
=
 _gameLayer;
//
 At the top of the HelloWorld implementation
@synthesize mode 
=
 _mode;
//
 in HelloWorld's init method
_mode 
=
0
;
//
 in HelloWorld's scene method
//
 after layer.hud = hud
hud.gameLayer 
=
 layer;
复制代码
  如果想知道在cocos2d里面如何使用按钮,可以参照我翻译的另外一篇教程
  在HelloWorldScene.m中添加下面的代码,这段代码定义了一个按钮。
复制代码
Add the folowing code, which defines a button, to HelloWorldScene.m:
//
 in HelloWorldHud's init method
//
 define the button
CCMenuItem 
*
on;
CCMenuItem 
*
off;
on 
=
 [[CCMenuItemImage itemFromNormalImage:
@"
projectile-button-on.png
"
selectedImage:
@"
projectile-button-on.png
"
 target:nil selector:nil] retain];
off 
=
 [[CCMenuItemImage itemFromNormalImage:
@"
projectile-button-off.png
"
selectedImage:
@"
projectile-button-off.png
"
 target:nil selector:nil] retain];
CCMenuItemToggle 
*
toggleItem 
=
 [CCMenuItemToggle itemWithTarget:self
selector:@selector(projectileButtonTapped:) items:off, on, nil];
CCMenu 
*
toggleMenu 
=
 [CCMenu menuWithItems:toggleItem, nil];
toggleMenu.position 
=
 ccp(
100
32
);
[self addChild:toggleMenu];
//
 in HelloWorldHud
//
callback for the button
//
mode 0 = moving mode
//
mode 1 = ninja star throwing mode
-
 (
void
)projectileButtonTapped:(id)sender
{
if
 (_gameLayer.mode 
==
1
) {
_gameLayer.mode 
=
0
;
else
 {
_gameLayer.mode 
=
1
;
}
}
复制代码
  编译并运行。这时会在左下角出现一个按钮,并且你可以打开或者关闭之。但是这并不会对游戏造成任何影响。我们的下一步就是增加飞镖的发射。

发射飞镖

  接下来,我们将添加一些代码来检查玩家当前处于哪种模式下面,并且在用户点击屏幕的时候影响不同的事件。如果是移动模式则移动玩家,如果是射击模式,则掷飞镖。在ccTouchEnded:withEvent:方法里面增加下面代码:
if
 (_mode 
==
0
) {
//
 old contents of ccTouchEnded:withEvent:
else
 {
//
 code to throw ninja stars will go here
}
  这样可以使得移动模式下,玩家只能移动。下一步就是要添加代码使忍者能够发射飞镖。在else部分增加,在增加之前,先在HelloWorld.m中添加一些清理代码:
-
 (
void
) projectileMoveFinished:(id)sender {
CCSprite 
*
sprite 
=
 (CCSprite 
*
)sender;
[self removeChild:sprite cleanup:YES];
}
好了,看到上面的else部分的注释了吗:
// code to throw ninja stars will go here
在上面的注释后面添加下面的代码:
复制代码
//
 Find where the touch is
CGPoint touchLocation 
=
 [touch locationInView: [touch view]];
touchLocation 
=
 [[CCDirector sharedDirector] convertToGL: touchLocation];
touchLocation 
=
 [self convertToNodeSpace:touchLocation];
//
 Create a projectile and put it at the player's location
CCSprite 
*
projectile 
=
 [CCSprite spriteWithFile:
@"
Projectile.png
"
];
projectile.position 
=
 _player.position;
[self addChild:projectile];
//
 Determine where we wish to shoot the projectile to
int
 realX;
//
 Are we shooting to the left or right?
CGPoint diff 
=
 ccpSub(touchLocation, _player.position);
if
 (diff.x 
>
0
)
{
realX 
=
 (_tileMap.mapSize.width 
*
 _tileMap.tileSize.width) 
+
(projectile.contentSize.width
/
2
);
else
 {
realX 
=
-
(_tileMap.mapSize.width 
*
 _tileMap.tileSize.width) 
-
(projectile.contentSize.width
/
2
);
}
float
 ratio 
=
 (
float
) diff.y 
/
 (
float
) diff.x;
int
 realY 
=
 ((realX 
-
 projectile.position.x) 
*
 ratio) 
+
 projectile.position.y;
CGPoint realDest 
=
 ccp(realX, realY);
//
 Determine the length of how far we're shooting
int
 offRealX 
=
 realX 
-
 projectile.position.x;
int
 offRealY 
=
 realY 
-
 projectile.position.y;
float
 length 
=
 sqrtf((offRealX
*
offRealX) 
+
 (offRealY
*
offRealY));
float
 velocity 
=
480
/
1
//
 480pixels/1sec
float
 realMoveDuration 
=
 length
/
velocity;
//
 Move projectile to actual endpoint
id actionMoveDone 
=
 [CCCallFuncN actionWithTarget:self
selector:@selector(projectileMoveFinished:)];
[projectile runAction:
[CCSequence actionOne:
[CCMoveTo actionWithDuration: realMoveDuration
position: realDest]
two: actionMoveDone]];
复制代码
  这段代码会在用户点击屏幕的方向发射飞镖。对于这段代码的完整的细节,可以查看我翻译的另一个文章 当然,查看原作者的文章后面的注释会更加清楚明白一些。
  projectileMoveFinished:方法会在飞镖移动到屏幕之外的时候移除。这个方法非常关键。一旦我们开始做碰撞检测的时候,我们将要循环遍历所有的飞镖。如果我们不移除飞出屏幕范围之外的飞镖的话,这个存储飞镖的列表将会越来越大,而且游戏将会越来越慢。编译并运行工程,现在,你的忍者可以向敌人投掷飞镖了。

碰撞检测

  接下来,就是当飞镖击中敌人的时候,要把敌人销毁。在HelloWorldClass类中增加以下变量(在HelloWorldScene.h文件中):
NSMutableArray 
*
_enemies;
NSMutableArray 
*
_projectiles;
  然后初使化_projectiles数组:
//
 at the end of the launch projectiles section of ccTouchEnded:withEvent:
[_projectiles addObject:projectile];
//
 at the end of projectileMoveFinished:
[_projectiles removeObject:sprite];
  然后在addEnemyAtX:y方法的结尾添加如下代码:
[_enemies addObject:enemy];
  接着,在HelloWorld类中添加如下代码:
复制代码
-
 (
void
)testCollisions:(ccTime)dt {
NSMutableArray 
*
projectilesToDelete 
=
 [[NSMutableArray alloc] init];
//
 iterate through projectiles
for
 (CCSprite 
*
projectile 
in
 _projectiles) {
CGRect projectileRect 
=
 CGRectMake(
projectile.position.x 
-
 (projectile.contentSize.width
/
2
),
projectile.position.y 
-
 (projectile.contentSize.height
/
2
),
projectile.contentSize.width,
projectile.contentSize.height);
NSMutableArray 
*
targetsToDelete 
=
 [[NSMutableArray alloc] init];
//
 iterate through enemies, see if any intersect with current projectile
for
 (CCSprite 
*
target 
in
 _enemies) {
CGRect targetRect 
=
 CGRectMake(
target.position.x 
-
 (target.contentSize.width
/
2
),
target.position.y 
-
 (target.contentSize.height
/
2
),
target.contentSize.width,
target.contentSize.height);
if
 (CGRectIntersectsRect(projectileRect, targetRect)) {
[targetsToDelete addObject:target];
}
}
//
 delete all hit enemies
for
 (CCSprite 
*
target 
in
 targetsToDelete) {
[_enemies removeObject:target];
[self removeChild:target cleanup:YES];
}
if
 (targetsToDelete.count 
>
0
) {
//
 add the projectile to the list of ones to remove
[projectilesToDelete addObject:projectile];
}
[targetsToDelete release];
}
//
 remove all the projectiles that hit.
for
 (CCSprite 
*
projectile 
in
 projectilesToDelete) {
[_projectiles removeObject:projectile];
[self removeChild:projectile cleanup:YES];
}
[projectilesToDelete release];
}
复制代码
  最后,初始化敌人来飞镖数组,并且调度testCollisions:方法,把这些代码加在HelloWorld类的init方法中。
//
 you need to put these initializations before you add the enemies,
//
 because addEnemyAtX:y: uses these arrays.
_enemies 
=
 [[NSMutableArray alloc] init];
_projectiles 
=
 [[NSMutableArray alloc] init];
[self schedule:@selector(testCollisions:)];
  上面的所有的代码,关于具体是如何工作的,可以在我的博客上查找 教程。当然,原作者的文章注释部分的讨论更加清晰,所以我翻译的教程,也希望大家多讨论啊。代码尽量自己用手敲进去,不要为了省事,alt+c,alt+v,这样不好,真的!
  好了,现在可以用飞镖打敌人,而且打中之后它们会消失。现在让我们添加一些逻辑,使得游戏可以胜利或者失败吧!

胜利和失败

The Game Over Scene

  好了,让我们创建一个新的场景,来作为我们的“You Win”或者“You Lose”指示器吧。在Xcode中,选择Classes文件夹,然后点击File\New File,再选择Objective-c类,确保NSObject是基类被选中。点击下一步,然后输入文件名GameOverScene,并且确保“Also create GameOverScene.h”复选中。
  然后用下面的代码替换掉模板生成代码:
复制代码
#import 
"
cocos2d.h
"
GameOverLayer : CCColorLayer {
CCLabel 
*
_label;
}
@property (nonatomic, retain) CCLabel 
*
label;
GameOverScene : CCScene {
GameOverLayer 
*
_layer;
}
@property (nonatomic, retain) GameOverLayer 
*
layer;
复制代码
  相应地修改GameOverScene.m文件:
复制代码
#import 
"
GameOverScene.h
"
#import 
"
HelloWorldScene.h
"
@implementation GameOverScene
@synthesize layer 
=
 _layer;
-
 (id)init {
if
 ((self 
=
 [super init])) {
self.layer 
=
 [GameOverLayer node];
[self addChild:_layer];
}
return
 self;
}
-
 (
void
)dealloc {
[_layer release];
_layer 
=
 nil;
[super dealloc];
}
@implementation GameOverLayer
@synthesize label 
=
 _label;
-
(id) init
{
if
( (self
=
[super initWithColor:ccc4(
255
,
255
,
255
,
255
)] )) {
CGSize winSize 
=
 [[CCDirector sharedDirector] winSize];
self.label 
=
 [CCLabel labelWithString:
@""
 fontName:
@"
Arial
"
 fontSize:
32
];
_label.color 
=
 ccc3(
0
,
0
,
0
);
_label.position 
=
 ccp(winSize.width
/
2
, winSize.height
/
2
);
[self addChild:_label];
[self runAction:[CCSequence actions:
[CCDelayTime actionWithDuration:
3
],
[CCCallFunc actionWithTarget:self selector:@selector(gameOverDone)],
nil]];
}
return
 self;
}
-
 (
void
)gameOverDone {
[[CCDirector sharedDirector] replaceScene:[HelloWorld scene]];
}
-
 (
void
)dealloc {
[_label release];
_label 
=
 nil;
[super dealloc];
}
复制代码
  GameOverLayer仅仅只是在屏幕中间旋转一个label,然后调度一个transition隔3秒后回到HelloWorld场景中。

胜利场景

  现在,让我们添加一些代码,使得玩家吃完所有的西瓜的时候,游戏会结束。在HelloWorld类的setPlayerPositoin:方法中添加以下代码,(位于HelloWorldScene.m中,就是update代码后面:)
//
 put the number of melons on your map in place of the '2'
if
 (_numCollected 
==
2
) {
[self win];
}
  然后,在HelloWorld类中创建win方法:
-
 (
void
) win {
GameOverScene 
*
gameOverScene 
=
 [GameOverScene node];
[gameOverScene.layer.label setString:
@"
You Win!
"
];
[[CCDirector sharedDirector] replaceScene:gameOverScene];
}
  不要忘了包含头文件:
#import 
"
GameOverScene.h
"
  编译并运行,当你吃完所有的西瓜后,就会出现如下画面:

失败场景

  就这个教程而言,我们的玩家只要有一个敌人碰到他,游戏是结束了。在HelloWorld类的testCollision方法中添加以列循环:
复制代码
for
 (CCSprite 
*
target 
in
 _enemies) {
CGRect targetRect 
=
 CGRectMake(
target.position.x 
-
 (target.contentSize.width
/
2
),
target.position.y 
-
 (target.contentSize.height
/
2
),
target.contentSize.width,
target.contentSize.height );
if
 (CGRectContainsPoint(targetRect, _player.position)) {
[self lose];
}
}
复制代码
  这个循环遍历所有的敌人,只要有一个敌人精灵的图片所在的矩形和玩家接触到了,那么游戏就失败了。接下,再创建lose方法:
-
 (
void
) lose {
GameOverScene 
*
gameOverScene 
=
 [GameOverScene node];
[gameOverScene.layer.label setString:
@"
You Lose!
"
];
[[CCDirector sharedDirector] replaceScene:gameOverScene];
}
  编译并运行,一旦有一个敌人碰到你,你就会看到下面的场景:

完整源代码  

  这里有这个教程的 。谢谢你们有耐心看到这里。

接下来怎么做?

建议:
  • 增加多个关卡
  • 增加不同类型的敌人
  • 在Hud层中显示血条和玩家生命
  • 制作更多的道具,比如加血的,武器等等
  • 一个菜单系统,可以选择关卡,关闭音效,等等
  • 使用更好的用户界面,来使游戏画面更加精美,投掷飞镖更加潇洒。
 
 
著作权声明:本文由
教程,欢迎转载分享。请尊重作者劳动,转载时保留该声明和作者博客链接,谢谢!
 

转载于:https://my.oschina.net/sunqichao/blog/157120

你可能感兴趣的文章
轻松实现基于Heartbeat的高可用web服务集群
查看>>
分析y一款APP
查看>>
pxc群集搭建
查看>>
JS中加载cssText延时
查看>>
常用的脚本编程知识点
查看>>
坐标转换convertRect
查看>>
XILINX_zynq_详解(6)
查看>>
ubuntu安装LDAP
查看>>
计算机网络术语总结4
查看>>
新手小白 python之路 Day3 (string 常用方法)
查看>>
求职路 第二章 深圳篇
查看>>
如何限制青少年无节制的玩电脑--使用智能卡登录系统
查看>>
HTML5 Geolocation API工作原理[转载]
查看>>
soapUI的简单使用(webservice接口功能测试)
查看>>
框架 Hibernate
查看>>
python-while循环
查看>>
vs2008 x64编译环境 忽略了 #ifdef WIN32
查看>>
【微信小程序】再次授权地理位置getLocation+openSetting使用
查看>>
手机端上传图片及java后台接收和ajaxForm提交
查看>>
HDU 5030 Rabbit's String
查看>>