Merge branch 'wip/otte/for-main' into 'main'

gl: Interpolate gradient colors as premultiplied

See merge request GNOME/gtk!7597
This commit is contained in:
Benjamin Otte 2024-08-11 17:41:41 +00:00
commit ed05890740
14 changed files with 123 additions and 12 deletions

View File

@ -75,10 +75,10 @@ void main() {
if (offset < next_offset) {
float f = (offset - curr_offset) / (next_offset - curr_offset);
vec4 curr_color = get_color(i);
vec4 next_color = get_color(i + 1);
vec4 curr_color = gsk_scaled_premultiply (get_color(i), u_alpha);
vec4 next_color = gsk_scaled_premultiply (get_color(i + 1), u_alpha);
vec4 color = mix(curr_color, next_color, f);
gskSetScaledOutputColor(gsk_premultiply(color), u_alpha);
gskSetOutputColor(color);
return;
}
}

View File

@ -97,10 +97,10 @@ void main() {
if (offset < next_offset) {
float f = (offset - curr_offset) / (next_offset - curr_offset);
vec4 curr_color = get_color(i);
vec4 next_color = get_color(i + 1);
vec4 curr_color = gsk_scaled_premultiply (get_color(i), u_alpha);
vec4 next_color = gsk_scaled_premultiply (get_color(i + 1), u_alpha);
vec4 color = mix(curr_color, next_color, f);
gskSetScaledOutputColor(gsk_premultiply (color), u_alpha);
gskSetOutputColor(color);
return;
}
}

View File

@ -77,10 +77,10 @@ void main() {
if (offset < next_offset) {
float f = (offset - curr_offset) / (next_offset - curr_offset);
vec4 curr_color = get_color(i);
vec4 next_color = get_color(i + 1);
vec4 curr_color = gsk_scaled_premultiply (get_color(i), u_alpha);
vec4 next_color = gsk_scaled_premultiply (get_color(i + 1), u_alpha);
vec4 color = mix(curr_color, next_color, f);
gskSetScaledOutputColor(gsk_premultiply(color), u_alpha);
gskSetOutputColor(color);
return;
}
}

View File

@ -516,6 +516,33 @@ parse_positive_double (GtkCssParser *parser,
return gtk_css_parser_consume_number (parser, out_double);
}
static gboolean
parse_strictly_positive_double (GtkCssParser *parser,
Context *context,
gpointer out_double)
{
double tmp;
if (gtk_css_parser_has_token (parser, GTK_CSS_TOKEN_SIGNED_NUMBER)
|| gtk_css_parser_has_token (parser, GTK_CSS_TOKEN_SIGNED_INTEGER))
{
gtk_css_parser_error_syntax (parser, "Expected a strictly positive number");
return FALSE;
}
if (!gtk_css_parser_consume_number (parser, &tmp))
return FALSE;
if (tmp == 0)
{
gtk_css_parser_error_syntax (parser, "Expected a strictly positive number");
return FALSE;
}
*(double *) out_double = tmp;
return TRUE;
}
static gboolean
parse_point (GtkCssParser *parser,
Context *context,
@ -1765,8 +1792,8 @@ parse_radial_gradient_node_internal (GtkCssParser *parser,
const Declaration declarations[] = {
{ "bounds", parse_rect, NULL, &bounds },
{ "center", parse_point, NULL, &center },
{ "hradius", parse_positive_double, NULL, &hradius },
{ "vradius", parse_positive_double, NULL, &vradius },
{ "hradius", parse_strictly_positive_double, NULL, &hradius },
{ "vradius", parse_strictly_positive_double, NULL, &vradius },
{ "start", parse_positive_double, NULL, &start },
{ "end", parse_positive_double, NULL, &end },
{ "stops", parse_stops, clear_stops, &stops },
@ -1784,7 +1811,16 @@ parse_radial_gradient_node_internal (GtkCssParser *parser,
g_array_append_val (stops, to);
}
if (repeating)
if (end <= start)
{
gtk_css_parser_error (parser,
GTK_CSS_PARSER_ERROR_UNKNOWN_VALUE,
gtk_css_parser_get_block_location (parser),
gtk_css_parser_get_end_location (parser),
"\"start\" must be larger than \"end\"");
result = NULL;
}
else if (repeating)
result = gsk_repeating_radial_gradient_node_new (&bounds, &center, hradius, vradius, start, end,
(GskColorStop *) stops->data, stops->len);
else

View File

@ -0,0 +1,15 @@
color-matrix {
matrix: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 100);
child: container {
conic-gradient {
bounds: 0 0 50 50;
center: 25 25;
stops: 0 rgb(255,0,0), 0.6 rgba(0,255,255,0);
}
conic-gradient {
bounds: 0 0 50 50;
center: 25 25;
stops: 0.4 rgba(0,255,255,0), 1 rgb(255,0,0);
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 B

View File

@ -0,0 +1,9 @@
color-matrix {
matrix: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 100);
child: linear-gradient {
bounds: 0 0 50 50;
start: 0 -50;
end: 0 100;
stops: 0 rgb(255,0,0), 1 rgba(0,255,255,0);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 B

View File

@ -0,0 +1,10 @@
color-matrix {
matrix: matrix3d(2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 2, 0, 0, 0, 0, 100);
child: radial-gradient {
bounds: 0 0 50 50;
center: 25 25;
hradius: 40;
vradius: 40;
stops: 0 rgb(255,0,0), 1 rgba(0,255,255,0);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 B

View File

@ -48,6 +48,7 @@ compare_render_tests = [
'color-matrix-merge',
'color-matrix-parsing',
'color-states',
'conic-gradient-premultiplied-nocairo',
'conic-gradient-with-64-colorstops',
'container-single-child-offscreen-for-opacity',
'crossfade-clip-both-children',
@ -100,6 +101,7 @@ compare_render_tests = [
'issue-3615',
'linear-gradient-3d-nocairo',
'linear-gradient-nonorthogonal-scale-nogl',
'linear-gradient-premultiplied-nocairo',
'linear-gradient-with-64-colorstops',
'lots-of-offscreens-nogl',
'mask',
@ -133,6 +135,7 @@ compare_render_tests = [
'outset-shadow-scale-offset',
'outset_shadow_simple',
'premul-color-nogl',
'radial-gradient-premultiplied-nocairo',
'radial-gradient-with-64-colorstops',
'repeat',
'repeating-linear-gradient-edge-colors',
@ -416,6 +419,9 @@ node_parser_tests = [
'occlusion-wrong-rect-contains',
'radial-gradient.node',
'radial-gradient.ref.node',
'radial-gradient-start-end.errors',
'radial-gradient-start-end.node',
'radial-gradient-start-end.ref.node',
'repeating-linear-gradient.node',
'repeating-linear-gradient.ref.node',
'repeating-radial-gradient.node',

View File

@ -0,0 +1,4 @@
<data>:1:1-4:2: error: GTK_CSS_PARSER_ERROR_UNKNOWN_VALUE
<data>:6:1-9:2: error: GTK_CSS_PARSER_ERROR_UNKNOWN_VALUE
<data>:12:12-13: error: GTK_CSS_PARSER_ERROR_SYNTAX
<data>:16:12-13: error: GTK_CSS_PARSER_ERROR_SYNTAX

View File

@ -0,0 +1,17 @@
radial-gradient {
start: 1;
end: 0;
}
radial-gradient {
start: 0.5;
end: 0.5;
}
radial-gradient {
hradius: 0;
}
radial-gradient {
vradius: 0;
}

View File

@ -0,0 +1,14 @@
radial-gradient {
bounds: 0 0 50 50;
center: 25 25;
hradius: 25;
vradius: 25;
stops: 0 rgb(170,255,0), 1 rgb(255,0,204);
}
radial-gradient {
bounds: 0 0 50 50;
center: 25 25;
hradius: 25;
vradius: 25;
stops: 0 rgb(170,255,0), 1 rgb(255,0,204);
}