PixiJs Sprites добавляет строку вверху
Каким-то образом я получаю дополнительный небольшой артефакт в верхней части моих кадров AnimatedSprite. Я почти уверен, что это нижняя часть спрайта, указанного выше. Я думал, что мой лист спрайтов PNG отключен, поэтому я использовал TexturePacker, чтобы разбить и заново собрать таблицу спрайтов. Хотя таблица спрайтов JSON, которую я использую, не совпадает с таблицей, сгенерированной TexturePacker, но координаты совпадают. Я даже пробовал заменить некоторые кадры содержимым из версии с пакетом текстур.
Вот JSON, сокращенный до последнего кадра - он выходит с фантомной линией вверху:
{
"meta": {
"image": "slime3.png",
"size": {"w":288,"h":160},
"scale": "1"
},
"frames": {
"slime_pink_die_1": {
"frame": {"x":256,"y":128,"w":32,"h":32},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x":0,"y":0,"w":32,"h":32},
"sourceSize": {"w":32,"h":32}
}
}
}
Вот как это загружается:
const slimecolors = ['pink'];
const slimeActions = [{name:'die',frames:1}];
slimecolors.forEach(slimeColor => {
const slimeActionTextures = [];
slimeActions.forEach(action => {
const actionTextures = [];
for (let j = 0; j < action.frames; j++) {
const texture = Texture.from(`slime_${slimeColor}_${action.name}_${j + 1}`);
actionTextures.push(texture);
}
slimeActionTextures.push(actionTextures);
});
const slime = new AnimatedSprite(slimeActionTextures[0]);
slime.actions = slimeActionTextures;
slime.x = (this.screen.width-128) * Math.random() + 64;
slime.y = (this.screen.height-128) * Math.random() + 64;
slime.dx = 2 * Math.random() * Math.sign(Math.random() - 0.5);
slime.dy = 2 * Math.random() * Math.sign(Math.random() - 0.5);
slime.scale.set(1 + (2 * Math.random()));
slime.animationSpeed = 0.25;
slime.gotoAndPlay(Math.random() * 4);
this.slimes.push(slime);
this.stage.addChild(this.slimes.slice(-1)[0]);
});
(здесь это экземпляр PIXI.Application).
У спрайтов в верхнем ряду нет этого артефакта, поэтому я перепаковал.