RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 04:37:34 +00:00
Code Issues Activity Actions

LibWeb: Keep both horizontal and vertical border radii till painting

Browse source
This commit is contained in:
MacDue 2022-06-12 15:05:47 +01:00 • committed by Linus Groh
parent 2366a73474
commit 28c78b45ca
10 changed files with 133 additions and 84 deletions
Download patch file Download diff file Expand all files Collapse all files

29
Userland/Libraries/LibWeb/CSS/ComputedValues.h
View file

@ -110,6 +110,11 @@ struct ContentData {
String alt_text {}; String alt_text {};
}; };
struct BorderRadiusData {
CSS::LengthPercentage horizontal_radius { InitialValues::border_radius() };
CSS::LengthPercentage vertical_radius { InitialValues::border_radius() };
};
class ComputedValues { class ComputedValues {
public: public:
CSS::Float float_() const { return m_noninherited.float_; } CSS::Float float_() const { return m_noninherited.float_; }
@ -159,10 +164,10 @@ public:
BorderData const& border_right() const { return m_noninherited.border_right; } BorderData const& border_right() const { return m_noninherited.border_right; }
BorderData const& border_bottom() const { return m_noninherited.border_bottom; } BorderData const& border_bottom() const { return m_noninherited.border_bottom; }
const CSS::LengthPercentage& border_bottom_left_radius() const { return m_noninherited.border_bottom_left_radius; } const CSS::BorderRadiusData& border_bottom_left_radius() const { return m_noninherited.border_bottom_left_radius; }
const CSS::LengthPercentage& border_bottom_right_radius() const { return m_noninherited.border_bottom_right_radius; } const CSS::BorderRadiusData& border_bottom_right_radius() const { return m_noninherited.border_bottom_right_radius; }
const CSS::LengthPercentage& border_top_left_radius() const { return m_noninherited.border_top_left_radius; } const CSS::BorderRadiusData& border_top_left_radius() const { return m_noninherited.border_top_left_radius; }
const CSS::LengthPercentage& border_top_right_radius() const { return m_noninherited.border_top_right_radius; } const CSS::BorderRadiusData& border_top_right_radius() const { return m_noninherited.border_top_right_radius; }
CSS::Overflow overflow_x() const { return m_noninherited.overflow_x; } CSS::Overflow overflow_x() const { return m_noninherited.overflow_x; }
CSS::Overflow overflow_y() const { return m_noninherited.overflow_y; } CSS::Overflow overflow_y() const { return m_noninherited.overflow_y; }
@ -237,10 +242,10 @@ protected:
BorderData border_top; BorderData border_top;
BorderData border_right; BorderData border_right;
BorderData border_bottom; BorderData border_bottom;
LengthPercentage border_bottom_left_radius { InitialValues::border_radius() }; BorderRadiusData border_bottom_left_radius;
LengthPercentage border_bottom_right_radius { InitialValues::border_radius() }; BorderRadiusData border_bottom_right_radius;
LengthPercentage border_top_left_radius { InitialValues::border_radius() }; BorderRadiusData border_top_left_radius;
LengthPercentage border_top_right_radius { InitialValues::border_radius() }; BorderRadiusData border_top_right_radius;
Color background_color { InitialValues::background_color() }; Color background_color { InitialValues::background_color() };
Vector<BackgroundLayerData> background_layers; Vector<BackgroundLayerData> background_layers;
CSS::FlexDirection flex_direction { InitialValues::flex_direction() }; CSS::FlexDirection flex_direction { InitialValues::flex_direction() };
@ -304,10 +309,10 @@ public:
void set_overflow_y(CSS::Overflow value) { m_noninherited.overflow_y = value; } void set_overflow_y(CSS::Overflow value) { m_noninherited.overflow_y = value; }
void set_list_style_type(CSS::ListStyleType value) { m_inherited.list_style_type = value; } void set_list_style_type(CSS::ListStyleType value) { m_inherited.list_style_type = value; }
void set_display(CSS::Display value) { m_noninherited.display = value; } void set_display(CSS::Display value) { m_noninherited.display = value; }
void set_border_bottom_left_radius(CSS::LengthPercentage value) { m_noninherited.border_bottom_left_radius = value; } void set_border_bottom_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_left_radius = value; }
void set_border_bottom_right_radius(CSS::LengthPercentage value) { m_noninherited.border_bottom_right_radius = value; } void set_border_bottom_right_radius(CSS::BorderRadiusData value) { m_noninherited.border_bottom_right_radius = value; }
void set_border_top_left_radius(CSS::LengthPercentage value) { m_noninherited.border_top_left_radius = value; } void set_border_top_left_radius(CSS::BorderRadiusData value) { m_noninherited.border_top_left_radius = value; }
void set_border_top_right_radius(CSS::LengthPercentage value) { m_noninherited.border_top_right_radius = value; } void set_border_top_right_radius(CSS::BorderRadiusData value) { m_noninherited.border_top_right_radius = value; }
BorderData& border_left() { return m_noninherited.border_left; } BorderData& border_left() { return m_noninherited.border_left; }
BorderData& border_top() { return m_noninherited.border_top; } BorderData& border_top() { return m_noninherited.border_top; }
BorderData& border_right() { return m_noninherited.border_right; } BorderData& border_right() { return m_noninherited.border_right; }

24
Userland/Libraries/LibWeb/CSS/ResolvedCSSStyleDeclaration.cpp
View file

@ -284,14 +284,22 @@ RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout:
return BorderRadiusShorthandStyleValue::create(top_left_radius.release_nonnull(), top_right_radius.release_nonnull(), bottom_right_radius.release_nonnull(), bottom_left_radius.release_nonnull()); return BorderRadiusShorthandStyleValue::create(top_left_radius.release_nonnull(), top_right_radius.release_nonnull(), bottom_right_radius.release_nonnull(), bottom_left_radius.release_nonnull());
} }
// FIXME: The two radius components are not yet stored, as we currently don't actually render them. // FIXME: The two radius components are not yet stored, as we currently don't actually render them.
case CSS::PropertyID::BorderBottomLeftRadius: case CSS::PropertyID::BorderBottomLeftRadius: {
return BorderRadiusStyleValue::create(layout_node.computed_values().border_bottom_left_radius(), layout_node.computed_values().border_bottom_left_radius()); auto const& border_radius = layout_node.computed_values().border_bottom_left_radius();
case CSS::PropertyID::BorderBottomRightRadius: return BorderRadiusStyleValue::create(border_radius.horizontal_radius, border_radius.vertical_radius);
return BorderRadiusStyleValue::create(layout_node.computed_values().border_bottom_right_radius(), layout_node.computed_values().border_bottom_right_radius()); }
case CSS::PropertyID::BorderTopLeftRadius: case CSS::PropertyID::BorderBottomRightRadius: {
return BorderRadiusStyleValue::create(layout_node.computed_values().border_top_left_radius(), layout_node.computed_values().border_top_left_radius()); auto const& border_radius = layout_node.computed_values().border_bottom_right_radius();
case CSS::PropertyID::BorderTopRightRadius: return BorderRadiusStyleValue::create(border_radius.horizontal_radius, border_radius.vertical_radius);
return BorderRadiusStyleValue::create(layout_node.computed_values().border_top_right_radius(), layout_node.computed_values().border_top_right_radius()); }
case CSS::PropertyID::BorderTopLeftRadius: {
auto const& border_radius = layout_node.computed_values().border_top_left_radius();
return BorderRadiusStyleValue::create(border_radius.horizontal_radius, border_radius.vertical_radius);
}
case CSS::PropertyID::BorderTopRightRadius: {
auto const& border_radius = layout_node.computed_values().border_top_right_radius();
return BorderRadiusStyleValue::create(border_radius.horizontal_radius, border_radius.vertical_radius);
}
case CSS::PropertyID::BorderTopWidth: case CSS::PropertyID::BorderTopWidth:
return LengthStyleValue::create(Length::make_px(layout_node.computed_values().border_top().width)); return LengthStyleValue::create(Length::make_px(layout_node.computed_values().border_top().width));
case CSS::PropertyID::BorderRightWidth: case CSS::PropertyID::BorderRightWidth:

36
Userland/Libraries/LibWeb/Layout/Node.cpp
View file

@ -368,21 +368,33 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
// FIXME: BorderXRadius properties are now BorderRadiusStyleValues, so make use of that. // FIXME: BorderXRadius properties are now BorderRadiusStyleValues, so make use of that.
auto border_bottom_left_radius = computed_style.property(CSS::PropertyID::BorderBottomLeftRadius); auto border_bottom_left_radius = computed_style.property(CSS::PropertyID::BorderBottomLeftRadius);
if (border_bottom_left_radius->is_border_radius()) if (border_bottom_left_radius->is_border_radius()) {
computed_values.set_border_bottom_left_radius(border_bottom_left_radius->as_border_radius().horizontal_radius()); computed_values.set_border_bottom_left_radius(
CSS::BorderRadiusData {
border_bottom_left_radius->as_border_radius().horizontal_radius(),
border_bottom_left_radius->as_border_radius().vertical_radius() });
}
auto border_bottom_right_radius = computed_style.property(CSS::PropertyID::BorderBottomRightRadius); auto border_bottom_right_radius = computed_style.property(CSS::PropertyID::BorderBottomRightRadius);
if (border_bottom_right_radius->is_border_radius()) if (border_bottom_right_radius->is_border_radius()) {
computed_values.set_border_bottom_right_radius(border_bottom_right_radius->as_border_radius().horizontal_radius()); computed_values.set_border_bottom_right_radius(
CSS::BorderRadiusData {
border_bottom_right_radius->as_border_radius().horizontal_radius(),
border_bottom_right_radius->as_border_radius().vertical_radius() });
}
auto border_top_left_radius = computed_style.property(CSS::PropertyID::BorderTopLeftRadius); auto border_top_left_radius = computed_style.property(CSS::PropertyID::BorderTopLeftRadius);
if (border_top_left_radius->is_border_radius()) if (border_top_left_radius->is_border_radius()) {
computed_values.set_border_top_left_radius(border_top_left_radius->as_border_radius().horizontal_radius()); computed_values.set_border_top_left_radius(
CSS::BorderRadiusData {
border_top_left_radius->as_border_radius().horizontal_radius(),
border_top_left_radius->as_border_radius().vertical_radius() });
}
auto border_top_right_radius = computed_style.property(CSS::PropertyID::BorderTopRightRadius); auto border_top_right_radius = computed_style.property(CSS::PropertyID::BorderTopRightRadius);
if (border_top_right_radius->is_border_radius()) if (border_top_right_radius->is_border_radius()) {
computed_values.set_border_top_right_radius(border_top_right_radius->as_border_radius().horizontal_radius()); computed_values.set_border_top_right_radius(
CSS::BorderRadiusData {
border_top_right_radius->as_border_radius().horizontal_radius(),
border_top_right_radius->as_border_radius().vertical_radius() });
}
computed_values.set_display(computed_style.display()); computed_values.set_display(computed_style.display());
auto flex_direction = computed_style.flex_direction(); auto flex_direction = computed_style.flex_direction();

6
Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp
View file

@ -15,7 +15,7 @@
namespace Web::Painting { namespace Web::Painting {
// https://www.w3.org/TR/css-backgrounds-3/#backgrounds // https://www.w3.org/TR/css-backgrounds-3/#backgrounds
void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMetrics const& layout_node, Gfx::FloatRect const& border_rect, Color background_color, Vector<CSS::BackgroundLayerData> const* background_layers, BorderRadiusData const& border_radius) void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMetrics const& layout_node, Gfx::FloatRect const& border_rect, Color background_color, Vector<CSS::BackgroundLayerData> const* background_layers, BorderRadiiData const& border_radii)
{ {
auto& painter = context.painter(); auto& painter = context.painter();
@ -41,10 +41,10 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet
auto color_rect = border_rect; auto color_rect = border_rect;
if (background_layers && !background_layers->is_empty()) if (background_layers && !background_layers->is_empty())
color_rect = get_box(background_layers->last().clip); color_rect = get_box(background_layers->last().clip);
// FIXME: Support elliptical corners
Gfx::AntiAliasingPainter aa_painter { painter }; Gfx::AntiAliasingPainter aa_painter { painter };
aa_painter.fill_rect_with_rounded_corners(color_rect.to_rounded<int>(), aa_painter.fill_rect_with_rounded_corners(color_rect.to_rounded<int>(),
background_color, border_radius.top_left, border_radius.top_right, border_radius.bottom_right, border_radius.bottom_left); background_color, border_radii.top_left.horizontal_radius, border_radii.top_right.horizontal_radius, border_radii.bottom_right.horizontal_radius, border_radii.bottom_left.horizontal_radius);
if (!background_layers) if (!background_layers)
return; return;

2
Userland/Libraries/LibWeb/Painting/BackgroundPainting.h
View file

@ -13,6 +13,6 @@
namespace Web::Painting { namespace Web::Painting {
void paint_background(PaintContext&, Layout::NodeWithStyleAndBoxModelMetrics const&, Gfx::FloatRect const&, Color background_color, Vector<CSS::BackgroundLayerData> const*, BorderRadiusData const&); void paint_background(PaintContext&, Layout::NodeWithStyleAndBoxModelMetrics const&, Gfx::FloatRect const&, Color background_color, Vector<CSS::BackgroundLayerData> const*, BorderRadiiData const&);
} }

81
Userland/Libraries/LibWeb/Painting/BorderPainting.cpp
View file

@ -11,37 +11,55 @@
namespace Web::Painting { namespace Web::Painting {
BorderRadiusData normalized_border_radius_data(Layout::Node const& node, Gfx::FloatRect const& rect, CSS::LengthPercentage top_left_radius, CSS::LengthPercentage top_right_radius, CSS::LengthPercentage bottom_right_radius, CSS::LengthPercentage bottom_left_radius) BorderRadiiData normalized_border_radii_data(Layout::Node const& node, Gfx::FloatRect const& rect, CSS::BorderRadiusData top_left_radius, CSS::BorderRadiusData top_right_radius, CSS::BorderRadiusData bottom_right_radius, CSS::BorderRadiusData bottom_left_radius)
{ {
// FIXME: Some values should be relative to the height() if specified, but which?
// Spec just says "Refer to corresponding dimension of the border box."
// For now, all relative values are relative to the width.
auto width_length = CSS::Length::make_px(rect.width()); auto width_length = CSS::Length::make_px(rect.width());
auto bottom_left_radius_px = bottom_left_radius.resolved(node, width_length).to_px(node); auto height_length = CSS::Length::make_px(rect.height());
auto bottom_right_radius_px = bottom_right_radius.resolved(node, width_length).to_px(node);
auto top_left_radius_px = top_left_radius.resolved(node, width_length).to_px(node); BorderRadiusData bottom_left_radius_px {
auto top_right_radius_px = top_right_radius.resolved(node, width_length).to_px(node); bottom_left_radius.horizontal_radius.resolved(node, width_length).to_px(node),
bottom_left_radius.vertical_radius.resolved(node, height_length).to_px(node)
};
BorderRadiusData bottom_right_radius_px {
bottom_right_radius.horizontal_radius.resolved(node, width_length).to_px(node),
bottom_right_radius.vertical_radius.resolved(node, height_length).to_px(node)
};
BorderRadiusData top_left_radius_px {
top_left_radius.horizontal_radius.resolved(node, width_length).to_px(node),
top_left_radius.vertical_radius.resolved(node, height_length).to_px(node)
};
BorderRadiusData top_right_radius_px {
top_right_radius.horizontal_radius.resolved(node, width_length).to_px(node),
top_right_radius.vertical_radius.resolved(node, height_length).to_px(node)
};
// Scale overlapping curves according to https://www.w3.org/TR/css-backgrounds-3/#corner-overlap // Scale overlapping curves according to https://www.w3.org/TR/css-backgrounds-3/#corner-overlap
auto f = 1.0f; auto f = 1.0f;
auto width_reciprocal = 1.0f / rect.width(); auto width_reciprocal = 1.0f / rect.width();
auto height_reciprocal = 1.0f / rect.height(); auto height_reciprocal = 1.0f / rect.height();
f = max(f, width_reciprocal * (top_left_radius_px + top_right_radius_px)); f = max(f, width_reciprocal * (top_left_radius_px.horizontal_radius + top_right_radius_px.horizontal_radius));
f = max(f, height_reciprocal * (top_right_radius_px + bottom_right_radius_px)); f = max(f, height_reciprocal * (top_right_radius_px.vertical_radius + bottom_right_radius_px.vertical_radius));
f = max(f, width_reciprocal * (bottom_left_radius_px + bottom_right_radius_px)); f = max(f, width_reciprocal * (bottom_left_radius_px.horizontal_radius + bottom_right_radius_px.horizontal_radius));
f = max(f, height_reciprocal * (top_left_radius_px + bottom_left_radius_px)); f = max(f, height_reciprocal * (top_left_radius_px.vertical_radius + bottom_left_radius_px.vertical_radius));
f = 1.0f / f; f = 1.0f / f;
top_left_radius_px = (int)(top_left_radius_px * f); top_left_radius_px.horizontal_radius *= f;
top_right_radius_px = (int)(top_right_radius_px * f); top_left_radius_px.vertical_radius *= f;
bottom_right_radius_px = (int)(bottom_right_radius_px * f); top_right_radius_px.horizontal_radius *= f;
bottom_left_radius_px = (int)(bottom_left_radius_px * f); top_right_radius_px.vertical_radius *= f;
bottom_right_radius_px.horizontal_radius *= f;
bottom_right_radius_px.vertical_radius *= f;
bottom_left_radius_px.horizontal_radius *= f;
bottom_left_radius_px.vertical_radius *= f;
return BorderRadiusData { top_left_radius_px, top_right_radius_px, bottom_right_radius_px, bottom_left_radius_px }; return BorderRadiiData { top_left_radius_px, top_right_radius_px, bottom_right_radius_px, bottom_left_radius_px };
} }
void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const& a_rect, BorderRadiusData const& border_radius_data, BordersData const& borders_data) void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const& a_rect, BorderRadiiData const& border_radii_data, BordersData const& borders_data)
{ {
auto rect = a_rect.to_rounded<float>(); auto rect = a_rect.to_rounded<float>();
@ -132,10 +150,10 @@ void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const&
float p1_step = 0; float p1_step = 0;
float p2_step = 0; float p2_step = 0;
bool has_top_left_radius = border_radius_data.top_left > 0; bool has_top_left_radius = border_radii_data.top_left.horizontal_radius > 0;
bool has_top_right_radius = border_radius_data.top_right > 0; bool has_top_right_radius = border_radii_data.top_right.horizontal_radius > 0;
bool has_bottom_left_radius = border_radius_data.bottom_left > 0; bool has_bottom_left_radius = border_radii_data.bottom_left.horizontal_radius > 0;
bool has_bottom_right_radius = border_radius_data.bottom_right > 0; bool has_bottom_right_radius = border_radii_data.bottom_right.horizontal_radius > 0;
switch (edge) { switch (edge) {
case BorderEdge::Top: case BorderEdge::Top:
@ -177,16 +195,15 @@ void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const&
} }
} }
void paint_all_borders(PaintContext& context, Gfx::FloatRect const& bordered_rect, BorderRadiusData const& border_radius_data, BordersData const& borders_data) void paint_all_borders(PaintContext& context, Gfx::FloatRect const& bordered_rect, BorderRadiiData const& border_radii_data, BordersData const& borders_data)
{ {
auto const border_rect = bordered_rect; auto const border_rect = bordered_rect;
auto const top_left_radius = border_radius_data.top_left;
auto const top_right_radius = border_radius_data.top_right;
auto const bottom_right_radius = border_radius_data.bottom_right;
auto const bottom_left_radius = border_radius_data.bottom_left;
// FIXME: Support elliptical border radii. // FIXME: Support elliptical border radii.
auto const top_left_radius = border_radii_data.top_left.horizontal_radius;
auto const top_right_radius = border_radii_data.top_right.horizontal_radius;
auto const bottom_right_radius = border_radii_data.bottom_right.horizontal_radius;
auto const bottom_left_radius = border_radii_data.bottom_left.horizontal_radius;
Gfx::FloatRect top_border_rect = { Gfx::FloatRect top_border_rect = {
border_rect.x() + top_left_radius, border_rect.x() + top_left_radius,
@ -213,10 +230,10 @@ void paint_all_borders(PaintContext& context, Gfx::FloatRect const& bordered_rec
border_rect.height() - top_left_radius - bottom_left_radius border_rect.height() - top_left_radius - bottom_left_radius
}; };
Painting::paint_border(context, Painting::BorderEdge::Top, top_border_rect, border_radius_data, borders_data); Painting::paint_border(context, Painting::BorderEdge::Top, top_border_rect, border_radii_data, borders_data);
Painting::paint_border(context, Painting::BorderEdge::Right, right_border_rect, border_radius_data, borders_data); Painting::paint_border(context, Painting::BorderEdge::Right, right_border_rect, border_radii_data, borders_data);
Painting::paint_border(context, Painting::BorderEdge::Bottom, bottom_border_rect, border_radius_data, borders_data); Painting::paint_border(context, Painting::BorderEdge::Bottom, bottom_border_rect, border_radii_data, borders_data);
Painting::paint_border(context, Painting::BorderEdge::Left, left_border_rect, border_radius_data, borders_data); Painting::paint_border(context, Painting::BorderEdge::Left, left_border_rect, border_radii_data, borders_data);
// Draws a quarter circle clockwise // Draws a quarter circle clockwise
auto draw_quarter_circle = [&](Gfx::FloatPoint const& from, Gfx::FloatPoint const& to, Gfx::Color color, int thickness) { auto draw_quarter_circle = [&](Gfx::FloatPoint const& from, Gfx::FloatPoint const& to, Gfx::Color color, int thickness) {

20
Userland/Libraries/LibWeb/Painting/BorderPainting.h
View file

@ -12,12 +12,18 @@
namespace Web::Painting { namespace Web::Painting {
struct BorderRadiusData { struct BorderRadiusData {
float top_left { 0 }; float horizontal_radius { 0 };
float top_right { 0 }; float vertical_radius { 0 };
float bottom_right { 0 };
float bottom_left { 0 };
}; };
BorderRadiusData normalized_border_radius_data(Layout::Node const&, Gfx::FloatRect const&, CSS::LengthPercentage top_left_radius, CSS::LengthPercentage top_right_radius, CSS::LengthPercentage bottom_right_radius, CSS::LengthPercentage bottom_left_radius);
struct BorderRadiiData {
BorderRadiusData top_left;
BorderRadiusData top_right;
BorderRadiusData bottom_right;
BorderRadiusData bottom_left;
};
BorderRadiiData normalized_border_radii_data(Layout::Node const&, Gfx::FloatRect const&, CSS::BorderRadiusData top_left_radius, CSS::BorderRadiusData top_right_radius, CSS::BorderRadiusData bottom_right_radius, CSS::BorderRadiusData bottom_left_radius);
enum class BorderEdge { enum class BorderEdge {
Top, Top,
@ -31,7 +37,7 @@ struct BordersData {
CSS::BorderData bottom; CSS::BorderData bottom;
CSS::BorderData left; CSS::BorderData left;
}; };
void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const& rect, BorderRadiusData const& border_radius_data, BordersData const& borders_data); void paint_border(PaintContext& context, BorderEdge edge, Gfx::FloatRect const& rect, BorderRadiiData const& border_radii_data, BordersData const& borders_data);
void paint_all_borders(PaintContext& context, Gfx::FloatRect const& bordered_rect, BorderRadiusData const& border_radius_data, BordersData const&); void paint_all_borders(PaintContext& context, Gfx::FloatRect const& bordered_rect, BorderRadiiData const& border_radii_data, BordersData const&);
} }

8
Userland/Libraries/LibWeb/Painting/InlinePaintable.cpp
View file

@ -54,8 +54,8 @@ void InlinePaintable::paint(PaintContext& context, Painting::PaintPhase phase) c
absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_end_width); absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_end_width);
} }
auto border_radius_data = Painting::normalized_border_radius_data(layout_node(), absolute_fragment_rect, top_left_border_radius, top_right_border_radius, bottom_right_border_radius, bottom_left_border_radius); auto border_radii_data = Painting::normalized_border_radii_data(layout_node(), absolute_fragment_rect, top_left_border_radius, top_right_border_radius, bottom_right_border_radius, bottom_left_border_radius);
Painting::paint_background(context, layout_node(), absolute_fragment_rect, computed_values().background_color(), &computed_values().background_layers(), border_radius_data); Painting::paint_background(context, layout_node(), absolute_fragment_rect, computed_values().background_color(), &computed_values().background_layers(), border_radii_data);
if (auto computed_box_shadow = computed_values().box_shadow(); !computed_box_shadow.is_empty()) { if (auto computed_box_shadow = computed_values().box_shadow(); !computed_box_shadow.is_empty()) {
Vector<Painting::ShadowData> resolved_box_shadow_data; Vector<Painting::ShadowData> resolved_box_shadow_data;
@ -106,9 +106,9 @@ void InlinePaintable::paint(PaintContext& context, Painting::PaintPhase phase) c
} }
auto bordered_rect = absolute_fragment_rect.inflated(borders_data.top.width, borders_data.right.width, borders_data.bottom.width, borders_data.left.width); auto bordered_rect = absolute_fragment_rect.inflated(borders_data.top.width, borders_data.right.width, borders_data.bottom.width, borders_data.left.width);
auto border_radius_data = Painting::normalized_border_radius_data(layout_node(), bordered_rect, top_left_border_radius, top_right_border_radius, bottom_right_border_radius, bottom_left_border_radius); auto border_radii_data = Painting::normalized_border_radii_data(layout_node(), bordered_rect, top_left_border_radius, top_right_border_radius, bottom_right_border_radius, bottom_left_border_radius);
Painting::paint_all_borders(context, bordered_rect, border_radius_data, borders_data); Painting::paint_all_borders(context, bordered_rect, border_radii_data, borders_data);
return IterationDecision::Continue; return IterationDecision::Continue;
}); });

8
Userland/Libraries/LibWeb/Painting/PaintableBox.cpp
View file

@ -178,7 +178,7 @@ void PaintableBox::paint_border(PaintContext& context) const
.bottom = computed_values().border_bottom(), .bottom = computed_values().border_bottom(),
.left = computed_values().border_left(), .left = computed_values().border_left(),
}; };
paint_all_borders(context, absolute_border_box_rect(), normalized_border_radius_data(), borders_data); paint_all_borders(context, absolute_border_box_rect(), normalized_border_radii_data(), borders_data);
} }
void PaintableBox::paint_background(PaintContext& context) const void PaintableBox::paint_background(PaintContext& context) const
@ -210,7 +210,7 @@ void PaintableBox::paint_background(PaintContext& context) const
if (computed_values().border_top().width || computed_values().border_right().width || computed_values().border_bottom().width || computed_values().border_left().width) if (computed_values().border_top().width || computed_values().border_right().width || computed_values().border_bottom().width || computed_values().border_left().width)
background_rect = absolute_border_box_rect(); background_rect = absolute_border_box_rect();
Painting::paint_background(context, layout_box(), background_rect, background_color, background_layers, normalized_border_radius_data()); Painting::paint_background(context, layout_box(), background_rect, background_color, background_layers, normalized_border_radii_data());
} }
void PaintableBox::paint_box_shadow(PaintContext& context) const void PaintableBox::paint_box_shadow(PaintContext& context) const
@ -233,9 +233,9 @@ void PaintableBox::paint_box_shadow(PaintContext& context) const
Painting::paint_box_shadow(context, enclosing_int_rect(absolute_border_box_rect()), resolved_box_shadow_data); Painting::paint_box_shadow(context, enclosing_int_rect(absolute_border_box_rect()), resolved_box_shadow_data);
} }
BorderRadiusData PaintableBox::normalized_border_radius_data() const BorderRadiiData PaintableBox::normalized_border_radii_data() const
{ {
return Painting::normalized_border_radius_data(layout_box(), absolute_border_box_rect(), return Painting::normalized_border_radii_data(layout_box(), absolute_border_box_rect(),
computed_values().border_top_left_radius(), computed_values().border_top_left_radius(),
computed_values().border_top_right_radius(), computed_values().border_top_right_radius(),
computed_values().border_bottom_right_radius(), computed_values().border_bottom_right_radius(),

3
Userland/Libraries/LibWeb/Painting/PaintableBox.h
View file

@ -6,6 +6,7 @@
#pragma once #pragma once
#include <LibWeb/Painting/BorderPainting.h>
#include <LibWeb/Painting/Paintable.h> #include <LibWeb/Painting/Paintable.h>
namespace Web::Painting { namespace Web::Painting {
@ -129,7 +130,7 @@ protected:
virtual Gfx::FloatRect compute_absolute_rect() const; virtual Gfx::FloatRect compute_absolute_rect() const;
private: private:
Painting::BorderRadiusData normalized_border_radius_data() const; Painting::BorderRadiiData normalized_border_radii_data() const;
OwnPtr<Painting::StackingContext> m_stacking_context; OwnPtr<Painting::StackingContext> m_stacking_context;