Infrarot-Shader
Wäre es nicht cool, wenn man alles im Infrarot-Wärmebild-Look sehen könnte? Hier ein simples Beispiel dafür:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
varying vec2 v_vTexcoord; varying vec4 v_vColour; void main() { // Samplen des Farbwertes vec4 color = texture2D(gm_BaseTexture, v_vTexcoord); // Extrahieren der Luminanz-Komponente float luminance = dot(color.rgb, vec3(0.299, 0.587, 0.114)); // Infrarot-Transformation vec3 infraredColor = vec3(1.0 - luminance, 0.0, luminance); // Anzeigen des Ergebnisses gl_FragColor = vec4(infraredColor, color.a); } |
Da wir hier keine weiteren Variablen brauchen, ist der Rest wie im Ausgangsbeispiel.
Neon-Shader
Eine ähnliche Veränderung können wir mit einem Neon-Effekt erzeugen. Wie gut und wie intensiv der Shader wirkt, hängt sehr stark vom Ausgangsbild ab. Um den Shader besser steuern zu können, haben wir gleich drei Variablen.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
varying vec2 v_vTexcoord; varying vec4 v_vColour; uniform float threshold; uniform float outlineWidth; uniform float outlineBrightness; void main() { vec4 col = texture2D(gm_BaseTexture, v_vTexcoord); // lädt die Farbe des aktuellen Pixels aus der Textur vec3 luminance = vec3(0.299, 0.587, 0.114); // definiert einen Vektor mit den Gewichten der Farbkanäle Rot, Grün und Blau, um den Helligkeitswert des Pixels zu berechnen. Diese Gewichte entsprechen der Helligkeitswahrnehmung des menschlichen Auges. float intensity = dot(col.rgb, luminance); // berechnet die Helligkeit des Pixels, indem die Farbkomponenten mit den Gewichten multipliziert und dann addiert werden. float alpha = smoothstep(threshold, threshold + outlineWidth, intensity); // berechnet den Alpha-Wert, der angibt, wie stark der Umriss an dieser Stelle gezeichnet wird. vec4 outlineCol = vec4(outlineBrightness * vec3(1.0), alpha); // definiert die Farbe des Umrisses. gl_FragColor = mix(col, outlineCol, alpha); } |
Dieser Shader hat eine Funktion, welche die Konturen neu zeichnet. Er erhält Informationen über das Bild, indem er das Texturbild und die Farbe jedes Pixels analysiert.
Da wir drei Variablen haben, müssen wir unsere Events entsprechend anpassen.
Create-Event
1 2 3 4 5 6 |
uni_threshold = shader_get_uniform(sh_neon, "threshold"); uni_outlineWidth = shader_get_uniform(sh_neon, "outlineWidth"); uni_outlineBrightness = shader_get_uniform(sh_neon, "outlineBrightness"); val_threshold = 0.65; val_outlineWidt = 0.25; val_outlineBrightness = 0.15; |
Draw GUI
1 2 3 4 5 6 7 8 9 |
if (shader_is_compiled(sh_neon)) { shader_set(sh_neon); shader_set_uniform_f(uni_threshold, val_threshold); shader_set_uniform_f(uni_outlineWidth, val_outlineWidt); shader_set_uniform_f(uni_outlineBrightness, val_outlineBrightness); draw_surface(surf, 0, 0); shader_reset(); } |