mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 19:27:45 +00:00
LibWeb: Shift SVG paintable clip rectangle by scroll offset
Rectangles should be recorded using absolute coordinates, including the scroll offset.
This commit is contained in:
parent
677bcea771
commit
d43dbe2842
3 changed files with 50 additions and 1 deletions
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<style>
|
||||||
|
svg {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
32
Tests/LibWeb/Ref/svg-inside-scroll-container.html
Normal file
32
Tests/LibWeb/Ref/svg-inside-scroll-container.html
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<link rel="match" href="reference/svg-inside-scroll-container-ref.html" />
|
||||||
|
<style>
|
||||||
|
#scrollable {
|
||||||
|
height: 300px;
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
svg {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<div id="scrollable">
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
<svg width="100" height="100">
|
||||||
|
<rect width="100" height="100" fill="green" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
const scrollContainer = document.getElementById("scrollable");
|
||||||
|
scrollContainer.scrollTop = 100;
|
||||||
|
</script>
|
|
@ -30,7 +30,9 @@ void SVGSVGPaintable::before_children_paint(PaintContext& context, PaintPhase ph
|
||||||
if (phase != PaintPhase::Foreground)
|
if (phase != PaintPhase::Foreground)
|
||||||
return;
|
return;
|
||||||
context.recording_painter().save();
|
context.recording_painter().save();
|
||||||
context.recording_painter().add_clip_rect(context.enclosing_device_rect(absolute_rect()).to_type<int>());
|
auto clip_rect = absolute_rect();
|
||||||
|
clip_rect.translate_by(enclosing_scroll_frame_offset().value_or({}));
|
||||||
|
context.recording_painter().add_clip_rect(context.enclosing_device_rect(clip_rect).to_type<int>());
|
||||||
}
|
}
|
||||||
|
|
||||||
void SVGSVGPaintable::after_children_paint(PaintContext& context, PaintPhase phase) const
|
void SVGSVGPaintable::after_children_paint(PaintContext& context, PaintPhase phase) const
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue