Actualmente estoy trabajando en un juego 2D, y mi tarea actual es delinear el objeto seleccionado.
Básicamente utilizo un sombreador de desenfoque para hacerlo en tiempo de ejecución completo. Primero dibujo mi sprite usando un sombreador de desenfoque gaussiano vertical, luego lo dibujo con un sombreador de desenfoque gaussiano horizontal, y luego dibujo mi sprite normalmente.
Aquí está mi sombreador de desenfoque: sampler TextureSampler: register (s0);
#define SAMPLE_COUNT 15
float2 SampleOffsets[SAMPLE_COUNT];
float SampleWeights[SAMPLE_COUNT];
float4 PixelShaderFunction(float2 texCoord : TEXCOORD0) : COLOR0
{
float4 c = 0;
// Combine a number of weighted image filter taps.
for (int i = 0; i < SAMPLE_COUNT; i++)
{
c += tex2D(TextureSampler, texCoord + SampleOffsets[i]) * SampleWeights[i];
}
return c;
}
SampleOffets son los desplazamientos que me permiten probar píxeles de redondeo SampleWeights son pesos calculados con función gaussiana ( http://en.wikipedia.org/wiki/Gaussian_blur )
Aquí está el resultado:
No es tan malo, bastante suave, pero no lo suficientemente visible en el juego ... Pero me gustaría poder controlar el grosor (para hacerlo más grande) y agregar un primer contorno opaco antes de desvanecerlo en alfa (para hacer es más visible) Y siento que el desenfoque gaussiano tal vez no sea tan bueno como pensé para mi tarea :)
Otra idea es generarlo automáticamente desde el .png (usando un script de Photoshop para hacerlo automático). Solo necesito llenar los píxeles del contorno con un color personalizado, almacenando el valor alfa en el componente Rojo, por ejemplo, y establecer todos los demás componentes en 0. Luego, solo tengo que aplicar un sombreador que reemplace los píxeles transparentes al color que quiero.
float4 PixelShaderFunction2(float2 texCoord : TEXCOORD0) : COLOR0
{
float4 color = tex2D(TextureSampler, texCoord);
float4 newColor = 0;
if (color.a == 0 && color.r != 0)
{
color.a = color.r;
// Blue outline
color.b = 1;
}
}
El problema es que estoy usando la compresión DXT5 para mi sprite, así que no puedo estar seguro de que el color que obtendré en mi sombreador será exactamente el mismo que escribí. Es por eso que ni siquiera lo intenté ... ¿Alguna idea?
Cualquier consejo sería bienvenido :)
fuente
Respuestas:
Lo que probablemente esté buscando es una forma de detección de bordes antes, después o incluso antes y después de su desenfoque gaussiano. Tal vez una versión de Sobel Edge Detection podría funcionar. Sé que tu juego es 2D, pero si la página wiki es demasiado tosca, aquí hay un tutorial sobre cómo hacerlo funcionar en el UDK que podría traducirse mejor.
Su detección de bordes solo tiene que encontrar los bordes del canal alfa si necesita un aumento de velocidad.
fuente
Lo que funcionó para mí con la descripción del texto fue:
Puede hacer lo mismo: todo lo que necesita hacer es dibujar el sprite con los píxeles opacos coloreados con su color de contorno. (Mantenga los valores de transparencia para que los bordes redondos sigan pareciendo redondos).
Esto funciona, se ve mejor que dibujar una versión a escala y tiene algunas otras propiedades interesantes (como poder controlar el contorno alfa para la negrita y retener los "agujeros" en la imagen de su sprite): el único inconveniente es que puede ' No controlas demasiado bien el ancho del contorno.
fuente
Soy algo nuevo en todo esto, pero aquí está mi idea:
Podrías usar el canal alfa de tu textura para hacer otra textura. Cualquier valor alfa por debajo de un valor umbral se establecerá en totalmente transparente. Cualquier anterior será completamente opaco. Con esta nueva textura, puede establecer los valores de RGB para que sean del color que desee. Escala esta nueva "textura" para que sea un poco más grande que la textura de tu personaje. Esto te daría un bonito color sólido alrededor del personaje. Luego, use ese color con su sombreador gaussiano para darle un brillo agradable alrededor de su textura creada. Supongo que esto podría hacerse sin crear otra textura, y ser todo sombreador basado en la textura del personaje.
¿Tiene esto algún sentido?
fuente