From 218a806ec240de4500a020838a27c9cb289d019d Mon Sep 17 00:00:00 2001 From: Ray Date: Mon, 29 Sep 2025 18:01:42 +0200 Subject: [PATCH] REVIEWED: example: `shaders_ascii_rendering` --- .../resources/shaders/glsl330/ascii.fs | 43 ++++++++---------- ...cii_effect.c => shaders_ascii_rendering.c} | 36 +++++++-------- ...effect.png => shaders_ascii_rendering.png} | Bin 3 files changed, 37 insertions(+), 42 deletions(-) rename examples/shaders/{shaders_ascii_effect.c => shaders_ascii_rendering.c} (81%) rename examples/shaders/{shaders_ascii_effect.png => shaders_ascii_rendering.png} (100%) diff --git a/examples/shaders/resources/shaders/glsl330/ascii.fs b/examples/shaders/resources/shaders/glsl330/ascii.fs index 4477f948d..014966835 100644 --- a/examples/shaders/resources/shaders/glsl330/ascii.fs +++ b/examples/shaders/resources/shaders/glsl330/ascii.fs @@ -10,42 +10,42 @@ uniform sampler2D texture0; uniform vec2 resolution; uniform float fontSize; -float greyScale(in vec3 col) { +float GreyScale(in vec3 col) +{ return dot(col, vec3(0.2126, 0.7152, 0.0722)); } -float character(float n, vec2 p) +float GetCharacter(float n, vec2 p) { - p = floor(p * vec2(4.0, -4.0) + 2.5); + p = floor(p*vec2(4.0, -4.0) + 2.5); - // Check if the coordinate is inside the 5x5 grid (0 to 4). - if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y) { - - if (int(mod(n / exp2(p.x + 5.0 * p.y), 2.0)) == 1) { - return 1.0; // The bit is on, so draw this part of the character. + // Check if the coordinate is inside the 5x5 grid (0 to 4) + if (clamp(p.x, 0.0, 4.0) == p.x && clamp(p.y, 0.0, 4.0) == p.y) + { + if (int(mod(n/exp2(p.x + 5.0 * p.y), 2.0)) == 1) + { + return 1.0; // The bit is on, so draw this part of the character } } - return 0.0; // The bit is off, or we are outside the grid. + return 0.0; // The bit is off, or we are outside the grid } // ----------------------------------------------------------------------------- // Main shader logic // ----------------------------------------------------------------------------- - void main() { - vec2 charPixelSize = vec2(fontSize, fontSize * 1.8); - vec2 uvCellSize = charPixelSize / resolution; - - vec2 cellUV = floor(fragTexCoord / uvCellSize) * uvCellSize; + vec2 charPixelSize = vec2(fontSize, fontSize*1.8); + vec2 uvCellSize = charPixelSize/resolution; + vec2 cellUV = floor(fragTexCoord/uvCellSize)*uvCellSize; vec3 cellColor = texture(texture0, cellUV).rgb; - float gray = greyScale(cellColor); + float gray = GreyScale(cellColor); float n = 4096; - // limited character set + // Limited character set if (gray > 0.2) n = 65600.0; // : if (gray > 0.3) n = 163153.0; // * if (gray > 0.4) n = 15255086.0; // o @@ -54,13 +54,10 @@ void main() if (gray > 0.7) n = 13195790.0; // @ if (gray > 0.8) n = 11512810.0; // # - vec2 localUV = (fragTexCoord - cellUV) / uvCellSize; // Range [0.0, 1.0] + vec2 localUV = (fragTexCoord - cellUV)/uvCellSize; // Range [0.0, 1.0] + vec2 p = localUV*2.0 - 1.0; - vec2 p = localUV * 2.0 - 1.0; + float charShape = GetCharacter(n, p); - float charShape = character(n, p); - - vec3 final_col = cellColor * charShape; - - finalColor = vec4(final_col, 1.0); + finalColor = vec4(cellColor*charShape, 1.0); } \ No newline at end of file diff --git a/examples/shaders/shaders_ascii_effect.c b/examples/shaders/shaders_ascii_rendering.c similarity index 81% rename from examples/shaders/shaders_ascii_effect.c rename to examples/shaders/shaders_ascii_rendering.c index c505d8516..5444caeee 100644 --- a/examples/shaders/shaders_ascii_effect.c +++ b/examples/shaders/shaders_ascii_rendering.c @@ -1,8 +1,8 @@ /******************************************************************************************* * -* raylib [shaders] example - ascii effect +* raylib [shaders] example - ascii rendering * -* Example complexity rating: [★☆☆☆] 1/4 +* Example complexity rating: [★★☆☆] 2/4 * * Example originally created with raylib 5.5, last time updated with raylib 5.6 * @@ -33,7 +33,7 @@ int main(void) const int screenWidth = 800; const int screenHeight = 450; - InitWindow(screenWidth, screenHeight, "raylib [shaders] example - ascii effect"); + InitWindow(screenWidth, screenHeight, "raylib [shaders] example - ascii rendering"); // Texture to test static drawing Texture2D fudesumi = LoadTexture("resources/fudesumi.png"); @@ -43,7 +43,7 @@ int main(void) // Load shader to be used on postprocessing Shader shader = LoadShader(0, TextFormat("resources/shaders/glsl%i/ascii.fs", GLSL_VERSION)); - // These locations are used to send data to the GPU. + // These locations are used to send data to the GPU int resolutionLoc = GetShaderLocation(shader, "resolution"); int fontSizeLoc = GetShaderLocation(shader, "fontSize"); @@ -69,33 +69,31 @@ int main(void) { // Update //---------------------------------------------------------------------------------- - if (circlePos.x > 200.0f || circlePos.x < 40.0f) { - circleSpeed *= -1; - } circlePos.x += circleSpeed; + + if ((circlePos.x > 200.0f) || (circlePos.x < 40.0f)) circleSpeed *= -1; + //---------------------------------------------------------------------------------- // Draw //---------------------------------------------------------------------------------- - + // Draw our scene to a render texture first BeginTextureMode(target); - ClearBackground(WHITE); // The background of the scene itself + ClearBackground(WHITE); - DrawTexture(fudesumi, 500, -30, WHITE); // Using custom shader + DrawTexture(fudesumi, 500, -30, WHITE); DrawTextureV(raysan, circlePos, WHITE); - + EndTextureMode(); + BeginDrawing(); - ClearBackground(RAYWHITE); BeginShaderMode(shader); - - // Draw the scene texture (that we rendered earlier) to the screen. - // The shader will process every pixel of this texture. - DrawTextureRec(target.texture, - (Rectangle){ 0, 0, (float)target.texture.width, (float)-target.texture.height }, - (Vector2){ 0, 0 }, - WHITE); + // Draw the render texture containing scene + // The shader will process every pixel on the screen + DrawTextureRec(target.texture, + (Rectangle){ 0, 0, (float)target.texture.width, (float)-target.texture.height }, + (Vector2){ 0, 0 }, WHITE); EndShaderMode(); DrawRectangle(0, 0, screenWidth, 40, BLACK); diff --git a/examples/shaders/shaders_ascii_effect.png b/examples/shaders/shaders_ascii_rendering.png similarity index 100% rename from examples/shaders/shaders_ascii_effect.png rename to examples/shaders/shaders_ascii_rendering.png