mirror of
https://github.com/slint-ui/slint.git
synced 2025-10-01 22:31:14 +00:00
Improve rendering of circles with the GL backend
Rendering a circle using `rounded_rect` will create a path with `LineTo` verbs for the edges. Unfortunately those create visible artefacts, especially in lower resolutions. Therefore this patch attempts to detect this scenario and draw a circle instead. Fixes #152
This commit is contained in:
parent
e09fa06226
commit
08413212f9
1 changed files with 13 additions and 7 deletions
|
@ -691,13 +691,19 @@ impl ItemRenderer for GLItemRenderer {
|
||||||
// and 50% outwards. We choose the CSS model, so the inner rectangle
|
// and 50% outwards. We choose the CSS model, so the inner rectangle
|
||||||
// is adjusted accordingly.
|
// is adjusted accordingly.
|
||||||
let mut path = femtovg::Path::new();
|
let mut path = femtovg::Path::new();
|
||||||
path.rounded_rect(
|
let border_radius = rect.border_radius();
|
||||||
geometry.min_x() + border_width / 2.,
|
let x = geometry.min_x() + border_width / 2.;
|
||||||
geometry.min_y() + border_width / 2.,
|
let y = geometry.min_y() + border_width / 2.;
|
||||||
geometry.width() - border_width,
|
let width = geometry.width() - border_width;
|
||||||
geometry.height() - border_width,
|
let height = geometry.height() - border_width;
|
||||||
rect.border_radius(),
|
// If we're drawing a circle, use directly connected bezier curves instead of
|
||||||
);
|
// ones with intermediate LineTo verbs, as `rounded_rect` creates, to avoid
|
||||||
|
// rendering artifacts due to those edges.
|
||||||
|
if width == height && border_radius * 2. == width {
|
||||||
|
path.circle(x + border_radius, y + border_radius, border_radius);
|
||||||
|
} else {
|
||||||
|
path.rounded_rect(x, y, width, height, border_radius);
|
||||||
|
}
|
||||||
|
|
||||||
let fill_paint = femtovg::Paint::color(rect.color().into());
|
let fill_paint = femtovg::Paint::color(rect.color().into());
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue