Antialiasing 2D:

Ver también

Godot también admite antialiasing en renderizado 3D. Esto se explica en la página 3D antialiasing.

Introducción

Debido a su resolución limitada, las escenas renderizadas en 2D pueden presentar artefactos de aliasing. Estos artefactos generalmente se manifiestan en forma de un efecto de "escalera" en los bordes de la geometría y son más notorios cuando se usan nodos como Line2D, Polygon2D o TextureProgressBar. Dibujos personalizados en 2D también puede tener artefactos de alias para métodos que no admiten antialiasing.

En el siguiente ejemplo, puedes observar cómo los bordes tienen una apariencia de bloque:

La imagen tiene una escala de 2× con filtrado del vecino más cercano para hacer que el alias sea más notorio.

La imagen tiene una escala de 2× con filtrado del vecino más cercano para hacer que el alias sea más notorio.

Para combatir esto, Godot admite varios métodos para habilitar el antialiasing en renderizado 2D.

Propiedad Antialiasing en Line2D y dibujos personalizados

Este es el método recomendado, ya que tiene un menor impacto en el rendimiento en la mayoría de los casos.

Line2D tiene una propiedad Antialiased (Suavisado) que puedes habilitar en el inspector. Además, varios métodos para Dibujos personalizados en 2D admiten un parámetro opcional antialiased, que se puede establecer en true al llamar a la función.

Estos métodos no requieren que MSAA esté habilitado, lo que hace que su costo de rendimiento básico sea bajo. En otras palabras, no hay ningún coste añadido permanente si no dibujas ninguna geometría suavizada en algún momento.

La desventaja de estos métodos de antialiasing es que funcionan generando geometría adicional. Si estás generando una geometría 2D compleja que se actualiza en cada frame, esto puede ser un cuello de botella. Además, Polygon2D, TextureProgressBar y varios métodos de dibujo personalizados no cuentan con una propiedad de suavisado. Para estos nodos, puedes utilizar antialiasing multimuestra 2D en su lugar.

Antialiasing de muestras múltiples (MSAA)

Esto solo está disponible en los renderizadores Forward+ y Mobile, no en el renderizador Compatibility.

Antes de habilitar MSAA en 2D, es importante comprender sobre qué funcionará MSAA. MSAA en 2D sigue restricciones similares a las del 3D. Si bien no introduce ninguna borrosidad, su ámbito de aplicación es limitado. Las principales aplicaciones de MSAA 2D son:

  • Bordes geométricos, como dibujo de líneas y polígonos.

  • Borde de sprite solo para píxeles que tocan uno de los bordes de la textura. Esto funciona tanto para el filtrado lineal como para el filtrado vecino más cercano. Los bordes de los sprites creados usando transparencia en la imagen no se ven afectados por MSAA.

La desventaja de MSAA es que sólo opera en los bordes. Esto se debe a que MSAA aumenta la cantidad de muestras de cobertura, pero no la cantidad de muestras de color. Sin embargo, dado que la cantidad de muestras de color no aumentó, los shaders de fragmentos aún se ejecutan solo una vez para cada píxel. Como resultado, MSAA no afectará los siguientes tipos de suavisado de ninguna manera:

  • Alias dentro de texturas con filtro vecino más cercano (pixel art).

  • Alias causado por shaders 2D personalizados.

  • Alias especular al utilizar Light2D.

  • Aliasing en el renderizado de fuentes.

MSAA can be enabled in the Project Settings by changing the value of the Rendering > Anti Aliasing > Quality > MSAA 2D setting. It's important to change the value of the MSAA 2D setting and not MSAA 3D, as these are entirely separate settings.

Comparación entre sin antialiasing (izquierda) y varios niveles de MSAA (derecha). La esquina superior izquierda contiene un nodo Line2D, la esquina superior derecha contiene 2 nodos TextureProgressBar. La parte inferior contiene 8 sprites de pixel art, 4 de ellos tocando los bordes (fondo verde) y 4 de ellos sin tocar los bordes (logotipo de Godot):

../../_images/antialiasing_msaa_2x.webp ../../_images/antialiasing_msaa_4x.webp ../../_images/antialiasing_msaa_8x.webp