Improve tessellation quality #5669
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Preview available at https://egui-pr-preview.github.io/pr/5669-emilkimprove-tessellator |
emilk
commented
Feb 4, 2025
| @@ -611,7 +611,8 @@ impl Window<'_> { | |||
| title_bar.inner_rect.round_to_pixels(ctx.pixels_per_point()); | |||
|
|
|||
| if on_top && area_content_ui.visuals().window_highlight_topmost { | |||
| let mut round = window_frame.rounding; | |||
| let mut round = | |||
| window_frame.rounding - window_frame.stroke.width.round() as u8; | |||
There was a problem hiding this comment.
Maybe rename rounding to corner_radius everywhere?
There was a problem hiding this comment.
Let's do it in a follow-up PR
|
0 rounding + blur + thick stroke messes up pretty bad I know blur and stroke is probably a rare edge case, but maybe there is an easy fix? If there isn't we could maybe set the rounding to at least 1 when we detect a blur and a stroke, since this only happens with 0 rounding |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Defining what
RoundingisThis PR defines what
Roundingmeans: it is the corner radius of underlyingRectShaperectangle. If you useStrokeKind::Inside, this means the rounding is of the outer part of the stroke. Conversely, if you useStrokeKind::Outside, the stroke is outside the rounded rectangle, so the stroke has an inner radius orrounding, and an outer radius that is larger bystroke.width.This definitions is the same as Figma uses.
Improving general shape rendering
The rendering of filled shapes (rectangles, circles, paths, bezier) has been rewritten. Instead of first painting the fill with the stroke on top, we now paint them as one single mesh with shared vertices at the border. This has several benefits:
The logic for rendering thin strokes has also been improved, so that the width of a stroke of
StrokeKind::Outsidenever affects the filled area (this used to be wrong for thin strokes).Improving of rectangle rendering
Rectangles also has specific improvements in how thin rectangles are painted.
The handling of "Blur width" is also a lot better, and now works for rectangles with strokes.
There also used to be bugs with specific combinations of corner radius and stroke width, that are now fixed.
But why?
With the new
egui::Scenewe end up with a lot of zoomed out shapes, with sub-pixel strokes. These need to look good! One thing led to another, and then I became obsessive 😅Tessellation Test
In order to investigate the rendering, I created a Tessellation Test in the
egui_demo_lib.Try it here