From 6546b075a14169676b3e5bfba8bf2c0b181cea38 Mon Sep 17 00:00:00 2001 From: IllusionMan1212 Date: Tue, 21 Nov 2023 06:45:54 +0200 Subject: [PATCH] border radius for quads --- cudoku.c | 10 ++++++---- shaders/font.frag | 4 ++-- shaders/font.vert | 11 ----------- shaders/ui.frag | 28 ++++++++++++++++++++++++++-- shaders/ui.vert | 10 +++++----- todo.txt | 4 ++++ ui.c | 30 +++++++++++++++++++----------- ui.h | 2 +- 8 files changed, 63 insertions(+), 36 deletions(-) delete mode 100644 shaders/font.vert create mode 100644 todo.txt diff --git a/cudoku.c b/cudoku.c index 74142b9..ba15835 100644 --- a/cudoku.c +++ b/cudoku.c @@ -58,17 +58,19 @@ void draw_win() { /* set_width_constraint(&constraints, window.width, UI_CONSTRAINT_FIXED); */ /* set_height_constraint(&constraints, window.height, UI_CONSTRAINT_FIXED); */ - Alignment align = ALIGN_TOP_RIGHT; + Alignment align = ALIGN_CENTER; int font_size = 72.0f; Sizef text_size = calculate_text_size(win_text, font_size); set_x_constraint(&constraints, 0, UI_CONSTRAINT_FIXED); set_y_constraint(&constraints, 0, UI_CONSTRAINT_FIXED); - set_width_constraint(&constraints, text_size.width, UI_CONSTRAINT_FIXED); - set_height_constraint(&constraints, text_size.height, UI_CONSTRAINT_FIXED); + set_width_constraint(&constraints, 200, UI_CONSTRAINT_FIXED); + set_height_constraint(&constraints, 200, UI_CONSTRAINT_FIXED); - draw_quad(constraints, &bg_color, align); + draw_quad(constraints, &bg_color, 100.00, ALIGN_TOP_LEFT); + draw_quad(constraints, &bg_color, 0.50, ALIGN_BOTTOM_RIGHT); + draw_quad(constraints, &bg_color, 0.0, align); draw_text(win_text, font_size, (Vec2f){0.0, 0.0}, &text_color, align); } diff --git a/shaders/font.frag b/shaders/font.frag index b56b9a1..a5d221a 100644 --- a/shaders/font.frag +++ b/shaders/font.frag @@ -1,11 +1,11 @@ #version 330 core -in vec2 TexCoords; +in vec2 v_TexCoords; out vec4 FragColor; uniform sampler2D text; uniform vec4 textColor; void main() { - vec4 sampled = vec4(1.0, 1.0, 1.0, texture(text, TexCoords).r); + vec4 sampled = vec4(1.0, 1.0, 1.0, texture(text, v_TexCoords).r); FragColor = textColor * sampled; } diff --git a/shaders/font.vert b/shaders/font.vert deleted file mode 100644 index 662998c..0000000 --- a/shaders/font.vert +++ /dev/null @@ -1,11 +0,0 @@ -#version 330 core -layout (location = 0) in vec4 vertex; - -out vec2 TexCoords; -uniform mat4 projection; -uniform mat4 model; - -void main() { - gl_Position = projection * model * vec4(vertex.xy, 0.0, 1.0); - TexCoords = vertex.zw; -} diff --git a/shaders/ui.frag b/shaders/ui.frag index 19f3afe..a869a5e 100644 --- a/shaders/ui.frag +++ b/shaders/ui.frag @@ -1,9 +1,33 @@ #version 330 core -in vec2 texCoords; +in vec2 v_TexCoords; out vec4 FragColor; + uniform vec4 aColor; +uniform float borderRadius; +uniform float uiWidth; +uniform float uiHeight; + +const float smoothness = 1.0; void main() { - FragColor = vec4(aColor); + float alpha = aColor.a; + + if (borderRadius > 0.0) { + vec2 dimensions = v_TexCoords * vec2(uiWidth, uiHeight); + float xMax = uiWidth - borderRadius; + float yMax = uiHeight - borderRadius; + + if (dimensions.x < borderRadius && dimensions.y < borderRadius) { + alpha *= 1.0 - smoothstep(borderRadius - smoothness, borderRadius + smoothness, length(dimensions - vec2(borderRadius))); + } else if (dimensions.x < borderRadius && dimensions.y > yMax) { + alpha *= 1.0 - smoothstep(borderRadius - smoothness, borderRadius + smoothness, length(dimensions - vec2(borderRadius, yMax))); + } else if (dimensions.x > xMax && dimensions.y < borderRadius) { + alpha *= 1.0 - smoothstep(borderRadius - smoothness, borderRadius + smoothness, length(dimensions - vec2(xMax, borderRadius))); + } else if (dimensions.x > xMax && dimensions.y > yMax) { + alpha *= 1.0 - smoothstep(borderRadius - smoothness, borderRadius + smoothness, length(dimensions - vec2(xMax, yMax))); + } + } + + FragColor = vec4(aColor.rgb, alpha); } diff --git a/shaders/ui.vert b/shaders/ui.vert index 3834ce0..213850e 100644 --- a/shaders/ui.vert +++ b/shaders/ui.vert @@ -1,11 +1,11 @@ #version 330 core -layout (location = 0) in vec3 aPos; -layout (location = 1) in vec2 aTexCoords; -out vec2 texCoords; +layout (location = 0) in vec4 vertex; +out vec2 v_TexCoords; uniform mat4 projection; +uniform mat4 model; void main() { - gl_Position = projection * vec4(aPos, 1.0f); - texCoords = aTexCoords; + gl_Position = projection * model * vec4(vertex.xy, 0.0, 1.0); + v_TexCoords = vertex.zw; } diff --git a/todo.txt b/todo.txt new file mode 100644 index 0000000..c2b05ea --- /dev/null +++ b/todo.txt @@ -0,0 +1,4 @@ +- draw functions for other primitive shapes (circle, triangle?) +- border decorations for shapes +- look into SDF/vector text +- unicode support? diff --git a/ui.c b/ui.c index aa0da60..30b7f74 100644 --- a/ui.c +++ b/ui.c @@ -96,10 +96,9 @@ int init_ui(const char* font_path, Size window_size) { return 1; } - font_shader = create_shader("shaders/font.vert", "shaders/font.frag"); + font_shader = create_shader("shaders/ui.vert", "shaders/font.frag"); ui_shader = create_shader("shaders/ui.vert", "shaders/ui.frag"); - glGenVertexArrays(1, &font_vao); glGenVertexArrays(1, &ui_vao); glGenBuffers(1, &font_vbo); @@ -359,7 +358,7 @@ void apply_alignment(Alignment align, Vec2f *pos, Sizef size) { } } -void draw_quad(UIConstraints constraints, Color *color, Alignment align) { +void draw_quad(UIConstraints constraints, Color *color, float border_radius, Alignment align) { use_shader(ui_shader); if (color) { @@ -368,7 +367,14 @@ void draw_quad(UIConstraints constraints, Color *color, Alignment align) { set_vec4f(ui_shader, "aColor", 0.f, 0.f, 0.f, 1.f); } + printf("width: %f, height: %f\n", constraints.width, constraints.height); + set_float(ui_shader, "uiWidth", constraints.width); + set_float(ui_shader, "uiHeight", constraints.height); + set_float(ui_shader, "borderRadius", border_radius); set_mat4f(ui_shader, "projection", (float *)zephr_context.projection.m); + Matrix4x4 model = identity(); + + set_mat4f(font_shader, "model", (float *)model.m); glBindVertexArray(ui_vao); @@ -379,13 +385,15 @@ void draw_quad(UIConstraints constraints, Color *color, Alignment align) { apply_alignment(align, &pos, size); float vertices[6][4] = { - {pos.x, pos.y + size.height, 0.0, 1.0}, - {pos.x, pos.y, 0.0, 0.0}, - {pos.x + size.width, pos.y, 1.0, 0.0}, + // bottom left tri + {pos.x, pos.y + size.height, 0.0, 1.0}, + {pos.x, pos.y, 0.0, 0.0}, + {pos.x + size.width, pos.y, 1.0, 0.0}, - {pos.x, pos.y + size.height, 0.0, 1.0}, - {pos.x + size.width, pos.y, 1.0, 0.0}, - {pos.x + size.width, pos.y + size.height, 1.0, 1.0}, + // top right tri + {pos.x, pos.y + size.height, 0.0, 1.0}, + {pos.x + size.width, pos.y, 1.0, 0.0}, + {pos.x + size.width, pos.y + size.height, 1.0, 1.0}, }; glBindBuffer(GL_ARRAY_BUFFER, ui_vbo); @@ -443,12 +451,12 @@ void draw_text(const char* text, int font_size, Vec2f pos, Color *color, Alignme apply_alignment(alignment, &final_pos, (Sizef){ text_size.width * font_scale, text_size.height * font_scale }); float vertices[6][4] = { - // top left tri + // bottom left tri {final_pos.x, final_pos.y + h, 0.0, 1.0}, {final_pos.x, final_pos.y, 0.0, 0.0}, {final_pos.x + w, final_pos.y, 1.0, 0.0}, - // bottom right tri + // top right tri {final_pos.x, final_pos.y + h, 0.0, 1.0}, {final_pos.x + w, final_pos.y, 1.0, 0.0}, {final_pos.x + w, final_pos.y + h, 1.0, 1.0}, diff --git a/ui.h b/ui.h index 0e0de76..a3e6eea 100644 --- a/ui.h +++ b/ui.h @@ -81,6 +81,6 @@ void set_x_constraint(UIConstraints *constraints, float value, UIConstraint type void set_y_constraint(UIConstraints *constraints, float value, UIConstraint type); void set_width_constraint(UIConstraints *constraints, float value, UIConstraint type); void set_height_constraint(UIConstraints *constraints, float value, UIConstraint type); -void draw_quad(UIConstraints constraints, Color *color, Alignment align); +void draw_quad(UIConstraints constraints, Color *color, float border_radius, Alignment align); void draw_text(const char* text, int font_size, Vec2f pos, Color *color, Alignment align); Sizef calculate_text_size(const char *text, int font_size);