Snapshot_mask cannot handle font edge pixels perfectly

截图 2023-06-14 15-29-25

The code is very simple

	for ( GtkWidget* child = gtk_widget_get_first_child( ( gpointer )self ); child;
	      child            = gtk_widget_get_next_sibling( child ) ) {
		gtk_widget_snapshot_child( ( gpointer )self, child, snapshot );
	}


	gtk_snapshot_push_mask( snapshot, GSK_MASK_MODE_ALPHA );

	GtkSnapshot* child_snapshot = gtk_snapshot_new();
	for ( GtkWidget* child = gtk_widget_get_first_child( ( gpointer )self ); child;
	      child            = gtk_widget_get_next_sibling( child ) ) {
		gtk_widget_snapshot_child( ( gpointer )self, child, child_snapshot );
	}
	gtk_snapshot_append_node( snapshot, gtk_snapshot_free_to_node( child_snapshot ) );
	gtk_snapshot_pop( snapshot );

	gtk_snapshot_append_color( snapshot, &color, &GRAPHENE_RECT_INIT( 0, 0, width / 2, height ) );
	gtk_snapshot_pop( snapshot );

I don’t know how to improve it.

who can help me?

I think it should be forbidden to draw fonts under the mask area, by adding a clipping to the font, the problem may be solved.

图片

	{
		gtk_snapshot_push_clip( snapshot, &GRAPHENE_RECT_INIT( offset, 0, width, height ) );
		GtkSnapshot* child_snapshot = gtk_snapshot_new();
		for ( GtkWidget* child = gtk_widget_get_first_child( ( gpointer )self ); child;
		      child            = gtk_widget_get_next_sibling( child ) ) {
			gtk_widget_snapshot_child( ( gpointer )self, child, child_snapshot );
		}
		gtk_snapshot_append_node( snapshot, gtk_snapshot_free_to_node( child_snapshot ) );
		gtk_snapshot_pop( snapshot );
	}

	gtk_snapshot_push_mask( snapshot, GSK_MASK_MODE_ALPHA );
	GtkSnapshot* child_snapshot = gtk_snapshot_new();
	for ( GtkWidget* child = gtk_widget_get_first_child( ( gpointer )self ); child;
	      child            = gtk_widget_get_next_sibling( child ) ) {
		gtk_widget_snapshot_child( ( gpointer )self, child, child_snapshot );
	}
	gtk_snapshot_append_node( snapshot, gtk_snapshot_free_to_node( child_snapshot ) );
	gtk_snapshot_pop( snapshot );
	gtk_snapshot_append_color( snapshot, &color, &GRAPHENE_RECT_INIT( 0, 0, offset, height ) );
	gtk_snapshot_pop( snapshot );

What kind of widgets are composing the letters?

I don’t understand what the code is trying to achieve, and I don’t understand what is wrong with the screenshot.

Putting the two pictures together, it is easy to see the problem

What that code does is: fill part of the word with the specified color

it’s not the focus
I am dealing with the content of the painting.
can be seen as a progress bar

original plan
^
|
|   +-------+
|   | color |
|   | fill  |
| +-+-------+ - - - - +
|
+ +-text text text text

after modification
^
|
|   +-------+
|   | color |
|   | fill  |
| +-+-------+ - - - - +
|
+ +-          text text

The difference between the two schemes is what needs to be drawn.

In the original plan, I drew the characters in the whole area, but gtk can’t handle the color of the edge very well.

So I made a modification. Divide the content that needs to be drawn into two halves, one half draws color, and the other half draws text

Sorry, I still don’t understand what your problem with ‘edge pixels’ is.

In general, I would recommend to use text rendering apis to influence how text is rendered.

PangoLayout and PangoAttributes let you render parts of text with different colors.

Notice the white outline of the first line of text?

about ‘edge’: Sorry, I’m using Google Translate so it doesn’t describe well what I mean.
Can you understand if I replace it with “contour”?

I haven’t learned how to use pango yet.

For the functionality I currently need, using a mask is sufficient.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.