Title: [257048] trunk/Source/WebCore
Revision
257048
Author
carlo...@webkit.org
Date
2020-02-20 02:03:21 -0800 (Thu, 20 Feb 2020)

Log Message

[WPE] Add support for rendering sliders for range elements
https://bugs.webkit.org/show_bug.cgi?id=207694

Reviewed by Adrian Perez de Castro.

* platform/wpe/RenderThemeWPE.cpp:
(WebCore::RenderThemeWPE::supportsFocusRing const):
(WebCore::RenderThemeWPE::paintSliderTrack):
(WebCore::RenderThemeWPE::adjustSliderThumbSize const):
(WebCore::RenderThemeWPE::paintSliderThumb):
* platform/wpe/RenderThemeWPE.h:

Modified Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (257047 => 257048)


--- trunk/Source/WebCore/ChangeLog	2020-02-20 09:36:45 UTC (rev 257047)
+++ trunk/Source/WebCore/ChangeLog	2020-02-20 10:03:21 UTC (rev 257048)
@@ -1,3 +1,17 @@
+2020-02-20  Carlos Garcia Campos  <cgar...@igalia.com>
+
+        [WPE] Add support for rendering sliders for range elements
+        https://bugs.webkit.org/show_bug.cgi?id=207694
+
+        Reviewed by Adrian Perez de Castro.
+
+        * platform/wpe/RenderThemeWPE.cpp:
+        (WebCore::RenderThemeWPE::supportsFocusRing const):
+        (WebCore::RenderThemeWPE::paintSliderTrack):
+        (WebCore::RenderThemeWPE::adjustSliderThumbSize const):
+        (WebCore::RenderThemeWPE::paintSliderThumb):
+        * platform/wpe/RenderThemeWPE.h:
+
 2020-02-19  Jack Lee  <shihchieh_...@apple.com>
 
         ASSERTION FAILED: roundedIntPoint(LayoutPoint(rendererMappedResult)) == result in WebCore::RenderGeometryMap::mapToContainer

Modified: trunk/Source/WebCore/platform/wpe/RenderThemeWPE.cpp (257047 => 257048)


--- trunk/Source/WebCore/platform/wpe/RenderThemeWPE.cpp	2020-02-20 09:36:45 UTC (rev 257047)
+++ trunk/Source/WebCore/platform/wpe/RenderThemeWPE.cpp	2020-02-20 10:03:21 UTC (rev 257048)
@@ -29,6 +29,7 @@
 #include "Color.h"
 #include "FloatRoundedRect.h"
 #include "GraphicsContext.h"
+#include "HTMLInputElement.h"
 #include "NotImplemented.h"
 #include "PaintInfo.h"
 #include "RenderBox.h"
@@ -58,6 +59,17 @@
 static const unsigned progressBarSize = 6;
 static const Color progressBarBorderColor = makeRGB(205, 199, 194);
 static const Color progressBarBackgroundColor = makeRGB(225, 222, 219);
+static const unsigned sliderTrackSize = 6;
+static const int sliderTrackBorderSize = 1;
+static const Color sliderTrackBorderColor = makeRGB(205, 199, 194);
+static const Color sliderTrackBackgroundColor = makeRGB(225, 222, 219);
+static const int sliderTrackFocusOffset = 2;
+static const int sliderThumbSize = 20;
+static const int sliderThumbBorderSize = 1;
+static const Color sliderThumbBorderColor = makeRGB(205, 199, 194);
+static const Color sliderThumbBackgroundColor = makeRGB(244, 242, 241);
+static const Color sliderThumbBackgroundHoveredColor = makeRGB(248, 248, 247);
+static const Color sliderThumbBackgroundDisabledColor = makeRGB(244, 242, 241);
 
 RenderTheme& RenderTheme::singleton()
 {
@@ -76,10 +88,9 @@
     case MenulistPart:
     case RadioPart:
     case CheckboxPart:
-        return true;
     case SliderHorizontalPart:
     case SliderVerticalPart:
-        return false;
+        return true;
     default:
         break;
     }
@@ -281,5 +292,117 @@
     return false;
 }
 
+bool RenderThemeWPE::paintSliderTrack(const RenderObject& renderObject, const PaintInfo& paintInfo, const IntRect& rect)
+{
+    auto& graphicsContext = paintInfo.context();
+    GraphicsContextStateSaver stateSaver(graphicsContext);
 
+    ControlPart part = renderObject.style().appearance();
+    ASSERT(part == SliderHorizontalPart || part == SliderVerticalPart);
+
+    FloatRect fieldRect = rect;
+    if (part == SliderHorizontalPart) {
+        fieldRect.move(0, rect.height() / 2 - (sliderTrackSize / 2));
+        fieldRect.setHeight(6);
+    } else {
+        fieldRect.move(rect.width() / 2 - (sliderTrackSize / 2), 0);
+        fieldRect.setWidth(6);
+    }
+
+    FloatSize corner(3, 3);
+    Path path;
+    path.addRoundedRect(fieldRect, corner);
+    fieldRect.inflate(-sliderTrackBorderSize);
+    path.addRoundedRect(fieldRect, corner);
+    graphicsContext.setFillRule(WindRule::EvenOdd);
+    graphicsContext.setFillColor(sliderTrackBorderColor);
+    graphicsContext.fillPath(path);
+    path.clear();
+
+    path.addRoundedRect(fieldRect, corner);
+    graphicsContext.setFillRule(WindRule::NonZero);
+    graphicsContext.setFillColor(sliderTrackBackgroundColor);
+    graphicsContext.fillPath(path);
+    path.clear();
+
+    fieldRect.inflate(sliderTrackBorderSize);
+    LayoutPoint thumbLocation;
+    if (is<HTMLInputElement>(renderObject.node())) {
+        auto& input = downcast<HTMLInputElement>(*renderObject.node());
+        if (auto* element = input.sliderThumbElement())
+            thumbLocation = element->renderBox()->location();
+    }
+    FloatRect rangeRect = fieldRect;
+    FloatRoundedRect::Radii corners;
+    if (part == SliderHorizontalPart) {
+        if (renderObject.style().direction() == TextDirection::RTL) {
+            rangeRect.move(thumbLocation.x(), 0);
+            rangeRect.setWidth(rangeRect.width() - thumbLocation.x());
+            corners.setTopRight(corner);
+            corners.setBottomRight(corner);
+        } else {
+            rangeRect.setWidth(thumbLocation.x());
+            corners.setTopLeft(corner);
+            corners.setBottomLeft(corner);
+        }
+    } else {
+        rangeRect.setHeight(thumbLocation.y());
+        corners.setTopLeft(corner);
+        corners.setTopRight(corner);
+    }
+
+    path.addRoundedRect(FloatRoundedRect(rangeRect, corners));
+    graphicsContext.setFillRule(WindRule::NonZero);
+    graphicsContext.setFillColor(activeSelectionBackgroundColor({ }));
+    graphicsContext.fillPath(path);
+
+    if (isFocused(renderObject))
+        ThemeWPE::paintFocus(graphicsContext, fieldRect, sliderTrackFocusOffset);
+
+    return false;
+}
+
+void RenderThemeWPE::adjustSliderThumbSize(RenderStyle& style, const Element*) const
+{
+    ControlPart part = style.appearance();
+    if (part != SliderThumbHorizontalPart && part != SliderThumbVerticalPart)
+        return;
+
+    style.setWidth(Length(sliderThumbSize, Fixed));
+    style.setHeight(Length(sliderThumbSize, Fixed));
+}
+
+bool RenderThemeWPE::paintSliderThumb(const RenderObject& renderObject, const PaintInfo& paintInfo, const IntRect& rect)
+{
+    auto& graphicsContext = paintInfo.context();
+    GraphicsContextStateSaver stateSaver(graphicsContext);
+
+    ASSERT(renderObject.style().appearance() == SliderThumbHorizontalPart || renderObject.style().appearance() == SliderThumbVerticalPart);
+
+    FloatRect fieldRect = rect;
+    Path path;
+    path.addEllipse(fieldRect);
+    fieldRect.inflate(-sliderThumbBorderSize);
+    path.addEllipse(fieldRect);
+    graphicsContext.setFillRule(WindRule::EvenOdd);
+    if (isEnabled(renderObject) && isPressed(renderObject))
+        graphicsContext.setFillColor(activeSelectionBackgroundColor({ }));
+    else
+        graphicsContext.setFillColor(sliderThumbBorderColor);
+    graphicsContext.fillPath(path);
+    path.clear();
+
+    path.addEllipse(fieldRect);
+    graphicsContext.setFillRule(WindRule::NonZero);
+    if (!isEnabled(renderObject))
+        graphicsContext.setFillColor(sliderThumbBackgroundDisabledColor);
+    else if (isHovered(renderObject))
+        graphicsContext.setFillColor(sliderThumbBackgroundHoveredColor);
+    else
+        graphicsContext.setFillColor(sliderThumbBackgroundColor);
+    graphicsContext.fillPath(path);
+
+    return false;
+}
+
 } // namespace WebCore

Modified: trunk/Source/WebCore/platform/wpe/RenderThemeWPE.h (257047 => 257048)


--- trunk/Source/WebCore/platform/wpe/RenderThemeWPE.h	2020-02-20 09:36:45 UTC (rev 257047)
+++ trunk/Source/WebCore/platform/wpe/RenderThemeWPE.h	2020-02-20 10:03:21 UTC (rev 257048)
@@ -61,6 +61,10 @@
     Seconds animationDurationForProgressBar(RenderProgress&) const override;
     IntRect progressBarRectForBounds(const RenderObject&, const IntRect&) const override;
     bool paintProgressBar(const RenderObject&, const PaintInfo&, const IntRect&) override;
+
+    bool paintSliderTrack(const RenderObject&, const PaintInfo&, const IntRect&) override;
+    void adjustSliderThumbSize(RenderStyle&, const Element*) const override;
+    bool paintSliderThumb(const RenderObject&, const PaintInfo&, const IntRect&) override;
 };
 
 } // namespace WebCore
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to