Commit b1bf4957 authored by Alex Keng's avatar Alex Keng Committed by Commit Bot

Make the border widths consistent (1px) for range/meter/progress/radio/checkbox

This change updates the rendering of range/meter/checkbox so their border
widths are 1px regardless of the zoom level (same behavior progress
and radio currently have)

To prevent the borders from growing on zoom, the ThemePainterDefault are updated
for checkbox and range so the painting context is not modified when zoom level is not 1.

The zoom info are then embedded in ButtonExtraParams and SliderExtraParams
and passed to NativeThemeAura so PaintCheckbox can render border-radius correctly
and PaintSliderTrack can render track height correctly.

For meter the border-width is changed from 1px on thin.

Tests:
meter: meter-extreme-values.html
range: range-appearance-basic.html
checkbox: checkbox-appearance-basic.html

Bug: 1021319
Change-Id: Icee5d83a859556909bdf930c314d70ddd17d7784
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1910864
Commit-Queue: Alex Keng <shihken@microsoft.com>
Reviewed-by: default avatarElly Fong-Jones <ellyjones@chromium.org>
Reviewed-by: default avatarMason Freed <masonfreed@chromium.org>
Reviewed-by: default avatarKent Tamura <tkent@chromium.org>
Reviewed-by: default avatarKentaro Hara <haraken@chromium.org>
Cr-Commit-Position: refs/heads/master@{#714868}
parent 4e18d8d5
......@@ -62,6 +62,7 @@ static void GetNativeThemeExtraParams(
native_theme_extra_params->button.checked = extra_params->button.checked;
native_theme_extra_params->button.indeterminate =
extra_params->button.indeterminate;
native_theme_extra_params->button.zoom = extra_params->button.zoom;
break;
case WebThemeEngine::kPartRadio:
native_theme_extra_params->button.checked = extra_params->button.checked;
......@@ -101,6 +102,7 @@ static void GetNativeThemeExtraParams(
case WebThemeEngine::kPartSliderTrack:
native_theme_extra_params->slider.thumb_x = extra_params->slider.thumb_x;
native_theme_extra_params->slider.thumb_y = extra_params->slider.thumb_y;
native_theme_extra_params->slider.zoom = extra_params->slider.zoom;
FALLTHROUGH;
// vertical and in_drag properties are used by both slider track and
// slider thumb.
......
......@@ -117,6 +117,7 @@ class WebThemeEngine {
bool indeterminate; // Whether the button state is indeterminate.
bool has_border;
SkColor background_color;
float zoom;
};
// Extra parameters for PartTextField
......@@ -144,6 +145,7 @@ class WebThemeEngine {
bool in_drag;
int thumb_x;
int thumb_y;
float zoom;
};
// Extra parameters for PartInnerSpinButton
......
......@@ -84,7 +84,7 @@ meter::-webkit-meter-inner-element::after {
meter::-webkit-meter-bar {
background: #efefef;
border-width: 1px;
border-width: thin;
height: 50%;
border-style: solid;
border-color: rgba(118, 118, 118, 0.3);
......
......@@ -148,9 +148,11 @@ bool ThemePainterDefault::PaintCheckbox(const Node* node,
extra_params.button.indeterminate = LayoutTheme::IsIndeterminate(node);
float zoom_level = style.EffectiveZoom();
extra_params.button.zoom = zoom_level;
GraphicsContextStateSaver state_saver(paint_info.context, false);
IntRect unzoomed_rect = rect;
if (zoom_level != 1) {
if (zoom_level != 1 &&
!RuntimeEnabledFeatures::FormControlsRefreshEnabled()) {
state_saver.Save();
unzoomed_rect.SetWidth(unzoomed_rect.Width() / zoom_level);
unzoomed_rect.SetHeight(unzoomed_rect.Height() / zoom_level);
......@@ -331,9 +333,11 @@ bool ThemePainterDefault::PaintSliderTrack(const LayoutObject& o,
PaintSliderTicks(o, i, rect);
float zoom_level = o.StyleRef().EffectiveZoom();
extra_params.slider.zoom = zoom_level;
GraphicsContextStateSaver state_saver(i.context, false);
IntRect unzoomed_rect = rect;
if (zoom_level != 1) {
if (zoom_level != 1 &&
!RuntimeEnabledFeatures::FormControlsRefreshEnabled()) {
state_saver.Save();
unzoomed_rect.SetWidth(unzoomed_rect.Width() / zoom_level);
unzoomed_rect.SetHeight(unzoomed_rect.Height() / zoom_level);
......@@ -354,8 +358,13 @@ bool ThemePainterDefault::PaintSliderTrack(const LayoutObject& o,
LayoutBox* thumb = thumb_element ? thumb_element->GetLayoutBox() : nullptr;
if (thumb) {
IntRect thumb_rect = PixelSnappedIntRect(thumb->FrameRect());
extra_params.slider.thumb_x = thumb_rect.X() / zoom_level;
extra_params.slider.thumb_y = thumb_rect.Y() / zoom_level;
if (RuntimeEnabledFeatures::FormControlsRefreshEnabled()) {
extra_params.slider.thumb_x = thumb_rect.X();
extra_params.slider.thumb_y = thumb_rect.Y();
} else {
extra_params.slider.thumb_x = thumb_rect.X() / zoom_level;
extra_params.slider.thumb_y = thumb_rect.Y() / zoom_level;
}
}
}
......@@ -376,9 +385,11 @@ bool ThemePainterDefault::PaintSliderThumb(const Node* node,
extra_params.slider.in_drag = LayoutTheme::IsPressed(node);
float zoom_level = style.EffectiveZoom();
extra_params.slider.zoom = zoom_level;
GraphicsContextStateSaver state_saver(paint_info.context, false);
IntRect unzoomed_rect = rect;
if (zoom_level != 1) {
if (zoom_level != 1 &&
!RuntimeEnabledFeatures::FormControlsRefreshEnabled()) {
state_saver.Save();
unzoomed_rect.SetWidth(unzoomed_rect.Width() / zoom_level);
unzoomed_rect.SetHeight(unzoomed_rect.Height() / zoom_level);
......
......@@ -132,6 +132,7 @@ class NATIVE_THEME_EXPORT NativeTheme {
bool has_border;
int classic_state; // Used on Windows when uxtheme is not available.
SkColor background_color;
float zoom;
};
struct FrameTopAreaExtraParams {
......@@ -231,6 +232,7 @@ class NATIVE_THEME_EXPORT NativeTheme {
bool in_drag;
int thumb_x;
int thumb_y;
float zoom;
};
struct TextFieldExtraParams {
......
......@@ -501,9 +501,10 @@ void NativeThemeAura::PaintCheckbox(cc::PaintCanvas* canvas,
color_scheme);
}
const float border_radius =
SkIntToScalar(kCheckboxBorderRadius) * button.zoom;
SkRect skrect = PaintCheckboxRadioCommon(canvas, state, rect, button, true,
SkIntToScalar(kCheckboxBorderRadius),
color_scheme);
border_radius, color_scheme);
if (!skrect.isEmpty()) {
cc::PaintFlags flags;
......@@ -516,14 +517,12 @@ void NativeThemeAura::PaintCheckbox(cc::PaintCanvas* canvas,
skrect.makeInset(skrect.width() * kIndeterminateInsetWidthRatio,
skrect.height() * kIndeterminateInsetHeightRatio);
flags.setStyle(cc::PaintFlags::kFill_Style);
canvas->drawRoundRect(indeterminate, SkIntToScalar(kCheckboxBorderRadius),
SkIntToScalar(kCheckboxBorderRadius), flags);
canvas->drawRoundRect(indeterminate, border_radius, border_radius, flags);
} else if (button.checked) {
// Draw the accent background.
flags.setStyle(cc::PaintFlags::kFill_Style);
flags.setColor(ControlsAccentColorForState(state, color_scheme));
canvas->drawRoundRect(skrect, kCheckboxBorderRadius,
kCheckboxBorderRadius, flags);
canvas->drawRoundRect(skrect, border_radius, border_radius, flags);
// Draw the checkmark.
SkPath check;
......@@ -765,13 +764,14 @@ void NativeThemeAura::PaintSliderTrack(cc::PaintCanvas* canvas,
cc::PaintFlags flags;
flags.setAntiAlias(true);
flags.setColor(ControlsFillColorForState(state, color_scheme));
SkRect track_rect = AlignSliderTrack(rect, slider, false, kSliderTrackHeight);
const float track_height = kSliderTrackHeight * slider.zoom;
SkRect track_rect = AlignSliderTrack(rect, slider, false, track_height);
canvas->drawRoundRect(track_rect, kSliderTrackBorderRadius,
kSliderTrackBorderRadius, flags);
// Paint the value slider track.
flags.setColor(ControlsAccentColorForState(state, color_scheme));
SkRect value_rect = AlignSliderTrack(rect, slider, true, kSliderTrackHeight);
SkRect value_rect = AlignSliderTrack(rect, slider, true, track_height);
canvas->drawRoundRect(value_rect, kSliderTrackBorderRadius,
kSliderTrackBorderRadius, flags);
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment