Changeset 269975 in webkit
- Timestamp:
- Nov 18, 2020 12:28:17 PM (3 years ago)
- Location:
- trunk
- Files:
-
- 11 added
- 5 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/LayoutTests/ChangeLog
r269974 r269975 1 2020-11-18 Aditya Keerthi <akeerthi@apple.com> 2 3 [iOS][FCR] Add new look for radio buttons 4 https://bugs.webkit.org/show_bug.cgi?id=219046 5 <rdar://problem/71498263> 6 7 Reviewed by Wenson Hsieh. 8 9 Added tests to verify the stylability of native radio buttons and to 10 verify that different states are painted with a different appearance. 11 12 * fast/forms/ios/form-control-refresh/radio/border-expected-mismatch.html: Added. 13 * fast/forms/ios/form-control-refresh/radio/border.html: Added. 14 * fast/forms/ios/form-control-refresh/radio/checked-appearance-expected-mismatch.html: Added. 15 * fast/forms/ios/form-control-refresh/radio/checked-appearance.html: Added. 16 * fast/forms/ios/form-control-refresh/radio/disabled-appearance-expected-mismatch.html: Added. 17 * fast/forms/ios/form-control-refresh/radio/disabled-appearance.html: Added. 18 * fast/forms/ios/form-control-refresh/radio/ignored-properties-expected.html: Added. 19 * fast/forms/ios/form-control-refresh/radio/ignored-properties.html: Added. 20 * fast/forms/ios/form-control-refresh/radio/width-height-expected-mismatch.html: Added. 21 * fast/forms/ios/form-control-refresh/radio/width-height.html: Added. 22 1 23 2020-11-18 Yusuke Suzuki <ysuzuki@apple.com> 2 24 -
trunk/Source/WebCore/ChangeLog
r269974 r269975 1 2020-11-18 Aditya Keerthi <akeerthi@apple.com> 2 3 [iOS][FCR] Add new look for radio buttons 4 https://bugs.webkit.org/show_bug.cgi?id=219046 5 <rdar://problem/71498263> 6 7 Reviewed by Wenson Hsieh. 8 9 Tests: fast/forms/ios/form-control-refresh/radio/border.html 10 fast/forms/ios/form-control-refresh/radio/checked-appearance.html 11 fast/forms/ios/form-control-refresh/radio/disabled-appearance.html 12 fast/forms/ios/form-control-refresh/radio/ignored-properties.html 13 fast/forms/ios/form-control-refresh/radio/width-height.html 14 15 * css/iOSFormControlRefresh.css: 16 (input:matches([type="checkbox"], [type="radio"])): 17 18 Use "border: initial" and "box-sizing: border-box" to match macOS, now 19 that the native radio button styles on macOS and iOS are similar. This 20 also aligns with the new iOS checkbox style. 21 22 * rendering/RenderThemeIOS.h: 23 * rendering/RenderThemeIOS.mm: 24 (WebCore::RenderThemeIOS::paintRadioDecorations): 25 26 Move away from using paintRadioDecorations to paintRadio for the new 27 design. This is necessary to avoid painting custom borders and backgrounds 28 for native checkboxes, matching macOS. Painting both a CSS background as 29 well as the native checkbox can lead to background bleeding. Customizations 30 can still be made using "-webkit-appearance: none". 31 32 (WebCore::RenderThemeIOS::paintRadio): 33 34 A new implementation for painting radio buttons to match the updated 35 design. If the button is unchecked, a single circle is painted. 36 Otherwise, an inner and outer circle are painted. 37 1 38 2020-11-18 Yusuke Suzuki <ysuzuki@apple.com> 2 39 -
trunk/Source/WebCore/css/iOSFormControlRefresh.css
r269913 r269975 25 25 #if defined(ENABLE_IOS_FORM_CONTROL_REFRESH) && ENABLE_IOS_FORM_CONTROL_REFRESH 26 26 27 input [type="checkbox"]{27 input:matches([type="checkbox"], [type="radio"]) { 28 28 border: initial; 29 29 box-sizing: border-box; -
trunk/Source/WebCore/rendering/RenderThemeIOS.h
r269913 r269975 113 113 #if ENABLE(IOS_FORM_CONTROL_REFRESH) 114 114 bool paintCheckbox(const RenderObject&, const PaintInfo&, const IntRect&) override; 115 bool paintRadio(const RenderObject&, const PaintInfo&, const IntRect&) override; 115 116 #endif 116 117 -
trunk/Source/WebCore/rendering/RenderThemeIOS.mm
r269913 r269975 474 474 bool RenderThemeIOS::paintRadioDecorations(const RenderObject& box, const PaintInfo& paintInfo, const IntRect& rect) 475 475 { 476 #if ENABLE(IOS_FORM_CONTROL_REFRESH) 477 if (box.settings().iOSFormControlRefreshEnabled()) 478 return true; 479 #endif 480 476 481 GraphicsContextStateSaver stateSaver(paintInfo.context()); 477 482 CGContextRef cgContext = paintInfo.context().platformContext(); … … 2035 2040 } 2036 2041 2042 bool RenderThemeIOS::paintRadio(const RenderObject& box, const PaintInfo& paintInfo, const IntRect& rect) 2043 { 2044 if (!box.settings().iOSFormControlRefreshEnabled()) 2045 return true; 2046 2047 auto& context = paintInfo.context(); 2048 GraphicsContextStateSaver stateSaver(context); 2049 2050 if (isChecked(box)) { 2051 context.setFillColor(controlColor); 2052 context.fillEllipse(rect); 2053 2054 // The inner circle is 6 / 14 the size of the surrounding circle, 2055 // leaving 8 / 14 around it. (8 / 14) / 2 = 2 / 7. 2056 constexpr float innerInverseRatio = 2 / 7.0f; 2057 2058 FloatRect innerCircleRect(rect); 2059 innerCircleRect.inflateX(-innerCircleRect.width() * innerInverseRatio); 2060 innerCircleRect.inflateY(-innerCircleRect.height() * innerInverseRatio); 2061 2062 context.setFillColor(Color::white); 2063 context.fillEllipse(innerCircleRect); 2064 } else { 2065 context.setFillColor(controlBackgroundColor); 2066 context.fillEllipse(rect); 2067 } 2068 2069 return false; 2070 } 2071 2037 2072 #endif // ENABLE(IOS_FORM_CONTROL_REFRESH) 2038 2073
Note: See TracChangeset
for help on using the changeset viewer.