Sign In Start Free Trial

Book Overview & Buying
Table Of Contents

Learning Cocos2d-JS Game Development

By : Emanuele Feronato

3.9 (11)

Learning Cocos2d-JS Game Development

3.9 (11)

By: Emanuele Feronato

Overview of this book

If you are a Java developer who wants to learn about Java EE, this is the book for you. It's also ideal for developers who already have experience with the Java EE platform but would like to learn more about the new Java EE 7 features by analyzing fully functional sample applications using the new application server WildFly.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. Hello World – A Cross-platform Game

1. Hello World – A Cross-platform Game

Why should I make cross-platform games?

What Cocos2d-JS is and how it works

The structure of your Cocos2d-JS project

Hello Cross-World

Preloading and adding images

Removing images and changing the background color

Summary

2. Adding Interactivity – The Making of a Concentration Game

2. Adding Interactivity – The Making of a Concentration Game

Creating multiple instances of game assets

Adding a gradient background

Extending the Sprite class beyond its capabilities

Making assets react to clicks and touches

Changing sprite images on the fly

Shuffling the tiles and adding the score

Summary

3. Moving Sprites Around the Screen – An Endless Runner

3. Moving Sprites Around the Screen – An Endless Runner

Loading and placing graphic resources

Adding an endless scrolling background

Adding the spaceship

Controlling the spaceship

Adding asteroids

Asteroid versus spaceship collision

Invulnerability

Preventing the spaceship from flying off the screen

Adding particles

Summary

4. Learn about Swipes through the making of Sokoban

4. Learn about Swipes through the making of Sokoban

Loading graphic assets

Building a level

Detecting swipes

Completing the game

Summary

5. Become a Musical Maestro

5. Become a Musical Maestro

Choosing sounds

Preloading sounds

Creating a sound menu

Managing music and sound effects

Summary

6. Controlling the Game with Virtual Pads

6. Controlling the Game with Virtual Pads

Overview of virtual pads

First things first – the game

Summary

7. Adding Physics to Your Games Using the Box2D Engine

7. Adding Physics to Your Games Using the Box2D Engine

Before you start

Adding the Box2D engine to your project

Configuring the physics world

Adding bodies to the world

Updating sprite position as the world changes

Selecting and destroying world bodies

Checking for collisions among bodies

Summary

8. Adding Physics to Your Games Using the Chipmunk2D Engine

8. Adding Physics to Your Games Using the Chipmunk2D Engine

Adding the Chipmunk2D engine to your project

Configuring the physics space

Adding bodies to the space

Selecting and destroying space bodies

Checking for collisions among bodies

Using your own graphic assets

Summary

9. Creating Your Own Blockbuster Game – A Complete Match 3 Game

9. Creating Your Own Blockbuster Game – A Complete Match 3 Game

Setting up the game

Where to go now

Summary

Index

Index

Adding a gradient background

A quick and easy way to improve the background is to add a gradient. Most of the skies and sceneries you see in the background of your favorite games are just gradients.

You are going to add a gradient layer conveniently called gradient to the game simply by adding these two lines to gamescript.js:

var gameScene = cc.Scene.extend({
  // same as before
});

var game = cc.Layer.extend({
  init:function () {
    this._super();
    var gradient = cc.LayerGradient.create(cc.color(0,0,0,255), cc.color(0x46,0x82,0xB4,255));
    this.addChild(gradient);
    for(i=0;i<16;i++){
      var tile = cc.Sprite.create("assets/cover.png");
      this.addChild(tile,0);
      tile.setPosition(49+i%4*74,400-Math.floor(i/4)*74);
    }
  }
});

Gradient layer creation is made by the cc.LayerGradient.create method, which requires both the start and end gradient color in an RGBA (Red, Green, Blue, Alpha) format.

There are two things you need to notice about the lines that were...

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Learning Cocos2d-JS Game Development

Search

Your notes and bookmarks