How To Make A Side-Scrolling Beat Em Up Game Like Scott Pilgrim with Cocos2D – Part 2

This is a post by iOS Tutorial Team Member Allen Tan, an iOS developer and co-founder at White Widget. You can also find him on Google+ and Twitter. Welcome back to the second (and final) part of our Beat Em Up game tutorial series! If you followed the first part, then you’ve already created the […] By Allen Tan.

Leave a rating/review
Save for later
Share
You are currently viewing page 5 of 5 of this article. Click here to view the first page.

Gratuitous Music and Sound Effects

The game plays pretty nicely, but it isn't very satisfying when you sock it to a robot without audio feedback. And some background music might not hurt either. I can assure you, I’m not going to leave you hanging without some fun music and sound effects!

For this game, you'll be using background music made by Kevin MacLeod of Incompetech, and also some 8-bit sound effects that I created using the neat bfxr utility.

You can add the music and sound effects into the game in just a few simple steps. :]

Drag the Sounds folder from the resource kit (the one you downloaded and extracted in Part 1 of this tutorial) into the Resources group of your project. Make sure that Copy items into destination group's folder is checked, and that Create groups for any added folders is selected.

Xcode

Switch to GameLayer.m and do the following:

//add to top of file
#import "SimpleAudioEngine.h"

//add inside if ((self = [super init])) in init
// Load audio
[[SimpleAudioEngine sharedEngine] preloadBackgroundMusic:@"latin_industries.aifc"];
[[SimpleAudioEngine sharedEngine] playBackgroundMusic:@"latin_industries.aifc"];
[[SimpleAudioEngine sharedEngine] preloadEffect:@"pd_hit0.caf"];
[[SimpleAudioEngine sharedEngine] preloadEffect:@"pd_hit1.caf"];
[[SimpleAudioEngine sharedEngine] preloadEffect:@"pd_herodeath.caf"];
[[SimpleAudioEngine sharedEngine] preloadEffect:@"pd_botdeath.caf"];

Switch over to ActionSprite.m and do the following:

//add to top of file
#import "SimpleAudioEngine.h"

//add inside the first if statement (before the second if statement) of the hurtWithDamage method
int randomSound = random_range(0, 1);
[[SimpleAudioEngine sharedEngine] playEffect:[NSString stringWithFormat:@"pd_hit%d.caf", randomSound]];

Switch to Hero.m, and do the following:

//add to top of file
#import "SimpleAudioEngine.h"

//add this method inside the @implementation
-(void)knockout {
    [super knockout];
    [[SimpleAudioEngine sharedEngine] playEffect:@"pd_herodeath.caf"];
}

Finally, switch to Robot.m and do the following:

//add to top of file
#import "SimpleAudioEngine.h"

//add this method inside the @implementation
-(void)knockout {
    [super knockout];
    [[SimpleAudioEngine sharedEngine] playEffect:@"pd_botdeath.caf"];
}

The above code preloads the music and sound effects in GameLayer, and plugs in the appropriate sound effect for each action event.

You're done! Build, run, and play until you drop!

Where To Go From Here?

Here is the final project with all the code from the complete tutorial.

You may have been through both parts of this tutorial and have the bodies hitting the floor, but you’ve only seen the tip of the iceberg! There is still a lot more ground to be covered when it comes to making a full-fledged Beat Em Up Game.

An Exciting Announcement

If you're craving more Beat Em Up action, I have good news for you - I will soon be releasing a Beat Em Up Starter Kit here at raywenderlich.com!

You’re probably wondering just how awesome it will be. As a teaser, here's a list of what you can expect to find and learn in the kit:

  • More actions! 3-hit combos, jumping, running
  • Combination actions: jumping attack, running attack
  • Adding Life Bars
  • Animated 8-directional D-pad
  • Animated D-pad buttons
  • State machine applied to game events, and battle events with enemy spawning!
  • Multiple levels, and using PLIST files for setting up events
  • Creating different types of enemies using the sprite color tinting technique
  • Boss enemy: Pompadour VS Mohawk! (cue dramatic music)
  • More advanced enemy AI
  • Much better collision system using circles instead of rectangles
  • Adjusting collision circles based on actions, and drawing these circles onto the screen for debugging
  • A weapon for your Pompadoured Hero: the Gauntlet
  • Destructible tiled map objects
  • Visible damage numbers and hit explosions
  • ...and much more!

Whoa, that’s a lot of stuff! If you’re interested in the Beat Em Up Game Starter Kit, make sure you’re signed up for our monthly newsletter – we’ll announce it there when it comes out! :]

Update 4/8/13: Good news - the Beat Em Up Game Starter Kit is now available! Check it out on the raywenderlich.com store.

It's gonna be epic - but in the meantime, if you have any questions, comments, or suggestions about this tutorial, please join the forum discussion below :]


This is a post by iOS Tutorial Team Member Allen Tan, an iOS developer and co-founder at White Widget. You can also find him on and Twitter.

Allen Tan

Contributors

Allen Tan

Author

Over 300 content creators. Join our team.