diff --git a/examples/shaders/resources/LICENSE.md b/examples/shaders/resources/LICENSE.md index b08a555ab..96458eca5 100644 --- a/examples/shaders/resources/LICENSE.md +++ b/examples/shaders/resources/LICENSE.md @@ -9,5 +9,3 @@ | raysan.png | [@raysan5](https://github.com/raysan5) | [CC0](https://creativecommons.org/publicdomain/zero/1.0/) | - | | space.png | ❔ | ❔ | - | | texel_checker.png | [@raysan5](https://github.com/raysan5) | [CC0](https://creativecommons.org/publicdomain/zero/1.0/) | Made with [UV Checker Map Maker](http://uvchecker.byvalle.com/) | -| egg.png | [@GoldenThumbs](https://github.com/GoldenThumbs) | -| torus.png | [@GoldenThumbs](https://github.com/GoldenThumbs) | diff --git a/examples/shaders/resources/egg.png b/examples/shaders/resources/egg.png deleted file mode 100644 index c85249523..000000000 Binary files a/examples/shaders/resources/egg.png and /dev/null differ diff --git a/examples/shaders/resources/shaders/glsl330/outline.fs b/examples/shaders/resources/shaders/glsl330/outline.fs index c1be1b5de..804a1a597 100644 --- a/examples/shaders/resources/shaders/glsl330/outline.fs +++ b/examples/shaders/resources/shaders/glsl330/outline.fs @@ -7,30 +7,29 @@ in vec4 fragColor; // Input uniform values uniform sampler2D texture0; uniform vec4 colDiffuse; -uniform vec2 texScale; + +uniform vec2 textureSize; +uniform float outlineSize; +uniform vec4 outlineColor; // Output fragment color out vec4 finalColor; -// Function for drawing outlines on alpha-blended textures -vec4 DrawOutline(sampler2D tex, vec2 uv, vec2 lineScale, vec3 lineCol) -{ - vec2 texelScale = 1.0 / lineScale; - vec4 center = texture(tex, uv); // We sample the center texel, (with all color data) - // Next we sample four corner texels, but only for the alpha channel (this is for the outline) - vec4 corners; - corners.x = texture(tex, uv+vec2( texelScale.x, texelScale.y)).a; - corners.y = texture(tex, uv+vec2( texelScale.x,-texelScale.y)).a; - corners.z = texture(tex, uv+vec2(-texelScale.x, texelScale.y)).a; - corners.w = texture(tex, uv+vec2(-texelScale.x,-texelScale.y)).a; - - float outline = min(dot(corners, vec4(1.0)), 1.0); - vec4 col = mix(vec4(0.0), vec4(lineCol, 1.0), outline); - col = mix(col, center, center.a); - return col; -} - void main() { - finalColor = DrawOutline(texture0, fragTexCoord, texScale, vec3(0.0)); + vec4 texel = texture(texture0, fragTexCoord); // Get texel color + vec2 texelScale = vec2(0.0); + texelScale.x = outlineSize/textureSize.x; + texelScale.y = outlineSize/textureSize.y; + + // We sample four corner texels, but only for the alpha channel (this is for the outline) + vec4 corners = vec4(0.0); + corners.x = texture(texture0, fragTexCoord + vec2(texelScale.x, texelScale.y)).a; + corners.y = texture(texture0, fragTexCoord + vec2(texelScale.x, -texelScale.y)).a; + corners.z = texture(texture0, fragTexCoord + vec2(-texelScale.x, texelScale.y)).a; + corners.w = texture(texture0, fragTexCoord + vec2(-texelScale.x, -texelScale.y)).a; + + float outline = min(dot(corners, vec4(1.0)), 1.0); + vec4 color = mix(vec4(0.0), outlineColor, outline); + finalColor = mix(color, texel, texel.a); } \ No newline at end of file diff --git a/examples/shaders/resources/torus.png b/examples/shaders/resources/torus.png deleted file mode 100644 index 399d78257..000000000 Binary files a/examples/shaders/resources/torus.png and /dev/null differ diff --git a/examples/shaders/shaders_shapes_outline.c b/examples/shaders/shaders_texture_outline.c similarity index 63% rename from examples/shaders/shaders_shapes_outline.c rename to examples/shaders/shaders_texture_outline.c index 30194c4b7..c40abf950 100644 --- a/examples/shaders/shaders_shapes_outline.c +++ b/examples/shaders/shaders_texture_outline.c @@ -5,12 +5,10 @@ * NOTE: This example requires raylib OpenGL 3.3 or ES2 versions for shaders support, * OpenGL 1.1 does not support shaders, recompile raylib to OpenGL 3.3 version. * -* NOTE: Shaders used in this example are #version 330 (OpenGL 3.3). -* * This example has been created using raylib 3.8 (www.raylib.com) * raylib is licensed under an unmodified zlib/libpng license (View raylib.h for details) * -* Example contributed by Samuel Skiff (@GoldenThumbs) +* Example contributed by Samuel Skiff (@GoldenThumbs) and reviewed by Ramon Santamaria (@raysan5) * * Copyright (c) 2021 Samuel SKiff (@GoldenThumbs) and Ramon Santamaria (@raysan5) * @@ -33,13 +31,23 @@ int main(void) InitWindow(screenWidth, screenHeight, "raylib [shaders] example - Apply an outline to a texture"); - Texture2D egg = LoadTexture("resources/egg.png"); - Texture2D torus = LoadTexture("resources/torus.png"); + Texture2D texture = LoadTexture("resources/fudesumi.png"); + Shader shdrOutline = LoadShader(0, TextFormat("resources/shaders/glsl%i/outline.fs", GLSL_VERSION)); - float outlineScale = 16.0f; - float textureScale[2] = { 16.0f*4, 16.0f*4 }; - SetShaderValue(shdrOutline, GetShaderLocation(shdrOutline, "texScale"), textureScale, SHADER_UNIFORM_VEC2); + float outlineSize = 2.0f; + float outlineColor[4] = { 1.0f, 0.0f, 0.0f, 1.0f }; // Normalized RED color + float textureSize[2] = { (float)texture.width, (float)texture.height }; + + // Get shader locations + int outlineSizeLoc = GetShaderLocation(shdrOutline, "outlineSize"); + int outlineColorLoc = GetShaderLocation(shdrOutline, "outlineColor"); + int textureSizeLoc = GetShaderLocation(shdrOutline, "textureSize"); + + // Set shader values (they can be changed later) + SetShaderValue(shdrOutline, outlineSizeLoc, &outlineSize, SHADER_UNIFORM_FLOAT); + SetShaderValue(shdrOutline, outlineColorLoc, outlineColor, SHADER_UNIFORM_VEC4); + SetShaderValue(shdrOutline, textureSizeLoc, textureSize, SHADER_UNIFORM_VEC2); SetTargetFPS(60); // Set our game to run at 60 frames-per-second //-------------------------------------------------------------------------------------- @@ -49,7 +57,10 @@ int main(void) { // Update //---------------------------------------------------------------------------------- - // TODO: Update your variables here + outlineSize += GetMouseWheelMove(); + if (outlineSize < 1.0f) outlineSize = 1.0f; + + SetShaderValue(shdrOutline, outlineSizeLoc, &outlineSize, SHADER_UNIFORM_FLOAT); //---------------------------------------------------------------------------------- // Draw @@ -59,11 +70,14 @@ int main(void) ClearBackground(RAYWHITE); BeginShaderMode(shdrOutline); - DrawTextureEx(egg, (Vector2){ 0, 230 }, 0.0, outlineScale, WHITE); - DrawTextureEx(torus, (Vector2){ 544, 230 }, 0.0, outlineScale, WHITE); + + DrawTexture(texture, GetScreenWidth()/2 - texture.width/2, -30, WHITE); + EndShaderMode(); - DrawText("Shader-based outlines for textures", 190, 200, 20, LIGHTGRAY); + DrawText("Shader-based\ntexture\noutline", 10, 10, 20, GRAY); + + DrawText(TextFormat("Outline size: %i px", (int)outlineSize), 10, 120, 20, MAROON); DrawFPS(710, 10); @@ -73,8 +87,7 @@ int main(void) // De-Initialization //-------------------------------------------------------------------------------------- - UnloadTexture(egg); - UnloadTexture(torus); + UnloadTexture(texture); UnloadShader(shdrOutline); CloseWindow(); // Close window and OpenGL context diff --git a/examples/shaders/shaders_texture_outline.png b/examples/shaders/shaders_texture_outline.png new file mode 100644 index 000000000..85c69b180 Binary files /dev/null and b/examples/shaders/shaders_texture_outline.png differ