draw-improvements (#17)
Major rework to draw rendering system. We are making a SDF first rendering system with tesselated stuff only as a fallback strategy for specific situations where SDF is particularly poorly suited Co-authored-by: Zachary Levy <zachary@sunforge.is> Reviewed-on: #17
This commit was merged in pull request #17.
This commit is contained in:
@@ -1,13 +1,13 @@
|
||||
#version 450 core
|
||||
|
||||
// --- Inputs from vertex shader ---
|
||||
layout(location = 0) in vec4 f_color;
|
||||
layout(location = 0) in mediump vec4 f_color;
|
||||
layout(location = 1) in vec2 f_local_or_uv;
|
||||
layout(location = 2) in vec4 f_params;
|
||||
layout(location = 3) in vec4 f_params2;
|
||||
layout(location = 4) flat in uint f_kind_flags;
|
||||
layout(location = 5) flat in float f_rotation;
|
||||
layout(location = 6) flat in vec4 f_uv_rect;
|
||||
layout(location = 4) flat in uint f_flags;
|
||||
layout(location = 5) flat in uint f_rotation_sc;
|
||||
layout(location = 6) flat in uvec4 f_uv_or_effects;
|
||||
|
||||
// --- Output ---
|
||||
layout(location = 0) out vec4 out_color;
|
||||
@@ -20,77 +20,43 @@ layout(set = 2, binding = 0) uniform sampler2D tex;
|
||||
// All operate in physical pixel space — no dpi_scale needed here.
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
const float PI = 3.14159265358979;
|
||||
|
||||
float sdCircle(vec2 p, float r) {
|
||||
return length(p) - r;
|
||||
}
|
||||
|
||||
float sdRoundedBox(vec2 p, vec2 b, vec4 r) {
|
||||
r.xy = (p.x > 0.0) ? r.xy : r.zw;
|
||||
r.x = (p.y > 0.0) ? r.x : r.y;
|
||||
vec2 q = abs(p) - b + r.x;
|
||||
return min(max(q.x, q.y), 0.0) + length(max(q, vec2(0.0))) - r.x;
|
||||
}
|
||||
|
||||
float sdSegment(vec2 p, vec2 a, vec2 b) {
|
||||
vec2 pa = p - a, ba = b - a;
|
||||
float h = clamp(dot(pa, ba) / dot(ba, ba), 0.0, 1.0);
|
||||
return length(pa - ba * h);
|
||||
}
|
||||
|
||||
float sdEllipse(vec2 p, vec2 ab) {
|
||||
p = abs(p);
|
||||
if (p.x > p.y) {
|
||||
p = p.yx;
|
||||
ab = ab.yx;
|
||||
vec2 rxy = (p.x > 0.0) ? r.xy : r.zw;
|
||||
float rr = (p.y > 0.0) ? rxy.x : rxy.y;
|
||||
vec2 q = abs(p) - b;
|
||||
if (rr == 0.0) {
|
||||
return max(q.x, q.y);
|
||||
}
|
||||
float l = ab.y * ab.y - ab.x * ab.x;
|
||||
float m = ab.x * p.x / l;
|
||||
float m2 = m * m;
|
||||
float n = ab.y * p.y / l;
|
||||
float n2 = n * n;
|
||||
float c = (m2 + n2 - 1.0) / 3.0;
|
||||
float c3 = c * c * c;
|
||||
float q = c3 + m2 * n2 * 2.0;
|
||||
float d = c3 + m2 * n2;
|
||||
float g = m + m * n2;
|
||||
float co;
|
||||
if (d < 0.0) {
|
||||
float h = acos(q / c3) / 3.0;
|
||||
float s = cos(h);
|
||||
float t = sin(h) * sqrt(3.0);
|
||||
float rx = sqrt(-c * (s + t + 2.0) + m2);
|
||||
float ry = sqrt(-c * (s - t + 2.0) + m2);
|
||||
co = (ry + sign(l) * rx + abs(g) / (rx * ry) - m) / 2.0;
|
||||
} else {
|
||||
float h = 2.0 * m * n * sqrt(d);
|
||||
float s = sign(q + h) * pow(abs(q + h), 1.0 / 3.0);
|
||||
float u = sign(q - h) * pow(abs(q - h), 1.0 / 3.0);
|
||||
float rx = -s - u - c * 4.0 + 2.0 * m2;
|
||||
float ry = (s - u) * sqrt(3.0);
|
||||
float rm = sqrt(rx * rx + ry * ry);
|
||||
co = (ry / sqrt(rm - rx) + 2.0 * g / rm - m) / 2.0;
|
||||
}
|
||||
vec2 r = ab * vec2(co, sqrt(1.0 - co * co));
|
||||
return length(r - p) * sign(p.y - r.y);
|
||||
q += rr;
|
||||
return min(max(q.x, q.y), 0.0) + length(max(q, vec2(0.0))) - rr;
|
||||
}
|
||||
|
||||
float sdf_alpha(float d, float soft) {
|
||||
return 1.0 - smoothstep(-soft, soft, d);
|
||||
// Approximate ellipse SDF — fast, suitable for UI, NOT a true Euclidean distance.
|
||||
float sdEllipseApprox(vec2 p, vec2 ab) {
|
||||
float k0 = length(p / ab);
|
||||
float k1 = length(p / (ab * ab));
|
||||
return k0 * (k0 - 1.0) / k1;
|
||||
}
|
||||
|
||||
float sdf_stroke(float d, float stroke_width) {
|
||||
return abs(d) - stroke_width * 0.5;
|
||||
// Regular N-gon SDF (Inigo Quilez).
|
||||
float sdRegularPolygon(vec2 p, float r, float n) {
|
||||
float an = 3.141592653589793 / n;
|
||||
float bn = mod(atan(p.y, p.x), 2.0 * an) - an;
|
||||
return length(p) * cos(bn) - r;
|
||||
}
|
||||
|
||||
// Rotate a 2D point by the negative of the given angle (inverse rotation).
|
||||
// Used to rotate the sampling frame opposite to the shape's rotation so that
|
||||
// the SDF evaluates correctly for the rotated shape.
|
||||
vec2 apply_rotation(vec2 p, float angle) {
|
||||
float cr = cos(-angle);
|
||||
float sr = sin(-angle);
|
||||
return mat2(cr, sr, -sr, cr) * p;
|
||||
// Coverage from SDF distance using half-feather width (feather_px * 0.5, pre-computed on CPU).
|
||||
// Produces a symmetric transition centered on d=0: smoothstep(-h, h, d).
|
||||
float sdf_alpha(float d, float h) {
|
||||
return 1.0 - smoothstep(-h, h, d);
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Gradient helpers
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
mediump vec4 gradient_2color(mediump vec4 start_color, mediump vec4 end_color, mediump float t) {
|
||||
return mix(start_color, end_color, clamp(t, 0.0, 1.0));
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
@@ -98,131 +64,137 @@ vec2 apply_rotation(vec2 p, float angle) {
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
void main() {
|
||||
uint kind = f_kind_flags & 0xFFu;
|
||||
uint flags = (f_kind_flags >> 8u) & 0xFFu;
|
||||
uint kind = f_flags & 0xFFu;
|
||||
uint flags = (f_flags >> 8u) & 0xFFu;
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// Kind 0: Tessellated path. Texture multiply for text atlas,
|
||||
// white pixel for solid shapes.
|
||||
// -----------------------------------------------------------------------
|
||||
// Kind 0: Tessellated path — vertex colors arrive premultiplied from CPU.
|
||||
// Texture samples are straight-alpha (SDL_ttf glyph atlas: rgb=1, a=coverage;
|
||||
// or the 1x1 white texture: rgba=1). Convert to premultiplied form so the
|
||||
// blend state (ONE, ONE_MINUS_SRC_ALPHA) composites correctly.
|
||||
if (kind == 0u) {
|
||||
out_color = f_color * texture(tex, f_local_or_uv);
|
||||
vec4 t = texture(tex, f_local_or_uv);
|
||||
t.rgb *= t.a;
|
||||
out_color = f_color * t;
|
||||
return;
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------
|
||||
// SDF path. f_local_or_uv = shape-centered position in physical pixels.
|
||||
// All dimensional params are already in physical pixels (CPU pre-scaled).
|
||||
// -----------------------------------------------------------------------
|
||||
// SDF path — dispatch on kind
|
||||
float d = 1e30;
|
||||
float soft = 1.0;
|
||||
float h = 0.5; // half-feather width; overwritten per shape kind
|
||||
vec2 half_size = f_params.xy; // used by RRect and as reference size for gradients
|
||||
|
||||
vec2 p_local = f_local_or_uv;
|
||||
|
||||
// Apply inverse rotation using pre-computed sin/cos (no per-pixel trig).
|
||||
// .Rotated flag = bit 4 = 16u
|
||||
if ((flags & 16u) != 0u) {
|
||||
vec2 sc = unpackHalf2x16(f_rotation_sc); // .x = sin(angle), .y = cos(angle)
|
||||
// Inverse rotation matrix R(-angle) = [[cos, sin], [-sin, cos]]
|
||||
p_local = vec2(sc.y * p_local.x + sc.x * p_local.y,
|
||||
-sc.x * p_local.x + sc.y * p_local.y);
|
||||
}
|
||||
|
||||
if (kind == 1u) {
|
||||
// RRect: rounded box
|
||||
vec2 b = f_params.xy; // half_size (phys px)
|
||||
vec4 r = vec4(f_params.zw, f_params2.xy); // corner radii: tr, br, tl, bl
|
||||
soft = max(f_params2.z, 1.0);
|
||||
float stroke_px = f_params2.w;
|
||||
|
||||
vec2 p_local = f_local_or_uv;
|
||||
if (f_rotation != 0.0) {
|
||||
p_local = apply_rotation(p_local, f_rotation);
|
||||
}
|
||||
|
||||
d = sdRoundedBox(p_local, b, r);
|
||||
if ((flags & 1u) != 0u) d = sdf_stroke(d, stroke_px);
|
||||
|
||||
// Texture sampling for textured SDF primitives
|
||||
vec4 shape_color = f_color;
|
||||
if ((flags & 2u) != 0u) {
|
||||
// Compute UV from local position and half_size
|
||||
vec2 p_for_uv = f_local_or_uv;
|
||||
if (f_rotation != 0.0) {
|
||||
p_for_uv = apply_rotation(p_for_uv, f_rotation);
|
||||
}
|
||||
vec2 local_uv = p_for_uv / b * 0.5 + 0.5;
|
||||
vec2 uv = mix(f_uv_rect.xy, f_uv_rect.zw, local_uv);
|
||||
shape_color *= texture(tex, uv);
|
||||
}
|
||||
|
||||
float alpha = sdf_alpha(d, soft);
|
||||
out_color = vec4(shape_color.rgb, shape_color.a * alpha);
|
||||
return;
|
||||
// RRect — half_feather in params2.z
|
||||
vec4 corner_radii = vec4(f_params.zw, f_params2.xy);
|
||||
h = f_params2.z;
|
||||
d = sdRoundedBox(p_local, half_size, corner_radii);
|
||||
}
|
||||
else if (kind == 2u) {
|
||||
// Circle — rotationally symmetric, no rotation needed
|
||||
// NGon — half_feather in params.z
|
||||
float radius = f_params.x;
|
||||
soft = max(f_params.y, 1.0);
|
||||
float stroke_px = f_params.z;
|
||||
|
||||
d = sdCircle(f_local_or_uv, radius);
|
||||
if ((flags & 1u) != 0u) d = sdf_stroke(d, stroke_px);
|
||||
float sides = f_params.y;
|
||||
h = f_params.z;
|
||||
d = sdRegularPolygon(p_local, radius, sides);
|
||||
half_size = vec2(radius); // for gradient UV computation
|
||||
}
|
||||
else if (kind == 3u) {
|
||||
// Ellipse
|
||||
// Ellipse — half_feather in params.z
|
||||
vec2 ab = f_params.xy;
|
||||
soft = max(f_params.z, 1.0);
|
||||
float stroke_px = f_params.w;
|
||||
|
||||
vec2 p_local = f_local_or_uv;
|
||||
if (f_rotation != 0.0) {
|
||||
p_local = apply_rotation(p_local, f_rotation);
|
||||
}
|
||||
|
||||
d = sdEllipse(p_local, ab);
|
||||
if ((flags & 1u) != 0u) d = sdf_stroke(d, stroke_px);
|
||||
h = f_params.z;
|
||||
d = sdEllipseApprox(p_local, ab);
|
||||
half_size = ab; // for gradient UV computation
|
||||
}
|
||||
else if (kind == 4u) {
|
||||
// Segment (capsule line) — no rotation (excluded)
|
||||
vec2 a = f_params.xy; // already in local physical pixels
|
||||
vec2 b = f_params.zw;
|
||||
float width = f_params2.x;
|
||||
soft = max(f_params2.y, 1.0);
|
||||
|
||||
d = sdSegment(f_local_or_uv, a, b) - width * 0.5;
|
||||
}
|
||||
else if (kind == 5u) {
|
||||
// Ring / Arc — rotation handled by CPU angle offset, no shader rotation
|
||||
// Ring_Arc — half_feather in params2.z
|
||||
// Arc mode from flag bits 5-6: 0 = full, 1 = narrow (≤π), 2 = wide (>π)
|
||||
float inner = f_params.x;
|
||||
float outer = f_params.y;
|
||||
float start_rad = f_params.z;
|
||||
float end_rad = f_params.w;
|
||||
soft = max(f_params2.x, 1.0);
|
||||
vec2 n_start = f_params.zw;
|
||||
vec2 n_end = f_params2.xy;
|
||||
uint arc_bits = (flags >> 5u) & 3u;
|
||||
|
||||
float r = length(f_local_or_uv);
|
||||
float d_ring = max(inner - r, r - outer);
|
||||
h = f_params2.z;
|
||||
|
||||
// Angular clip
|
||||
float angle = atan(f_local_or_uv.y, f_local_or_uv.x);
|
||||
if (angle < 0.0) angle += 2.0 * PI;
|
||||
float ang_start = mod(start_rad, 2.0 * PI);
|
||||
float ang_end = mod(end_rad, 2.0 * PI);
|
||||
float r = length(p_local);
|
||||
d = max(inner - r, r - outer);
|
||||
|
||||
float in_arc = (ang_end > ang_start)
|
||||
? ((angle >= ang_start && angle <= ang_end) ? 1.0 : 0.0) : ((angle >= ang_start || angle <= ang_end) ? 1.0 : 0.0);
|
||||
if (abs(ang_end - ang_start) >= 2.0 * PI - 0.001) in_arc = 1.0;
|
||||
if (arc_bits != 0u) {
|
||||
float d_start = dot(p_local, n_start);
|
||||
float d_end = dot(p_local, n_end);
|
||||
float d_wedge = (arc_bits == 1u)
|
||||
? max(d_start, d_end) // arc ≤ π: intersect half-planes
|
||||
: min(d_start, d_end); // arc > π: union half-planes
|
||||
d = max(d, d_wedge);
|
||||
}
|
||||
|
||||
d = in_arc > 0.5 ? d_ring : 1e30;
|
||||
}
|
||||
else if (kind == 6u) {
|
||||
// Regular N-gon — has its own rotation in params, no Primitive.rotation used
|
||||
float radius = f_params.x;
|
||||
float rotation = f_params.y;
|
||||
float sides = f_params.z;
|
||||
soft = max(f_params.w, 1.0);
|
||||
float stroke_px = f_params2.x;
|
||||
|
||||
vec2 p = f_local_or_uv;
|
||||
float c = cos(rotation), s = sin(rotation);
|
||||
p = mat2(c, -s, s, c) * p;
|
||||
|
||||
float an = PI / sides;
|
||||
float bn = mod(atan(p.y, p.x), 2.0 * an) - an;
|
||||
d = length(p) * cos(bn) - radius;
|
||||
|
||||
if ((flags & 1u) != 0u) d = sdf_stroke(d, stroke_px);
|
||||
half_size = vec2(outer); // for gradient UV computation
|
||||
}
|
||||
|
||||
float alpha = sdf_alpha(d, soft);
|
||||
out_color = vec4(f_color.rgb, f_color.a * alpha);
|
||||
// --- fwidth-based normalization for correct AA and stroke width ---
|
||||
float grad_magnitude = max(fwidth(d), 1e-6);
|
||||
d = d / grad_magnitude;
|
||||
h = h / grad_magnitude;
|
||||
|
||||
// --- Determine shape color based on flags ---
|
||||
mediump vec4 shape_color;
|
||||
if ((flags & 2u) != 0u) {
|
||||
// Gradient active (bit 1)
|
||||
mediump vec4 gradient_start = f_color;
|
||||
mediump vec4 gradient_end = unpackUnorm4x8(f_uv_or_effects.x);
|
||||
|
||||
if ((flags & 4u) != 0u) {
|
||||
// Radial gradient (bit 2): t from distance to center
|
||||
mediump float t = length(p_local / half_size);
|
||||
shape_color = gradient_2color(gradient_start, gradient_end, t);
|
||||
} else {
|
||||
// Linear gradient: direction pre-computed on CPU as (cos, sin) f16 pair
|
||||
vec2 direction = unpackHalf2x16(f_uv_or_effects.z);
|
||||
mediump float t = dot(p_local / half_size, direction) * 0.5 + 0.5;
|
||||
shape_color = gradient_2color(gradient_start, gradient_end, t);
|
||||
}
|
||||
} else if ((flags & 1u) != 0u) {
|
||||
// Textured (bit 0) — RRect only in practice
|
||||
vec4 uv_rect = uintBitsToFloat(f_uv_or_effects);
|
||||
vec2 local_uv = p_local / half_size * 0.5 + 0.5;
|
||||
vec2 uv = mix(uv_rect.xy, uv_rect.zw, local_uv);
|
||||
shape_color = f_color * texture(tex, uv);
|
||||
} else {
|
||||
// Solid color
|
||||
shape_color = f_color;
|
||||
}
|
||||
|
||||
// --- Outline (bit 3) — outer outline via premultiplied compositing ---
|
||||
// The outline band sits OUTSIDE the original shape boundary (d=0 to d=+ol_width).
|
||||
// fill_cov covers the interior with AA at d=0; total_cov covers interior+outline with
|
||||
// AA at d=ol_width. The outline band's coverage is total_cov - fill_cov.
|
||||
// Output is premultiplied: blend state is ONE, ONE_MINUS_SRC_ALPHA.
|
||||
if ((flags & 8u) != 0u) {
|
||||
mediump vec4 ol_color = unpackUnorm4x8(f_uv_or_effects.y);
|
||||
// Outline width in f_uv_or_effects.w (low f16 half)
|
||||
float ol_width = unpackHalf2x16(f_uv_or_effects.w).x / grad_magnitude;
|
||||
|
||||
float fill_cov = sdf_alpha(d, h);
|
||||
float total_cov = sdf_alpha(d - ol_width, h);
|
||||
float outline_cov = max(total_cov - fill_cov, 0.0);
|
||||
|
||||
// Premultiplied output — no divide, no threshold check
|
||||
vec3 rgb_pm = shape_color.rgb * shape_color.a * fill_cov
|
||||
+ ol_color.rgb * ol_color.a * outline_cov;
|
||||
float alpha_pm = shape_color.a * fill_cov + ol_color.a * outline_cov;
|
||||
out_color = vec4(rgb_pm, alpha_pm);
|
||||
} else {
|
||||
mediump float alpha = sdf_alpha(d, h);
|
||||
out_color = vec4(shape_color.rgb * shape_color.a * alpha, shape_color.a * alpha);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user