1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 06:37:35 +00:00

LibWeb: Support more CSS image-rendering values

This patch adds support for "crisp-edges", "high-quality" and "smooth"
for the CSS image-rendering property.

"crisp-edges" maps to nearest-neighbor scaling for <canvas> and <img>
elements, while "high-quality" and "smooth" both use bilinear blending.
This commit is contained in:
Andreas Kling 2022-03-06 18:17:50 +01:00
parent fe52ee2f8e
commit 6d1a9672a4
7 changed files with 42 additions and 9 deletions

View file

@ -86,6 +86,7 @@
"context-menu",
"copy",
"cover",
"crisp-edges",
"crosshair",
"currentcolor",
"cursive",
@ -114,6 +115,7 @@
"groove",
"help",
"hidden",
"high-quality",
"inline",
"inline-block",
"inline-flex",
@ -187,6 +189,7 @@
"small",
"small-caps",
"smaller",
"smooth",
"solid",
"space",
"space-around",

View file

@ -765,7 +765,10 @@
"initial": "auto",
"valid-identifiers": [
"auto",
"pixelated"
"crisp-edges",
"high-quality",
"pixelated",
"smooth"
]
},
"justify-content": {

View file

@ -363,8 +363,14 @@ static CSS::ValueID to_css_value_id(CSS::ImageRendering value)
switch (value) {
case ImageRendering::Auto:
return CSS::ValueID::Auto;
case ImageRendering::CrispEdges:
return CSS::ValueID::CrispEdges;
case ImageRendering::HighQuality:
return CSS::ValueID::HighQuality;
case ImageRendering::Pixelated:
return CSS::ValueID::Pixelated;
case ImageRendering::Smooth:
return CSS::ValueID::Smooth;
}
VERIFY_NOT_REACHED();
}

View file

@ -277,8 +277,14 @@ Optional<CSS::ImageRendering> StyleProperties::image_rendering() const
switch (value.value()->to_identifier()) {
case CSS::ValueID::Auto:
return CSS::ImageRendering::Auto;
case CSS::ValueID::CrispEdges:
return CSS::ImageRendering::CrispEdges;
case CSS::ValueID::HighQuality:
return CSS::ImageRendering::HighQuality;
case CSS::ValueID::Pixelated:
return CSS::ImageRendering::Pixelated;
case CSS::ValueID::Smooth:
return CSS::ImageRendering::Smooth;
default:
return {};
}

View file

@ -22,6 +22,7 @@
#include <AK/WeakPtr.h>
#include <LibGfx/Bitmap.h>
#include <LibGfx/Color.h>
#include <LibGfx/Painter.h>
#include <LibWeb/CSS/Angle.h>
#include <LibWeb/CSS/Display.h>
#include <LibWeb/CSS/Frequency.h>
@ -146,9 +147,27 @@ enum class Float {
enum class ImageRendering {
Auto,
Pixelated
CrispEdges,
HighQuality,
Pixelated,
Smooth,
};
// FIXME: Find a better place for this helper.
inline Gfx::Painter::ScalingMode to_gfx_scaling_mode(CSS::ImageRendering css_value)
{
switch (css_value) {
case CSS::ImageRendering::Auto:
case CSS::ImageRendering::HighQuality:
case CSS::ImageRendering::Smooth:
return Gfx::Painter::ScalingMode::BilinearBlend;
case CSS::ImageRendering::CrispEdges:
case CSS::ImageRendering::Pixelated:
return Gfx::Painter::ScalingMode::NearestNeighbor;
}
VERIFY_NOT_REACHED();
}
enum class JustifyContent {
FlexStart,
FlexEnd,