Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

[4.0.0-rc.6] Spine position incorrect inside a container with .setFiltersForceComposite(true)

Abierto
  • ¿Algo no está bien?
#7,204 9 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
45/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
javascript
Área
computer-graphics, game-dev

Línea de trabajo

Comienza ejecutando la reproducción HTML proporcionada con Phaser 4.0.0-rc.6 y el plugin de Spine; después compara el renderizado con y sin setFiltersForceComposite(true) y con allContainer en diferentes posiciones. Sigue las rutas de composición de filtros de contenedores y de renderizado de Spine; el trabajo estará terminado cuando el objeto Spine mantenga la posición correcta en ambos casos de contenedores anidados.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Version

  • Phaser Version: 4.0.0-rc.6

Description

If a spine game object is placed inside a container with .setFiltersForceComposite(true), it's position will be rendered wrong

Example Test Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script>
    <script src="https://unpkg.com/@esotericsoftware/[email protected].*/dist/iife/spine-phaser-v4.min.js"></script>
    <title>Spine Phaser Example</title>
  </head>

  <body>
  </body>
  <script>
    class BasicExample extends Phaser.Scene {
      preload() {
        this.load.spineBinary("spineboy-data", "https://esotericsoftware.com/files/examples/4.2/spineboy/export/spineboy-pro.skel");
        this.load.spineAtlas("spineboy-atlas", "https://esotericsoftware.com/files/examples/4.2/spineboy/export/spineboy-pma.atlas");
      }

      create() {
        const allContainer = this.add.container(100, 100);


        const container = new Phaser.GameObjects.Container(this);
        allContainer.add(container);

        const container2 = new Phaser.GameObjects.Container(this)
            .enableFilters()
            .setFiltersForceComposite(true);
        allContainer.add(container2);


        const spineContainer = new Phaser.GameObjects.Container(this, 300, 400).setScale(0.5);

        spineContainer.add(new Phaser.GameObjects.Rectangle(this, 0, -300, 500, 500, 0xFF0000, 0.5));

        const spine = this.add.spine(0, 0, `spineboy-data`, `spineboy-atlas`);
        spineContainer.add(spine);

        container.add(spineContainer);


        this.time.delayedCall(2000, () => {
            container2.add(spineContainer);
        });
      }
    }

    new Phaser.Game({
      type: Phaser.WEBGL,
      width: 800,
      height: 600,
      scene: [BasicExample],
      plugins: {
        scene: [
          {
            key: "spine.SpinePlugin",
            plugin: spine.SpinePlugin,
            mapping: "spine",
          },
        ],
      },
    });
  </script>
</html>

In the code above, if .setFiltersForceComposite(true) is not called on container2, or if allContainer is at position (0,0) then the spine will be rendered correctly

Lenguaje dominante
JavaScript
Estrellas
40.3k
Forks
7.2k
Sin PR fusionados en 30 d

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de phaserjs/phaser

Todos los issues de phaserjs/phaser

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.