• Runtimes
  • spine-pixi to spine-phaser migration

Hello everyone. I have a spine asset that used to be displayed through spine-pixi, after refactor to spine-phaser that same asset is a little bit pixelated. Is there any way to increase spine asset resolution?

  • Davide ответили на это сообщение.
    Related Discussions
    ...

    To address the pixelation issue when migrating from spine-pixi to spine-phaser, you can try a few approaches to improve the resolution of your Spine assets. First, ensure that your Spine assets are exported at a high resolution. You can work with high-resolution images in Spine and scale them down as needed for your project. During runtime, you can choose the closest asset size that matches the user's screen resolution to maintain quality. Additionally, check the filtering settings in your Phaser project. Using appropriate filtering modes like linear or bilinear filtering can help reduce pixelation. You might also want to verify that the major.minor version of spine-phaser matches the Spine Editor version you are exporting from, as this can affect how assets are rendered.

    medard

    That might be related to texture filtering.
    Pixelated textures usually imply Nearest filtering, but Linear is used by default, so that's strange.

    spine-phaser uses spine-webgl under the hood, and for textures, it utilizes our GLTexture class.
    Try using setFilters on the texture and check if the results match your expectations.

    If you still encounter issues, I’ll need you to share a minimal reproduction project so we can visualize and debug the problem.

    What I found out is that its a problem related to scaling down. If I use spine object in original size there is no pixelation.

    • Davide ответили на это сообщение.

      medard

      Have you tried what I suggested above?

      What you're describing is most likely related to mipmaps. As you can see here, setFilters will also enable mipmaps if the appropriate minFilter is provided to that function.

      Yeah mipmap does the trick.
      this.scene.spine
      .getAtlas(GAME_ASSET)
      .pages[0].texture?.setFilters(
      TextureFilter.MipMapLinearLinear,
      TextureFilter.MipMapLinearLinear,
      ),

      Thanks for your help!