non uniform border radius for quads

This commit is contained in:
Robert Krahn 2022-11-03 00:35:01 +01:00
parent d222b5c8b0
commit c0596179bd
25 changed files with 121 additions and 60 deletions

View file

@ -254,7 +254,7 @@ unsafe fn create_buffers(
gl.enable_vertex_attrib_array(4);
gl.vertex_attrib_pointer_f32(
4,
1,
4,
glow::FLOAT,
false,
stride,
@ -268,7 +268,7 @@ unsafe fn create_buffers(
glow::FLOAT,
false,
stride,
4 * (2 + 2 + 4 + 4 + 1),
4 * (2 + 2 + 4 + 4 + 4),
);
gl.enable_vertex_attrib_array(6);
@ -278,7 +278,7 @@ unsafe fn create_buffers(
glow::FLOAT,
false,
stride,
4 * (2 + 2 + 4 + 4 + 1 + 1),
4 * (2 + 2 + 4 + 4 + 4 + 1),
);
gl.bind_vertex_array(None);
@ -307,7 +307,7 @@ pub struct Vertex {
pub border_color: [f32; 4],
/// The border radius of the [`Vertex`].
pub border_radius: f32,
pub border_radius: [f32; 4],
/// The border width of the [`Vertex`].
pub border_width: f32,
@ -325,7 +325,7 @@ impl Vertex {
size: quad.size,
color: quad.color,
border_color: quad.color,
border_radius: quad.border_radius,
border_radius: [quad.border_radius[0]; 4],
border_width: quad.border_width,
q_position: [0.0, 0.0],
};

View file

@ -218,7 +218,7 @@ unsafe fn create_instance_buffer(
gl.enable_vertex_attrib_array(4);
gl.vertex_attrib_pointer_f32(
4,
1,
4,
glow::FLOAT,
false,
stride,
@ -233,7 +233,7 @@ unsafe fn create_instance_buffer(
glow::FLOAT,
false,
stride,
4 * (2 + 2 + 4 + 4 + 1),
4 * (2 + 2 + 4 + 4 + 4),
);
gl.vertex_attrib_divisor(5, 1);

View file

@ -17,7 +17,7 @@ in vec4 v_Color;
in vec4 v_BorderColor;
in vec2 v_Pos;
in vec2 v_Scale;
in float v_BorderRadius;
in vec4 v_BorderRadius;
in float v_BorderWidth;
float fDistance(vec2 frag_coord, vec2 position, vec2 size, float radius)
@ -38,14 +38,30 @@ float fDistance(vec2 frag_coord, vec2 position, vec2 size, float radius)
return sqrt(distance.x * distance.x + distance.y * distance.y);
}
float selectBorderRadius(vec4 radi, vec2 position, vec2 center)
{
float rx = radi.x;
float ry = radi.y;
rx = position.x > center.x ? radi.y : radi.x;
ry = position.x > center.x ? radi.z : radi.w;
rx = position.y > center.y ? ry : rx;
return rx;
}
void main() {
vec4 mixed_color;
vec2 fragCoord = vec2(gl_FragCoord.x, u_ScreenHeight - gl_FragCoord.y);
float borderRadius = selectBorderRadius(
v_BorderRadius,
fragCoord,
(v_Pos + v_Scale * 0.5).xy
);
// TODO: Remove branching (?)
if(v_BorderWidth > 0.0) {
float internal_border = max(v_BorderRadius - v_BorderWidth, 0.0);
float internal_border = max(borderRadius - v_BorderWidth, 0.0);
float internal_distance = fDistance(
fragCoord,
@ -69,11 +85,11 @@ void main() {
fragCoord,
v_Pos,
v_Scale,
v_BorderRadius
borderRadius
);
float radius_alpha =
1.0 - smoothstep(max(v_BorderRadius - 0.5, 0.0), v_BorderRadius + 0.5, d);
1.0 - smoothstep(max(borderRadius - 0.5, 0.0), borderRadius + 0.5, d);
gl_FragColor = vec4(mixed_color.xyz, mixed_color.w * radius_alpha);
}

View file

@ -5,14 +5,14 @@ in vec2 i_Pos;
in vec2 i_Scale;
in vec4 i_Color;
in vec4 i_BorderColor;
in float i_BorderRadius;
in vec4 i_BorderRadius;
in float i_BorderWidth;
out vec4 v_Color;
out vec4 v_BorderColor;
out vec2 v_Pos;
out vec2 v_Scale;
out float v_BorderRadius;
out vec4 v_BorderRadius;
out float v_BorderWidth;
vec2 positions[4] = vec2[](
@ -27,9 +27,11 @@ void main() {
vec2 p_Pos = i_Pos * u_Scale;
vec2 p_Scale = i_Scale * u_Scale;
float i_BorderRadius = min(
i_BorderRadius,
min(i_Scale.x, i_Scale.y) / 2.0
vec4 i_BorderRadius = vec4(
min(i_BorderRadius.x, min(i_Scale.x, i_Scale.y) / 2.0),
min(i_BorderRadius.y, min(i_Scale.x, i_Scale.y) / 2.0),
min(i_BorderRadius.z, min(i_Scale.x, i_Scale.y) / 2.0),
min(i_BorderRadius.w, min(i_Scale.x, i_Scale.y) / 2.0)
);
mat4 i_Transform = mat4(