From afa0f81b7986aff7ad74af3ca55173d1448b2198 Mon Sep 17 00:00:00 2001 From: Joe Vilches Date: Mon, 4 Dec 2023 11:42:48 -0800 Subject: [PATCH] Fix issue where we were not centering absolute nodes correctly when justifying (#41690) Summary: X-link: https://github.com/facebook/yoga/pull/1489 Centering involves centering the margin box in the content box of the parent, and then getting the distance from the flex start edge of the parent to the child Reviewed By: NickGerleman Differential Revision: D51383625 --- .../yoga/yoga/algorithm/AbsoluteLayout.cpp | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/packages/react-native/ReactCommon/yoga/yoga/algorithm/AbsoluteLayout.cpp b/packages/react-native/ReactCommon/yoga/yoga/algorithm/AbsoluteLayout.cpp index 40df06d41765ea..82d0fb47565b1a 100644 --- a/packages/react-native/ReactCommon/yoga/yoga/algorithm/AbsoluteLayout.cpp +++ b/packages/react-native/ReactCommon/yoga/yoga/algorithm/AbsoluteLayout.cpp @@ -38,10 +38,21 @@ static void justifyAbsoluteChild( case Justify::Center: case Justify::SpaceAround: case Justify::SpaceEvenly: + const float parentContentBoxSize = + parent->getLayout().measuredDimension(dimension(mainAxis)) - + parent->getLayout().border(flexStartEdge(mainAxis)) - + parent->getLayout().border(flexEndEdge(mainAxis)) - + parent->getLayout().padding(flexStartEdge(mainAxis)) - + parent->getLayout().padding(flexEndEdge(mainAxis)); + const float childOuterSize = + child->getLayout().measuredDimension(dimension(mainAxis)) + + child->getMarginForAxis(mainAxis, containingBlockWidth); child->setLayoutPosition( - (parent->getLayout().measuredDimension(dimension(mainAxis)) - - child->getLayout().measuredDimension(dimension(mainAxis))) / - 2.0f, + (parentContentBoxSize - childOuterSize) / 2.0f + + parent->getLayout().border(flexStartEdge(mainAxis)) + + parent->getLayout().padding(flexStartEdge(mainAxis)) + + child->getFlexStartMargin( + mainAxis, direction, containingBlockWidth), flexStartEdge(mainAxis)); break; }