From 4203dcebc50867b1290acc5a260fdbfbe00ef3a5 Mon Sep 17 00:00:00 2001 From: Joe Vilches Date: Wed, 17 Jul 2024 10:41:32 -0700 Subject: [PATCH] Rename "spreadRadius" -> "spreadDistance" (#45481) Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/45481 We are going with this name as it is more commonly used in the spec and makes more sense since there are no circles involved with spread Changelog: [Internal] Reviewed By: NickGerleman Differential Revision: D59819180 --- .../React/Fabric/Utils/RCTBoxShadow.mm | 46 +++++++++---------- .../renderer/components/view/conversions.h | 10 ++-- .../react/renderer/graphics/BoxShadow.h | 2 +- 3 files changed, 29 insertions(+), 29 deletions(-) diff --git a/packages/react-native/React/Fabric/Utils/RCTBoxShadow.mm b/packages/react-native/React/Fabric/Utils/RCTBoxShadow.mm index eb26396476d5..322596c6a27e 100644 --- a/packages/react-native/React/Fabric/Utils/RCTBoxShadow.mm +++ b/packages/react-native/React/Fabric/Utils/RCTBoxShadow.mm @@ -14,11 +14,11 @@ using namespace facebook::react; // See https://drafts.csswg.org/css-backgrounds/#shadow-shape -static CGFloat adjustedCornerRadius(CGFloat cornerRadius, CGFloat spreadRadius) +static CGFloat adjustedCornerRadius(CGFloat cornerRadius, CGFloat spreadDistance) { - CGFloat adjustment = spreadRadius; - if (cornerRadius < abs(spreadRadius)) { - const CGFloat r = cornerRadius / (CGFloat)abs(spreadRadius); + CGFloat adjustment = spreadDistance; + if (cornerRadius < abs(spreadDistance)) { + const CGFloat r = cornerRadius / (CGFloat)abs(spreadDistance); const CGFloat p = (CGFloat)pow(r - 1.0, 3.0); adjustment *= 1.0 + p; } @@ -26,13 +26,13 @@ static CGFloat adjustedCornerRadius(CGFloat cornerRadius, CGFloat spreadRadius) return fmax(cornerRadius + adjustment, 0); } -static RCTCornerRadii cornerRadiiForBoxShadow(RCTCornerRadii cornerRadii, CGFloat spreadRadius) +static RCTCornerRadii cornerRadiiForBoxShadow(RCTCornerRadii cornerRadii, CGFloat spreadDistance) { return { - adjustedCornerRadius(cornerRadii.topLeft, spreadRadius), - adjustedCornerRadius(cornerRadii.topRight, spreadRadius), - adjustedCornerRadius(cornerRadii.bottomLeft, spreadRadius), - adjustedCornerRadius(cornerRadii.bottomRight, spreadRadius)}; + adjustedCornerRadius(cornerRadii.topLeft, spreadDistance), + adjustedCornerRadius(cornerRadii.topRight, spreadDistance), + adjustedCornerRadius(cornerRadii.bottomLeft, spreadDistance), + adjustedCornerRadius(cornerRadii.bottomRight, spreadDistance)}; } // Returns the smallest CGRect that will contain all shadows and the layer itself. @@ -46,13 +46,13 @@ CGRect RCTGetBoundingRect(std::vector boxShadows, CGSize layerSize) CGFloat largestY = layerSize.height; for (const auto &boxShadow : boxShadows) { if (!boxShadow.inset) { - CGFloat negativeXExtent = boxShadow.offsetX - boxShadow.spreadRadius - boxShadow.blurRadius; + CGFloat negativeXExtent = boxShadow.offsetX - boxShadow.spreadDistance - boxShadow.blurRadius; smallestX = MIN(smallestX, negativeXExtent); - CGFloat negativeYExtent = boxShadow.offsetY - boxShadow.spreadRadius - boxShadow.blurRadius; + CGFloat negativeYExtent = boxShadow.offsetY - boxShadow.spreadDistance - boxShadow.blurRadius; smallestY = MIN(smallestY, negativeYExtent); - CGFloat positiveXExtent = boxShadow.offsetX + boxShadow.spreadRadius + boxShadow.blurRadius + layerSize.width; + CGFloat positiveXExtent = boxShadow.offsetX + boxShadow.spreadDistance + boxShadow.blurRadius + layerSize.width; largestX = MAX(largestX, positiveXExtent); - CGFloat positiveYExtent = boxShadow.offsetY + boxShadow.spreadRadius + boxShadow.blurRadius + layerSize.height; + CGFloat positiveYExtent = boxShadow.offsetY + boxShadow.spreadDistance + boxShadow.blurRadius + layerSize.height; largestY = MAX(largestY, positiveYExtent); } } @@ -102,16 +102,16 @@ static void renderOutsetShadows( CGFloat offsetX = it->offsetX; CGFloat offsetY = it->offsetY; CGFloat blurRadius = it->blurRadius; - CGFloat spreadRadius = it->spreadRadius; + CGFloat spreadDistance = it->spreadDistance; CGColorRef color = RCTUIColorFromSharedColor(it->color).CGColor; // First, define the shadow rect. This is the rect that will be filled // and _cast_ the shadow. As a result, the size does not incorporate // the blur radius since this rect is not the shadow itself. const RCTCornerInsets shadowRectCornerInsets = - RCTGetCornerInsets(cornerRadiiForBoxShadow(cornerRadii, spreadRadius), UIEdgeInsetsZero); + RCTGetCornerInsets(cornerRadiiForBoxShadow(cornerRadii, spreadDistance), UIEdgeInsetsZero); CGSize shadowRectSize = - CGSizeMake(layer.bounds.size.width + 2 * spreadRadius, layer.bounds.size.height + 2 * spreadRadius); + CGSizeMake(layer.bounds.size.width + 2 * spreadDistance, layer.bounds.size.height + 2 * spreadDistance); // Ensure this is drawn offscreen and will not show in the image CGRect shadowRect = CGRectMake(-shadowRectSize.width, 0, shadowRectSize.width, shadowRectSize.height); CGPathRef shadowRectPath = RCTPathCreateWithRoundedRect(shadowRect, shadowRectCornerInsets, nil); @@ -125,8 +125,8 @@ static void renderOutsetShadows( CGContextSetShadowWithColor( context, CGSizeMake( - offsetX - boundingRect.origin.x - spreadRadius - shadowRect.origin.x, - offsetY - boundingRect.origin.y - spreadRadius), + offsetX - boundingRect.origin.x - spreadDistance - shadowRect.origin.x, + offsetY - boundingRect.origin.y - spreadDistance), blurRadius, color); @@ -208,7 +208,7 @@ static void renderInsetShadows( CGFloat offsetX = it->offsetX; CGFloat offsetY = it->offsetY; CGFloat blurRadius = it->blurRadius; - CGFloat spreadRadius = it->spreadRadius; + CGFloat spreadDistance = it->spreadDistance; CGColorRef color = RCTUIColorFromSharedColor(it->color).CGColor; // Second, create the two offscreen rects we will use to create the correct @@ -221,17 +221,17 @@ static void renderInsetShadows( CGSize shadowRectSize = CGSizeMake(layer.bounds.size.width + 2 * blurRadius, layer.bounds.size.height + 2 * blurRadius); CGSize clearRegionSize = - CGSizeMake(layer.bounds.size.width - 2 * spreadRadius, layer.bounds.size.height - 2 * spreadRadius); + CGSizeMake(layer.bounds.size.width - 2 * spreadDistance, layer.bounds.size.height - 2 * spreadDistance); CGRect shadowRect = CGRectMake( - -fmax(shadowRectSize.width, clearRegionSize.width + offsetX + blurRadius + spreadRadius), + -fmax(shadowRectSize.width, clearRegionSize.width + offsetX + blurRadius + spreadDistance), 0, shadowRectSize.width, shadowRectSize.height); CGContextAddRect(context, shadowRect); CGRect clearRegionRect = CGRectMake( - shadowRect.origin.x + offsetX + blurRadius + spreadRadius, - shadowRect.origin.y + offsetY + blurRadius + spreadRadius, + shadowRect.origin.x + offsetX + blurRadius + spreadDistance, + shadowRect.origin.y + offsetY + blurRadius + spreadDistance, clearRegionSize.width, clearRegionSize.height); CGContextAddRect(context, clearRegionRect); diff --git a/packages/react-native/ReactCommon/react/renderer/components/view/conversions.h b/packages/react-native/ReactCommon/react/renderer/components/view/conversions.h index aa455d59bacf..1fd24de76c0e 100644 --- a/packages/react-native/ReactCommon/react/renderer/components/view/conversions.h +++ b/packages/react-native/ReactCommon/react/renderer/components/view/conversions.h @@ -994,14 +994,14 @@ inline void fromRawValue( boxShadow.blurRadius = (Float)blurRadius->second; } - auto spreadRadius = rawBoxShadowMap.find("spreadRadius"); - if (spreadRadius != rawBoxShadowMap.end()) { - react_native_expect(spreadRadius->second.hasType()); - if (!spreadRadius->second.hasType()) { + auto spreadDistance = rawBoxShadowMap.find("spreadDistance"); + if (spreadDistance != rawBoxShadowMap.end()) { + react_native_expect(spreadDistance->second.hasType()); + if (!spreadDistance->second.hasType()) { result = {}; return; } - boxShadow.spreadRadius = (Float)spreadRadius->second; + boxShadow.spreadDistance = (Float)spreadDistance->second; } auto inset = rawBoxShadowMap.find("inset"); diff --git a/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h b/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h index e625550e29d5..da49cf045784 100644 --- a/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h +++ b/packages/react-native/ReactCommon/react/renderer/graphics/BoxShadow.h @@ -18,7 +18,7 @@ struct BoxShadow { Float offsetX{}; Float offsetY{}; Float blurRadius{}; - Float spreadRadius{}; + Float spreadDistance{}; SharedColor color{}; bool inset{}; };