Support rendering borders

Co-Authored-By: Nathan Sobo <nathan@zed.dev>
This commit is contained in:
Antonio Scandurra 2021-03-22 16:24:26 +01:00
parent f330fdb6a7
commit 45c1337c84
3 changed files with 33 additions and 3 deletions

View file

@ -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 {

View file

@ -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;

View file

@ -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;
}