Adding to container doesn't show sprite

Endeva · June 7, 2018

Currently, I'm using the current html and javascript for a simple menu thing I am making. The problem is, the card sprites are not displaying when I click the button although the button sprites do go away. Furthermore, if I change the code to add the textureNButton sprites in the startCardGame function, it works and they are displayed. Any ideas why this wont work?:

<html>

<head>

</head>

<body>

let Application = PIXI.Application,

Container = PIXI.Container,

Sprite = PIXI.Sprite;

var app = new Application({

width : 540,

height : 720,

backgroundColor : 0x1099bb,

antialias : true,

resolution : 1,

transparent : false

});

document.body.appendChild(app.view);

var mainMenu = new Container();

var cardGameData = [];

app.stage.addChild(mainMenu);

var cardTex = PIXI.Texture.fromImage('required/assets/card.png');

var textureTask1Button = PIXI.Texture.fromImage('required/assets/task1button.png');

var textureTask2Button = PIXI.Texture.fromImage('required/assets/task2button.png');

var textureTask3Button = PIXI.Texture.fromImage('required/assets/task3button.png');

var task1Button = new Sprite(textureTask1Button);

task1Button.buttonMode = true;

task1Button.interactive = true;

task1Button.anchor.set(0.5);

task1Button.x = 270;

task1Button.y = 720*.35;

task1Button.on('pointerdown',startCardGame);

var task2Button = new Sprite(textureTask2Button);

task2Button.buttonMode = true;

task2Button.anchor.set(0.5);

task2Button.x = 270;

task2Button.y = 720*.5;

var task3Button = new Sprite(textureTask1Button);

task3Button.buttonMode = true;

task3Button.anchor.set(0.5);

task3Button.x = 270;

task3Button.y = 720*.65;

mainMenu.addChild(task1Button);

mainMenu.addChild(task2Button);

mainMenu.addChild(task3Button);

function startCardGame() {

clearMenu();

var sprArr = [];

for (var i = 0; i < 144; i++) {

var cardArr = [];

var card = new Sprite(cardTex);

card.anchor.set(0.5);

card.x = -128;

card.y = 0;

cardArr[0] = card;

cardArr[1] = -1;

mainMenu.addChild(card);

sprArr[i] = cardArr;

}

function clearMenu() {

mainMenu.removeChild(task1Button);

mainMenu.removeChild(task2Button);

mainMenu.removeChild(task3Button);

}

</script>

</body>

</html>

ivan.popelyshev · June 8, 2018

app.stage.addChild(mainMenu)

Sign In

Adding to container doesn't show sprite

Recommended Posts

Endeva

Link to comment

Share on other sites

ivan.popelyshev

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Browse

Activity