feat: forked clay SDL3 renderer and added separate corner radii

src/main.c

@@ -1,7 +1,5 @@
-#include <SDL3/SDL_mouse.h>
-#define CLAY_IMPLEMENTATION
 #include <clay/clay.h>
-#include <clay/renderers/SDL3/clay_renderer_SDL3.c>
+#include "renderer/clay_renderer_SDL3.h"
 
 #include "application.h"
 #include "defs.h"
@@ -12,6 +10,7 @@
 #include <SDL3/SDL_events.h>
 #include <SDL3/SDL_init.h>
 #include <SDL3/SDL_log.h>
+#include <SDL3/SDL_mouse.h>
 #include <SDL3/SDL_render.h>
 #include <SDL3/SDL_video.h>
 #include <SDL3_ttf/SDL_ttf.h>

src/renderer/clay_renderer_SDL3.c

@@ -0,0 +1,261 @@
+#include "clay_renderer_SDL3.h"
+
+#define CLAY_IMPLEMENTATION
+#include <clay/clay.h>
+#include <SDL3/SDL.h>
+#include <SDL3/SDL_main.h>
+#include <SDL3/SDL_render.h>
+#include <SDL3_image/SDL_image.h>
+#include <SDL3_ttf/SDL_ttf.h>
+#include <assert.h>
+#include <stddef.h>
+
+
+/* Global for convenience. Even in 4K this is enough for smooth curves (low radius or rect size coupled with
+ * no AA or low resolution might make it appear as jagged curves) */
+static int NUM_CIRCLE_SEGMENTS = 16;
+
+static void SDL_Clay_GenerateRoundedRectCorner(SDL_Vertex *vertices, size_t begin, size_t count, SDL_FPoint origin, SDL_FPoint offset, SDL_FColor color, SDL_FPoint texel, float radius) {
+    assert(count > 0);
+    if (count == 1) {
+        vertices[begin] = (SDL_Vertex){ { origin.x, origin.y }, color, texel };
+    } else {
+        constexpr double quarterCircleRadians = SDL_PI_D / 2.0;
+        for (size_t i = 0; i < count; ++i) {
+            double const angle = (quarterCircleRadians / ((double)count-1)) * i;
+            vertices[begin + i] = (SDL_Vertex) { .position = {
+                    origin.x + (radius * (offset.x * SDL_cos(angle) - offset.y * SDL_sin(angle))),
+                    origin.y + (radius * (offset.x * SDL_sin(angle) + offset.y * SDL_cos(angle)))
+                },
+                .color = color, .tex_coord = texel
+            };
+        }
+    }
+}
+
+//all rendering is performed by a single SDL call, avoiding multiple RenderRect + plumbing choice for circles.
+static void SDL_Clay_RenderFillRoundedRect(Clay_SDL3RendererData *rendererData, const SDL_FRect rect, const Clay_CornerRadius cornerRadius, const Clay_Color clayColor) {
+    static constexpr SDL_FPoint topLeftTexel = { 0, 0 };
+    static constexpr SDL_FPoint topRightTexel = { 1, 0 };
+    static constexpr SDL_FPoint bottomRightTexel = { 1, 1 };
+    static constexpr SDL_FPoint bottomLeftTexel = { 0, 1 };
+    SDL_FColor const color = { clayColor.r/255, clayColor.g/255, clayColor.b/255, clayColor.a/255 };
+
+    const float maxRadius = SDL_min(rect.w, rect.h) / 2.0f;
+    float radii[4] = {
+        SDL_min(cornerRadius.topLeft, maxRadius),
+        SDL_min(cornerRadius.topRight, maxRadius),
+        SDL_min(cornerRadius.bottomLeft, maxRadius),
+        SDL_min(cornerRadius.bottomRight, maxRadius),
+    };
+    int numCircleSegments[4] = { 1, 1, 1, 1 };
+    int totalVertices = 0;
+    for (int i = 0; i < 4; ++i) {
+        numCircleSegments[i] = SDL_clamp((int)radii[i] / 2, 1, NUM_CIRCLE_SEGMENTS);
+        SDL_Log("num segments %d: %d", i, numCircleSegments[i]); 
+        SDL_Log("radius %d: %f", i, radii[i]);
+        totalVertices += numCircleSegments[i];
+    }
+
+    size_t vindex = 0;
+    // generate topleft corner
+    SDL_FPoint origin = {
+        rect.x + radii[0],
+        rect.y + radii[0]
+    };
+    SDL_FPoint offset = { -1, 0 };
+    SDL_Vertex vertices[totalVertices];
+    SDL_Clay_GenerateRoundedRectCorner(vertices, vindex, numCircleSegments[0], origin, offset, color, topLeftTexel, radii[0]);
+    vindex += numCircleSegments[0];
+    origin = (SDL_FPoint) {
+        rect.x + rect.w - radii[1],
+        rect.y + radii[1]
+    };
+    offset = (SDL_FPoint) { 0, -1 };
+    SDL_Clay_GenerateRoundedRectCorner(vertices, vindex, numCircleSegments[1], origin, offset, color, topRightTexel, radii[1]);
+    vindex += numCircleSegments[1];
+    origin = (SDL_FPoint) {
+        rect.x + rect.w - radii[2],
+        rect.y + rect.h - radii[2]
+    };
+    offset = (SDL_FPoint) { 1, 0 };
+    SDL_Clay_GenerateRoundedRectCorner(vertices, vindex, numCircleSegments[2], origin, offset, color, bottomRightTexel, radii[2]);
+    vindex += numCircleSegments[2];
+    origin = (SDL_FPoint) {
+        rect.x + radii[3],
+        rect.y + rect.h - radii[3]
+    };
+    offset = (SDL_FPoint) { 0, 1 };
+    SDL_Clay_GenerateRoundedRectCorner(vertices, vindex, numCircleSegments[3], origin, offset, color, bottomLeftTexel, radii[3]);
+    vindex += numCircleSegments[3];
+
+    assert(vindex == totalVertices);
+    size_t totalTris = totalVertices - 2;
+    int totalIndeces = totalTris * 3;
+    int indeces[totalTris * 3];
+    for (size_t i = 0; i < totalTris; ++i) {
+        int *tri = indeces + (i * 3);
+        tri[0] = i + 1;
+        tri[1] = i + 2;
+        tri[2] = 0;
+    }
+
+    // Render everything
+    SDL_RenderGeometry(rendererData->renderer, NULL, vertices, totalVertices, indeces, totalIndeces);
+    // Render debug info
+#if 1
+    for (size_t i = 0; i < totalTris; ++i) {
+        SDL_SetRenderDrawColor(rendererData->renderer, 255, 255, 255, 255);
+        SDL_RenderLine(rendererData->renderer, vertices[0].position.x, vertices[0].position.y, vertices[i+2].position.x, vertices[i+2].position.y);
+        SDL_RenderLine(rendererData->renderer, vertices[0].position.x, vertices[0].position.y, vertices[i+1].position.x, vertices[i+1].position.y);
+        SDL_RenderLine(rendererData->renderer, vertices[i+1].position.x, vertices[i+1].position.y, vertices[i+2].position.x, vertices[i+2].position.y);
+    }
+#endif
+}
+
+static void SDL_Clay_RenderArc(Clay_SDL3RendererData *rendererData, const SDL_FPoint center, const float radius, const float startAngle, const float endAngle, const float thickness, const Clay_Color color) {
+    SDL_SetRenderDrawColor(rendererData->renderer, color.r, color.g, color.b, color.a);
+
+    const float radStart = startAngle * (SDL_PI_F / 180.0f);
+    const float radEnd = endAngle * (SDL_PI_F / 180.0f);
+
+    const int numCircleSegments = SDL_max(NUM_CIRCLE_SEGMENTS, (int)(radius * 1.5f)); //increase circle segments for larger circles, 1.5 is arbitrary.
+
+    const float angleStep = (radEnd - radStart) / (float)numCircleSegments;
+    const float thicknessStep = 0.4f; //arbitrary value to avoid overlapping lines. Changing THICKNESS_STEP or numCircleSegments might cause artifacts.
+
+    for (float t = thicknessStep; t < thickness - thicknessStep; t += thicknessStep) {
+        SDL_FPoint points[numCircleSegments + 1];
+        const float clampedRadius = SDL_max(radius - t, 1.0f);
+
+        for (int i = 0; i <= numCircleSegments; i++) {
+            const float angle = radStart + i * angleStep;
+            points[i] = (SDL_FPoint){
+                    SDL_roundf(center.x + SDL_cosf(angle) * clampedRadius),
+                    SDL_roundf(center.y + SDL_sinf(angle) * clampedRadius) };
+        }
+        SDL_RenderLines(rendererData->renderer, points, numCircleSegments + 1);
+    }
+}
+
+SDL_Rect currentClippingRectangle;
+
+void SDL_Clay_RenderClayCommands(Clay_SDL3RendererData *rendererData, Clay_RenderCommandArray *rcommands)
+{
+    for (size_t i = 0; i < rcommands->length; i++) {
+        Clay_RenderCommand *rcmd = Clay_RenderCommandArray_Get(rcommands, i);
+        const Clay_BoundingBox bounding_box = rcmd->boundingBox;
+        const SDL_FRect rect = { (int)bounding_box.x, (int)bounding_box.y, (int)bounding_box.width, (int)bounding_box.height };
+
+        switch (rcmd->commandType) {
+            case CLAY_RENDER_COMMAND_TYPE_RECTANGLE: {
+                Clay_RectangleRenderData *config = &rcmd->renderData.rectangle;
+                SDL_SetRenderDrawBlendMode(rendererData->renderer, SDL_BLENDMODE_BLEND);
+                SDL_SetRenderDrawColor(rendererData->renderer, config->backgroundColor.r, config->backgroundColor.g, config->backgroundColor.b, config->backgroundColor.a);
+                if (config->cornerRadius.topLeft > 0) {
+                    SDL_Clay_RenderFillRoundedRect(rendererData, rect, config->cornerRadius, config->backgroundColor);
+                } else {
+                    SDL_RenderFillRect(rendererData->renderer, &rect);
+                }
+            } break;
+            case CLAY_RENDER_COMMAND_TYPE_TEXT: {
+                Clay_TextRenderData *config = &rcmd->renderData.text;
+                TTF_Font *font = rendererData->fonts[config->fontId];
+                TTF_SetFontSize(font, config->fontSize);
+                TTF_Text *text = TTF_CreateText(rendererData->textEngine, font, config->stringContents.chars, config->stringContents.length);
+                TTF_SetTextColor(text, config->textColor.r, config->textColor.g, config->textColor.b, config->textColor.a);
+                TTF_DrawRendererText(text, rect.x, rect.y);
+                TTF_DestroyText(text);
+            } break;
+            case CLAY_RENDER_COMMAND_TYPE_BORDER: {
+                Clay_BorderRenderData *config = &rcmd->renderData.border;
+
+                const float minRadius = SDL_min(rect.w, rect.h) / 2.0f;
+                const Clay_CornerRadius clampedRadii = {
+                    .topLeft = SDL_min(config->cornerRadius.topLeft, minRadius),
+                    .topRight = SDL_min(config->cornerRadius.topRight, minRadius),
+                    .bottomLeft = SDL_min(config->cornerRadius.bottomLeft, minRadius),
+                    .bottomRight = SDL_min(config->cornerRadius.bottomRight, minRadius)
+                };
+                //edges
+                SDL_SetRenderDrawColor(rendererData->renderer, config->color.r, config->color.g, config->color.b, config->color.a);
+                if (config->width.left > 0) {
+                    const float starting_y = rect.y + clampedRadii.topLeft;
+                    const float length = rect.h - clampedRadii.topLeft - clampedRadii.bottomLeft;
+                    SDL_FRect line = { rect.x - 1, starting_y, config->width.left, length };
+                    SDL_RenderFillRect(rendererData->renderer, &line);
+                }
+                if (config->width.right > 0) {
+                    const float starting_x = rect.x + rect.w - (float)config->width.right + 1;
+                    const float starting_y = rect.y + clampedRadii.topRight;
+                    const float length = rect.h - clampedRadii.topRight - clampedRadii.bottomRight;
+                    SDL_FRect line = { starting_x, starting_y, config->width.right, length };
+                    SDL_RenderFillRect(rendererData->renderer, &line);
+                }
+                if (config->width.top > 0) {
+                    const float starting_x = rect.x + clampedRadii.topLeft;
+                    const float length = rect.w - clampedRadii.topLeft - clampedRadii.topRight;
+                    SDL_FRect line = { starting_x, rect.y - 1, length, config->width.top };
+                    SDL_RenderFillRect(rendererData->renderer, &line);
+                }
+                if (config->width.bottom > 0) {
+                    const float starting_x = rect.x + clampedRadii.bottomLeft;
+                    const float starting_y = rect.y + rect.h - (float)config->width.bottom + 1;
+                    const float length = rect.w - clampedRadii.bottomLeft - clampedRadii.bottomRight;
+                    SDL_FRect line = { starting_x, starting_y, length, config->width.bottom };
+                    SDL_SetRenderDrawColor(rendererData->renderer, config->color.r, config->color.g, config->color.b, config->color.a);
+                    SDL_RenderFillRect(rendererData->renderer, &line);
+                }
+                //corners
+                if (config->cornerRadius.topLeft > 0) {
+                    const float centerX = rect.x + clampedRadii.topLeft -1;
+                    const float centerY = rect.y + clampedRadii.topLeft - 1;
+                    SDL_Clay_RenderArc(rendererData, (SDL_FPoint){centerX, centerY}, clampedRadii.topLeft,
+                        180.0f, 270.0f, config->width.top, config->color);
+                }
+                if (config->cornerRadius.topRight > 0) {
+                    const float centerX = rect.x + rect.w - clampedRadii.topRight;
+                    const float centerY = rect.y + clampedRadii.topRight - 1;
+                    SDL_Clay_RenderArc(rendererData, (SDL_FPoint){centerX, centerY}, clampedRadii.topRight,
+                        270.0f, 360.0f, config->width.top, config->color);
+                }
+                if (config->cornerRadius.bottomLeft > 0) {
+                    const float centerX = rect.x + clampedRadii.bottomLeft -1;
+                    const float centerY = rect.y + rect.h - clampedRadii.bottomLeft;
+                    SDL_Clay_RenderArc(rendererData, (SDL_FPoint){centerX, centerY}, clampedRadii.bottomLeft,
+                        90.0f, 180.0f, config->width.bottom, config->color);
+                }
+                if (config->cornerRadius.bottomRight > 0) {
+                    const float centerX = rect.x + rect.w - clampedRadii.bottomRight;
+                    const float centerY = rect.y + rect.h - clampedRadii.bottomRight;
+                    SDL_Clay_RenderArc(rendererData, (SDL_FPoint){centerX, centerY}, clampedRadii.bottomRight,
+                        0.0f, 90.0f, config->width.bottom, config->color);
+                }
+
+            } break;
+            case CLAY_RENDER_COMMAND_TYPE_SCISSOR_START: {
+                Clay_BoundingBox boundingBox = rcmd->boundingBox;
+                currentClippingRectangle = (SDL_Rect) {
+                        .x = boundingBox.x,
+                        .y = boundingBox.y,
+                        .w = boundingBox.width,
+                        .h = boundingBox.height,
+                };
+                SDL_SetRenderClipRect(rendererData->renderer, &currentClippingRectangle);
+                break;
+            }
+            case CLAY_RENDER_COMMAND_TYPE_SCISSOR_END: {
+                SDL_SetRenderClipRect(rendererData->renderer, NULL);
+                break;
+            }
+            case CLAY_RENDER_COMMAND_TYPE_IMAGE: {
+                SDL_Texture *texture = (SDL_Texture *)rcmd->renderData.image.imageData;
+                const SDL_FRect dest = { rect.x, rect.y, rect.w, rect.h };
+                SDL_RenderTexture(rendererData->renderer, texture, NULL, &dest);
+                break;
+            }
+            default:
+                SDL_Log("Unknown render command type: %d", rcmd->commandType);
+        }
+    }
+}

src/renderer/clay_renderer_SDL3.h

@@ -0,0 +1,16 @@
+#ifndef CLAY_RENDERER_SDL3_H
+#define CLAY_RENDERER_SDL3_H
+
+#include <clay/clay.h>
+#include <SDL3_ttf/SDL_ttf.h>
+#include <SDL3/SDL_render.h>
+
+typedef struct {
+    SDL_Renderer *renderer;
+    TTF_TextEngine *textEngine;
+    TTF_Font **fonts;
+} Clay_SDL3RendererData;
+
+extern void SDL_Clay_RenderClayCommands(Clay_SDL3RendererData *rendererData, Clay_RenderCommandArray *rcommands);
+
+#endif // !CLAY_RENDERER_SDL3_H

vendor/clay

@@ -1 +0,0 @@
-Subproject commit 37675089e33632173606bfccab554ad6e6970d4c