Hi, I am playing around with the Phaser 3 examples by modifying them for experiments. With the following codes, the last sprite was displayed at the location (0,0) unexpectedly. It was caused by this.add.group(). What did I do wrong?
**********************************************
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Playing cards - Part 1</title>
<script src="//cdn.jsdelivr.net/npm/phaser@3.55.2/dist/phaser.js"></script>
<style type="text/css">
body {
margin: 0;
}
</style>
</head>
<body>
<script>
class Example extends Phaser.Scene
{
constructor ()
{
super();
}
preload ()
{
this.load.spritesheet('cards', 'assets/sprites/playing_cards_975_420.png', { frameWidth: 75, frameHeight: 105 });
}
create ()
{
const group = this.add.group({
key: 'cards',
frame: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12,
13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25,
26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38,
39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51
],
frameQuantity: 1
});
}
}
const config = {
type: Phaser.AUTO,
width: 1200,
height: 600,
backgroundColor: '#2d2d2d',
parent: 'phaser-example',
scene: [ Example ]
};
const game = new Phaser.Game(config);
</script>
