CODEWITHSUNDEEP
javascriptphaser-framework
user3121056
user3121056

Reputation: 339

Sprites and equipping sprite clothes in Phaser

How do I equip clothes to a sprite in Phaser? Say I use the following:

http://opengameart.org/sites/default/files/human_base.png

http://opengameart.org/sites/default/files/styles/medium/public/16x18hair-clothingpack_preview2.png

The only way I can think of is making a image with each sprite on. There must be a different way, like overlaying or something perhaps?

Upvotes: 3

Views: 3077

Answers (2)

Faz
Faz

Reputation: 82

You should check this project: https://github.com/makrohn/Universal-LPC-spritesheet.

And for the integration in Phaser, try Something like that:

function preload() {
    game.load.spritesheet('female_body', 'sprites/body/female/light.png', 64, 64);
    game.load.spritesheet('female_hair', 'sprites/hair/female/pixie/blonde.png', 64, 64);
    game.load.spritesheet('female_torso', 'sprites/torso/tunics/female/teal_tunic.png', 64, 64);
    game.load.spritesheet('female_legs', 'sprites/legs/pants/female/teal_pants_female.png', 64, 64);
}

function create() {
    var group = game.add.group();
    group.add(game.add.sprite(200, 200, 'female_body', 13 * 9));
    group.add(game.add.sprite(200, 200, 'female_hair', 13 * 9));
    group.add(game.add.sprite(200, 200, 'female_torso', 13 * 9));
    group.add(game.add.sprite(200, 200, 'female_legs', 13 * 9));
    group.callAll('animations.add', 'animations', 'walk', Phaser.ArrayUtils.numberArrayStep(13 * 9, 13 * 9 + 9));
    group.callAll('animations.play', 'animations', 'walk', 9, true);
}

Upvotes: 5

uzum
uzum

Reputation: 11

You can use Phaser.Sprite#addChild to attach cloth sprites to your player sprite.

// Player sprite
var player = game.add.sprite(0, 0, 'player-sprite');

// Cloth sprite
var cloth = game.add.sprite(0, 0, 'cloth-sprite');

// Tweak anchor position to correctly align clothing over player 
cloth.anchor.setTo(0.5, 0.5);

player.addChild(cloth);

Upvotes: 1

Related Questions