From fdcb1ddf1863ca732b6e4ef738d15f04eb2acfe0 Mon Sep 17 00:00:00 2001 From: Joe Vilches Date: Tue, 17 Oct 2023 13:24:19 -0700 Subject: [PATCH] Fix issue where paddingStart and paddingEnd were swapped with row reverse (#1426) Summary: X-link: https://github.com/facebook/react-native/pull/41023 Pull Request resolved: https://github.com/facebook/yoga/pull/1426 Just like D50140503 where marginStart and marginEnd were not working with row reverse, paddingStart and paddingEnd are not working either with row reverse either. The solution is similar - we were checking the flex item layout starting/ending edges and not the general layout starting/ending edges. This change makes it so that we look at the proper edge according to what direction is set. One caveat is that in the case of padding (and also border) there is a callsite that actually wants to get the flex item layout's leading/trailing padding and not the one dictated by direction. So, I made a new function to accommodate this and just swapped that callsite out. Reviewed By: NickGerleman Differential Revision: D50348995 fbshipit-source-id: 50c7bd4e1567bbd86ff603640d600d93c7c76d4c --- yoga/algorithm/CalculateLayout.cpp | 12 ++++--- yoga/node/Node.cpp | 51 +++++++++++++++++++++++++----- yoga/node/Node.h | 18 +++++++++-- 3 files changed, 67 insertions(+), 14 deletions(-) diff --git a/yoga/algorithm/CalculateLayout.cpp b/yoga/algorithm/CalculateLayout.cpp index 2e7bc88e2f..570070d047 100644 --- a/yoga/algorithm/CalculateLayout.cpp +++ b/yoga/algorithm/CalculateLayout.cpp @@ -1535,13 +1535,17 @@ static void calculateLayoutImpl( node->getInlineEndBorder(flexColumnDirection, direction), YGEdgeBottom); node->setLayoutPadding( - node->getFlexStartPadding(flexRowDirection, ownerWidth), startEdge); + node->getInlineStartPadding(flexRowDirection, direction, ownerWidth), + startEdge); node->setLayoutPadding( - node->getFlexEndPadding(flexRowDirection, ownerWidth), endEdge); + node->getInlineEndPadding(flexRowDirection, direction, ownerWidth), + endEdge); node->setLayoutPadding( - node->getFlexStartPadding(flexColumnDirection, ownerWidth), YGEdgeTop); + node->getInlineStartPadding(flexColumnDirection, direction, ownerWidth), + YGEdgeTop); node->setLayoutPadding( - node->getFlexEndPadding(flexColumnDirection, ownerWidth), YGEdgeBottom); + node->getInlineEndPadding(flexColumnDirection, direction, ownerWidth), + YGEdgeBottom); if (node->hasMeasureFunc()) { measureNodeWithMeasureFunc( diff --git a/yoga/node/Node.cpp b/yoga/node/Node.cpp index 146deb77d6..3725f8aaf3 100644 --- a/yoga/node/Node.cpp +++ b/yoga/node/Node.cpp @@ -197,18 +197,52 @@ float Node::getFlexEndBorder(FlexDirection axis, Direction direction) const { return maxOrDefined(trailingBorder.value, 0.0f); } -float Node::getFlexStartPadding(FlexDirection axis, float widthSize) const { +float Node::getInlineStartPadding( + FlexDirection axis, + Direction direction, + float widthSize) const { + const YGEdge startEdge = getInlineStartEdgeUsingErrata(axis, direction); + auto leadingPadding = isRow(axis) + ? computeEdgeValueForRow(style_.padding(), YGEdgeStart, startEdge) + : computeEdgeValueForColumn(style_.padding(), startEdge); + + return maxOrDefined(resolveValue(leadingPadding, widthSize).unwrap(), 0.0f); +} + +float Node::getFlexStartPadding( + FlexDirection axis, + Direction direction, + float widthSize) const { + const YGEdge leadRelativeFlexItemEdge = + flexStartRelativeEdge(axis, direction); auto leadingPadding = isRow(axis) ? computeEdgeValueForRow( - style_.padding(), YGEdgeStart, flexStartEdge(axis)) + style_.padding(), leadRelativeFlexItemEdge, flexStartEdge(axis)) : computeEdgeValueForColumn(style_.padding(), flexStartEdge(axis)); return maxOrDefined(resolveValue(leadingPadding, widthSize).unwrap(), 0.0f); } -float Node::getFlexEndPadding(FlexDirection axis, float widthSize) const { +float Node::getInlineEndPadding( + FlexDirection axis, + Direction direction, + float widthSize) const { + const YGEdge endEdge = getInlineEndEdgeUsingErrata(axis, direction); + auto trailingPadding = isRow(axis) + ? computeEdgeValueForRow(style_.padding(), YGEdgeEnd, endEdge) + : computeEdgeValueForColumn(style_.padding(), endEdge); + + return maxOrDefined(resolveValue(trailingPadding, widthSize).unwrap(), 0.0f); +} + +float Node::getFlexEndPadding( + FlexDirection axis, + Direction direction, + float widthSize) const { + const YGEdge trailRelativeFlexItemEdge = flexEndRelativeEdge(axis, direction); auto trailingPadding = isRow(axis) - ? computeEdgeValueForRow(style_.padding(), YGEdgeEnd, flexEndEdge(axis)) + ? computeEdgeValueForRow( + style_.padding(), trailRelativeFlexItemEdge, flexEndEdge(axis)) : computeEdgeValueForColumn(style_.padding(), flexEndEdge(axis)); return maxOrDefined(resolveValue(trailingPadding, widthSize).unwrap(), 0.0f); @@ -218,7 +252,7 @@ float Node::getInlineStartPaddingAndBorder( FlexDirection axis, Direction direction, float widthSize) const { - return getFlexStartPadding(axis, widthSize) + + return getInlineStartPadding(axis, direction, widthSize) + getInlineStartBorder(axis, direction); } @@ -226,7 +260,7 @@ float Node::getFlexStartPaddingAndBorder( FlexDirection axis, Direction direction, float widthSize) const { - return getFlexStartPadding(axis, widthSize) + + return getFlexStartPadding(axis, direction, widthSize) + getFlexStartBorder(axis, direction); } @@ -234,7 +268,7 @@ float Node::getInlineEndPaddingAndBorder( FlexDirection axis, Direction direction, float widthSize) const { - return getFlexEndPadding(axis, widthSize) + + return getInlineEndPadding(axis, direction, widthSize) + getInlineEndBorder(axis, direction); } @@ -242,7 +276,8 @@ float Node::getFlexEndPaddingAndBorder( FlexDirection axis, Direction direction, float widthSize) const { - return getFlexEndPadding(axis, widthSize) + getFlexEndBorder(axis, direction); + return getFlexEndPadding(axis, direction, widthSize) + + getFlexEndBorder(axis, direction); } float Node::getMarginForAxis(FlexDirection axis, float widthSize) const { diff --git a/yoga/node/Node.h b/yoga/node/Node.h index 30988ceece..ade4f03e29 100644 --- a/yoga/node/Node.h +++ b/yoga/node/Node.h @@ -216,8 +216,22 @@ class YG_EXPORT Node : public ::YGNode { const; float getInlineEndBorder(FlexDirection flexDirection, Direction direction) const; - float getFlexStartPadding(FlexDirection axis, float widthSize) const; - float getFlexEndPadding(FlexDirection axis, float widthSize) const; + float getFlexStartPadding( + FlexDirection axis, + Direction direction, + float widthSize) const; + float getInlineStartPadding( + FlexDirection axis, + Direction direction, + float widthSize) const; + float getFlexEndPadding( + FlexDirection axis, + Direction direction, + float widthSize) const; + float getInlineEndPadding( + FlexDirection axis, + Direction direction, + float widthSize) const; float getFlexStartPaddingAndBorder( FlexDirection axis, Direction direction,