diff --git a/Libraries/LibWeb/Painting/ImagePaintable.cpp b/Libraries/LibWeb/Painting/ImagePaintable.cpp index 935a860ab9d..468d18ee41a 100644 --- a/Libraries/LibWeb/Painting/ImagePaintable.cpp +++ b/Libraries/LibWeb/Painting/ImagePaintable.cpp @@ -62,20 +62,20 @@ void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const PaintableBox::paint(context, phase); if (phase == PaintPhase::Foreground) { - auto image_rect = context.rounded_device_rect(absolute_rect()); + auto image_rect = absolute_rect(); + auto image_rect_device_pixels = context.rounded_device_rect(image_rect); if (m_renders_as_alt_text) { - auto enclosing_rect = context.enclosing_device_rect(absolute_rect()).to_type(); + auto enclosing_rect = context.enclosing_device_rect(image_rect).to_type(); context.display_list_recorder().draw_rect(enclosing_rect, Gfx::Color::Black); context.display_list_recorder().draw_text(enclosing_rect, m_alt_text, *Platform::FontPlugin::the().default_font(12), Gfx::TextAlignment::Center, computed_values().color()); - } else if (auto bitmap = m_image_provider.current_image_bitmap(image_rect.size().to_type())) { - ScopedCornerRadiusClip corner_clip { context, image_rect, normalized_border_radii_data(ShrinkRadiiForBorders::Yes) }; - auto image_int_rect = image_rect.to_type(); + } else if (auto bitmap = m_image_provider.current_image_bitmap(image_rect_device_pixels.size().to_type())) { + ScopedCornerRadiusClip corner_clip { context, image_rect_device_pixels, normalized_border_radii_data(ShrinkRadiiForBorders::Yes) }; + auto image_int_rect_device_pixels = image_rect_device_pixels.to_type(); auto bitmap_rect = bitmap->rect(); - auto scaling_mode = to_gfx_scaling_mode(computed_values().image_rendering(), bitmap_rect, image_int_rect); + auto scaling_mode = to_gfx_scaling_mode(computed_values().image_rendering(), bitmap_rect, image_int_rect_device_pixels); auto bitmap_aspect_ratio = (float)bitmap_rect.height() / bitmap_rect.width(); - auto image_aspect_ratio = (float)image_rect.height().value() / image_rect.width().value(); + auto image_aspect_ratio = (float)image_rect.height() / (float)image_rect.width(); - // FIXME: Scale may be wrong if device-pixels != css-pixels. auto scale_x = 0.0f; auto scale_y = 0.0f; Gfx::IntRect bitmap_intersect = bitmap_rect; @@ -83,7 +83,7 @@ void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const // https://drafts.csswg.org/css-images/#the-object-fit auto object_fit = m_is_svg_image ? CSS::ObjectFit::Contain : computed_values().object_fit(); if (object_fit == CSS::ObjectFit::ScaleDown) { - if (bitmap_rect.width() > image_int_rect.width() || bitmap_rect.height() > image_int_rect.height()) { + if (bitmap_rect.width() > image_rect.width() || bitmap_rect.height() > image_rect.height()) { object_fit = CSS::ObjectFit::Contain; } else { object_fit = CSS::ObjectFit::None; @@ -92,25 +92,25 @@ void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const switch (object_fit) { case CSS::ObjectFit::Fill: - scale_x = (float)image_int_rect.width() / bitmap_rect.width(); - scale_y = (float)image_int_rect.height() / bitmap_rect.height(); + scale_x = (float)image_rect.width() / bitmap_rect.width(); + scale_y = (float)image_rect.height() / bitmap_rect.height(); break; case CSS::ObjectFit::Contain: if (bitmap_aspect_ratio >= image_aspect_ratio) { - scale_x = (float)image_int_rect.height() / bitmap_rect.height(); + scale_x = (float)image_rect.height() / bitmap_rect.height(); scale_y = scale_x; } else { - scale_x = (float)image_int_rect.width() / bitmap_rect.width(); + scale_x = (float)image_rect.width() / bitmap_rect.width(); scale_y = scale_x; } break; case CSS::ObjectFit::Cover: if (bitmap_aspect_ratio >= image_aspect_ratio) { - scale_x = (float)image_int_rect.width() / bitmap_rect.width(); + scale_x = (float)image_rect.width() / bitmap_rect.width(); scale_y = scale_x; bitmap_intersect.set_height(bitmap_rect.width() * image_aspect_ratio); } else { - scale_x = (float)image_int_rect.height() / bitmap_rect.height(); + scale_x = (float)image_rect.height() / bitmap_rect.height(); scale_y = scale_x; bitmap_intersect.set_width(bitmap_rect.height() / image_aspect_ratio); } @@ -120,14 +120,14 @@ void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const case CSS::ObjectFit::None: scale_x = 1; scale_y = 1; - bitmap_intersect.set_size(image_int_rect.size()); + bitmap_intersect.set_size(image_rect.size().to_type()); } - auto scaled_bitmap_width = bitmap_rect.width() * scale_x; - auto scaled_bitmap_height = bitmap_rect.height() * scale_y; + auto scaled_bitmap_width = CSSPixels::nearest_value_for(bitmap_rect.width() * scale_x); + auto scaled_bitmap_height = CSSPixels::nearest_value_for(bitmap_rect.height() * scale_y); - auto residual_horizontal = CSSPixels::nearest_value_for(image_int_rect.width() - scaled_bitmap_width); - auto residual_vertical = CSSPixels::nearest_value_for(image_int_rect.height() - scaled_bitmap_height); + auto residual_horizontal = image_rect.width() - scaled_bitmap_width; + auto residual_vertical = image_rect.height() - scaled_bitmap_height; bitmap_intersect.set_x((bitmap_rect.width() - bitmap_intersect.width()) / 2); bitmap_intersect.set_y((bitmap_rect.height() - bitmap_intersect.height()) / 2); @@ -135,34 +135,34 @@ void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const // https://drafts.csswg.org/css-images/#the-object-position auto const& object_position = computed_values().object_position(); - auto offset_x = 0; + auto offset_x = CSSPixels::from_raw(0); if (object_position.edge_x == CSS::PositionEdge::Left) { - offset_x = object_position.offset_x.to_px(layout_node(), residual_horizontal).to_int(); + offset_x = object_position.offset_x.to_px(layout_node(), residual_horizontal); bitmap_intersect.set_x(0); } else if (object_position.edge_x == CSS::PositionEdge::Right) { - offset_x = residual_horizontal.to_int() - object_position.offset_x.to_px(layout_node(), residual_horizontal).to_int(); + offset_x = residual_horizontal - object_position.offset_x.to_px(layout_node(), residual_horizontal); } - if (image_int_rect.width() < scaled_bitmap_width) + if (image_rect.width() < scaled_bitmap_width) bitmap_intersect.set_x(-(offset_x / scale_x)); - auto offset_y = 0; + auto offset_y = CSSPixels::from_raw(0); if (object_position.edge_y == CSS::PositionEdge::Top) { - offset_y = object_position.offset_y.to_px(layout_node(), residual_vertical).to_int(); + offset_y = object_position.offset_y.to_px(layout_node(), residual_vertical); bitmap_intersect.set_y(0); } else if (object_position.edge_y == CSS::PositionEdge::Bottom) { - offset_y = residual_vertical.to_int() - object_position.offset_y.to_px(layout_node(), residual_vertical).to_int(); + offset_y = residual_vertical - object_position.offset_y.to_px(layout_node(), residual_vertical); } - if (image_int_rect.height() < scaled_bitmap_height) + if (image_rect.height() < scaled_bitmap_height) bitmap_intersect.set_y(-(offset_y / scale_y)); Gfx::IntRect draw_rect = { - image_int_rect.x() + offset_x, - image_int_rect.y() + offset_y, - (int)scaled_bitmap_width, - (int)scaled_bitmap_height + image_int_rect_device_pixels.x() + context.rounded_device_pixels(offset_x).value(), + image_int_rect_device_pixels.y() + context.rounded_device_pixels(offset_y).value(), + context.rounded_device_pixels(scaled_bitmap_width).value(), + context.rounded_device_pixels(scaled_bitmap_height).value() }; - context.display_list_recorder().draw_scaled_immutable_bitmap(draw_rect.intersected(image_int_rect), *bitmap, bitmap_rect.intersected(bitmap_intersect), scaling_mode); + context.display_list_recorder().draw_scaled_immutable_bitmap(draw_rect.intersected(image_int_rect_device_pixels), *bitmap, bitmap_rect.intersected(bitmap_intersect), scaling_mode); } } } diff --git a/Tests/LibWeb/Ref/expected/svg-image-positioning-ref.html b/Tests/LibWeb/Ref/expected/svg-image-positioning-ref.html index 7339cdea3e5..bae6180d723 100644 --- a/Tests/LibWeb/Ref/expected/svg-image-positioning-ref.html +++ b/Tests/LibWeb/Ref/expected/svg-image-positioning-ref.html @@ -23,7 +23,7 @@ - + diff --git a/Tests/LibWeb/Screenshot/images/object-fit-position.png b/Tests/LibWeb/Screenshot/images/object-fit-position.png index 304a59d9d37..77e5ca692c6 100644 Binary files a/Tests/LibWeb/Screenshot/images/object-fit-position.png and b/Tests/LibWeb/Screenshot/images/object-fit-position.png differ