Support rendering borders

Antonio Scandurra and Nathan Sobo created

Co-Authored-By: Nathan Sobo <nathan@zed.dev>

Change summary

gpui/src/platform/mac/renderer.rs           | 10 ++++++++++
gpui/src/platform/mac/shaders/shaders.h     |  5 +++++
gpui/src/platform/mac/shaders/shaders.metal | 21 ++++++++++++++++++---
3 files changed, 33 insertions(+), 3 deletions(-)

Detailed changes

gpui/src/platform/mac/renderer.rs 🔗

@@ -97,6 +97,7 @@ impl Renderer {
         for quad_batch in layer.quads().chunks(batch_size) {
             for (ix, quad) in quad_batch.iter().enumerate() {
                 let bounds = quad.bounds * scene.scale_factor();
+                let border_width = quad.border.width * scene.scale_factor();
                 let shader_quad = shaders::GPUIQuad {
                     origin: bounds.origin().to_float2(),
                     size: bounds.size().to_float2(),
@@ -104,6 +105,15 @@ impl Renderer {
                         .background
                         .unwrap_or(ColorU::transparent_black())
                         .to_uchar4(),
+                    border_top: border_width * (quad.border.top as usize as f32),
+                    border_right: border_width * (quad.border.right as usize as f32),
+                    border_bottom: border_width * (quad.border.bottom as usize as f32),
+                    border_left: border_width * (quad.border.left as usize as f32),
+                    border_color: quad
+                        .border
+                        .color
+                        .unwrap_or(ColorU::transparent_black())
+                        .to_uchar4(),
                     corner_radius: quad.corner_radius * scene.scale_factor(),
                 };
                 unsafe {

gpui/src/platform/mac/shaders/shaders.h 🔗

@@ -10,6 +10,11 @@ typedef struct {
     vector_float2 origin;
     vector_float2 size;
     vector_uchar4 background_color;
+    float border_top;
+    float border_right;
+    float border_bottom;
+    float border_left;
+    vector_uchar4 border_color;
     float corner_radius;
 } GPUIQuad;
 

gpui/src/platform/mac/shaders/shaders.metal 🔗

@@ -36,9 +36,24 @@ fragment float4 quad_fragment(
 ) {
     float2 half_size = input.quad.size / 2.;
     float2 center = input.quad.origin + half_size;
-    float2 edge_to_point = abs(input.position.xy - center) - half_size + input.quad.corner_radius;
-    float distance = length(max(0.0, edge_to_point)) + min(0.0, max(edge_to_point.x, edge_to_point.y)) - input.quad.corner_radius;
+    float2 center_to_point = input.position.xy - center;
+    float2 edge_to_point = abs(center_to_point) - half_size;
+    float2 rounded_edge_to_point = abs(center_to_point) - half_size + input.quad.corner_radius;
+    float distance = length(max(0.0, rounded_edge_to_point)) + min(0.0, max(rounded_edge_to_point.x, rounded_edge_to_point.y)) - input.quad.corner_radius;
 
+    float border_width = 0.0;
+    if (edge_to_point.x > edge_to_point.y) {
+        border_width = center_to_point.x <= 0.0 ? input.quad.border_left : input.quad.border_right;
+    } else {
+        border_width = center_to_point.y <= 0.0 ? input.quad.border_top : input.quad.border_bottom;
+    }
+
+    float inset_distance = distance + border_width;
+    float4 color = mix(
+        coloru_to_colorf(input.quad.border_color),
+        coloru_to_colorf(input.quad.background_color),
+        saturate(0.5 - inset_distance)
+    );
     float4 coverage = float4(1.0, 1.0, 1.0, saturate(0.5 - distance));
-    return coverage * coloru_to_colorf(input.quad.background_color);
+    return coverage * color;
 }