DaddyFrosty/yoga
1
0
Fork 0
Code Issues 96 Pull Requests 31 Actions Packages Projects Releases 33 Wiki Activity

Fix issue where borderStart and borderEnd were swapped with row reverse (#1425)

Browse Source 
Summary:
X-link: https://github.com/facebook/react-native/pull/41022

Pull Request resolved: https://github.com/facebook/yoga/pull/1425

Just like D50140503 where marginStart and marginEnd were not working with row reverse, borderStart and borderEnd 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 border (and also padding) there is a callsite that actually wants to get the flex item layout's leading/trailing border 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: D50348085

fbshipit-source-id: eca2702c1753dbebb503034e2f0732684ad6c56e
This commit is contained in:
Joe Vilches
2023-10-17 20:30:16 -07:00
committed by Facebook GitHub Bot
parent e17005960f
commit b52d6ce7f2
5 changed files with 137 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
yoga/algorithm/BoundAxis.h
View File

@@ -21,8 +21,10 @@ inline float paddingAndBorderForAxis(
const yoga::Node* const node,
const FlexDirection axis,
const float widthSize) {
return node->getFlexStartPaddingAndBorder(axis, widthSize) +
node->getFlexEndPaddingAndBorder(axis, widthSize);
// The total padding/border for a given axis does not depend on the direction
// so hardcoding LTR here to avoid piping direction to this function
return node->getInlineStartPaddingAndBorder(axis, Direction::LTR, widthSize) +
node->getInlineEndPaddingAndBorder(axis, Direction::LTR, widthSize);
}
inline FloatOptional boundAxisWithinMinAndMax(

49
yoga/algorithm/CalculateLayout.cpp
View File

@@ -346,8 +346,8 @@ static void layoutAbsoluteChild(
if (child->isFlexStartPositionDefined(FlexDirection::Row) &&
child->isFlexEndPositionDefined(FlexDirection::Row)) {
childWidth = node->getLayout().measuredDimension(Dimension::Width) -
(node->getFlexStartBorder(FlexDirection::Row) +
node->getFlexEndBorder(FlexDirection::Row)) -
(node->getInlineStartBorder(FlexDirection::Row, direction) +
node->getInlineEndBorder(FlexDirection::Row, direction)) -
(child->getFlexStartPosition(FlexDirection::Row, width) +
child->getFlexEndPosition(FlexDirection::Row, width));
childWidth =
@@ -366,8 +366,8 @@ static void layoutAbsoluteChild(
if (child->isFlexStartPositionDefined(FlexDirection::Column) &&
child->isFlexEndPositionDefined(FlexDirection::Column)) {
childHeight = node->getLayout().measuredDimension(Dimension::Height) -
(node->getFlexStartBorder(FlexDirection::Column) +
node->getFlexEndBorder(FlexDirection::Column)) -
(node->getInlineStartBorder(FlexDirection::Column, direction) +
node->getInlineEndBorder(FlexDirection::Column, direction)) -
(child->getFlexStartPosition(FlexDirection::Column, height) +
child->getFlexEndPosition(FlexDirection::Column, height));
childHeight =
@@ -451,7 +451,7 @@ static void layoutAbsoluteChild(
child->setLayoutPosition(
node->getLayout().measuredDimension(dimension(mainAxis)) -
child->getLayout().measuredDimension(dimension(mainAxis)) -
node->getFlexEndBorder(mainAxis) -
node->getInlineEndBorder(mainAxis, direction) -
child->getInlineEndMargin(
mainAxis, direction, isMainAxisRow ? width : height) -
child->getFlexEndPosition(mainAxis, isMainAxisRow ? width : height),
@@ -479,7 +479,7 @@ static void layoutAbsoluteChild(
child->getFlexStartPosition(
mainAxis,
node->getLayout().measuredDimension(dimension(mainAxis))) +
node->getFlexStartBorder(mainAxis) +
node->getInlineStartBorder(mainAxis, direction) +
child->getInlineStartMargin(
mainAxis,
direction,
@@ -492,7 +492,7 @@ static void layoutAbsoluteChild(
child->setLayoutPosition(
node->getLayout().measuredDimension(dimension(crossAxis)) -
child->getLayout().measuredDimension(dimension(crossAxis)) -
node->getFlexEndBorder(crossAxis) -
node->getInlineEndBorder(crossAxis, direction) -
child->getInlineEndMargin(
crossAxis, direction, isMainAxisRow ? height : width) -
child->getFlexEndPosition(
@@ -523,7 +523,7 @@ static void layoutAbsoluteChild(
child->getFlexStartPosition(
crossAxis,
node->getLayout().measuredDimension(dimension(crossAxis))) +
node->getFlexStartBorder(crossAxis) +
node->getInlineStartBorder(crossAxis, direction) +
child->getInlineStartMargin(
crossAxis,
direction,
@@ -1199,10 +1199,16 @@ static void justifyMainAxis(
const float availableInnerWidth,
const bool performLayout) {
const auto& style = node->getStyle();
const float leadingPaddingAndBorderMain =
node->getFlexStartPaddingAndBorder(mainAxis, ownerWidth);
node->hasErrata(Errata::StartingEndingEdgeFromFlexDirection)
? node->getInlineStartPaddingAndBorder(mainAxis, direction, ownerWidth)
: node->getFlexStartPaddingAndBorder(mainAxis, direction, ownerWidth);
const float trailingPaddingAndBorderMain =
node->getFlexEndPaddingAndBorder(mainAxis, ownerWidth);
node->hasErrata(Errata::StartingEndingEdgeFromFlexDirection)
? node->getInlineEndPaddingAndBorder(mainAxis, direction, ownerWidth)
: node->getFlexEndPaddingAndBorder(mainAxis, direction, ownerWidth);
const float gap = node->getGapForAxis(mainAxis);
// If we are using "at most" rules in the main axis, make sure that
// remainingFreeSpace is 0 when min main dimension is not given
@@ -1306,7 +1312,7 @@ static void justifyMainAxis(
// margin/border).
child->setLayoutPosition(
child->getFlexStartPosition(mainAxis, availableInnerMainDim) +
node->getFlexStartBorder(mainAxis) +
node->getInlineStartBorder(mainAxis, direction) +
child->getInlineStartMargin(
mainAxis, direction, availableInnerWidth),
flexStartEdge(mainAxis));
@@ -1380,7 +1386,8 @@ static void justifyMainAxis(
} else if (performLayout) {
child->setLayoutPosition(
childLayout.position[flexStartEdge(mainAxis)] +
node->getFlexStartBorder(mainAxis) + leadingMainDim,
node->getInlineStartBorder(mainAxis, direction) +
leadingMainDim,
flexStartEdge(mainAxis));
}
}
@@ -1518,12 +1525,14 @@ static void calculateLayoutImpl(
const float marginAxisRow = marginRowLeading + marginRowTrailing;
const float marginAxisColumn = marginColumnLeading + marginColumnTrailing;
node->setLayoutBorder(node->getFlexStartBorder(flexRowDirection), startEdge);
node->setLayoutBorder(node->getFlexEndBorder(flexRowDirection), endEdge);
node->setLayoutBorder(
node->getFlexStartBorder(flexColumnDirection), YGEdgeTop);
node->getInlineStartBorder(flexRowDirection, direction), startEdge);
node->setLayoutBorder(
node->getFlexEndBorder(flexColumnDirection), YGEdgeBottom);
node->getInlineEndBorder(flexRowDirection, direction), endEdge);
node->setLayoutBorder(
node->getInlineStartBorder(flexColumnDirection, direction), YGEdgeTop);
node->setLayoutBorder(
node->getInlineEndBorder(flexColumnDirection, direction), YGEdgeBottom);
node->setLayoutPadding(
node->getFlexStartPadding(flexRowDirection, ownerWidth), startEdge);
@@ -1594,9 +1603,9 @@ static void calculateLayoutImpl(
const float paddingAndBorderAxisMain =
paddingAndBorderForAxis(node, mainAxis, ownerWidth);
const float leadingPaddingAndBorderCross =
node->getFlexStartPaddingAndBorder(crossAxis, ownerWidth);
node->getInlineStartPaddingAndBorder(crossAxis, direction, ownerWidth);
const float trailingPaddingAndBorderCross =
node->getFlexEndPaddingAndBorder(crossAxis, ownerWidth);
node->getInlineEndPaddingAndBorder(crossAxis, direction, ownerWidth);
const float paddingAndBorderAxisCross =
leadingPaddingAndBorderCross + trailingPaddingAndBorderCross;
@@ -1855,7 +1864,7 @@ static void calculateLayoutImpl(
if (isChildLeadingPosDefined) {
child->setLayoutPosition(
child->getFlexStartPosition(crossAxis, availableInnerCrossDim) +
node->getFlexStartBorder(crossAxis) +
node->getInlineStartBorder(crossAxis, direction) +
child->getInlineStartMargin(
crossAxis, direction, availableInnerWidth),
flexStartEdge(crossAxis));
@@ -1866,7 +1875,7 @@ static void calculateLayoutImpl(
yoga::isUndefined(
child->getLayout().position[flexStartEdge(crossAxis)])) {
child->setLayoutPosition(
node->getFlexStartBorder(crossAxis) +
node->getInlineStartBorder(crossAxis, direction) +
child->getInlineStartMargin(
crossAxis, direction, availableInnerWidth),
flexStartEdge(crossAxis));

26
yoga/algorithm/FlexDirection.h
View File

@@ -97,6 +97,32 @@ inline YGEdge inlineEndEdge(
return YGEdgeBottom;
}
/**
* The physical edges that YGEdgeStart and YGEdgeEnd correspond to (e.g.
* left/right) are soley dependent on the direction. However, there are cases
* where we want the flex start/end edge (i.e. which edge is the start/end
* for laying out flex items), which can be distinct from the corresponding
* inline edge. In these cases we need to know which "relative edge"
* (YGEdgeStart/YGEdgeEnd) corresponds to the said flex start/end edge as these
* relative edges can be used instead of physical ones when defining certain
* attributes like border or padding.
*/
inline YGEdge flexStartRelativeEdge(
FlexDirection flexDirection,
Direction direction) {
const YGEdge leadLayoutEdge = inlineStartEdge(flexDirection, direction);
const YGEdge leadFlexItemEdge = flexStartEdge(flexDirection);
return leadLayoutEdge == leadFlexItemEdge ? YGEdgeStart : YGEdgeEnd;
}
inline YGEdge flexEndRelativeEdge(
FlexDirection flexDirection,
Direction direction) {
const YGEdge trailLayoutEdge = inlineEndEdge(flexDirection, direction);
const YGEdge trailFlexItemEdge = flexEndEdge(flexDirection);
return trailLayoutEdge == trailFlexItemEdge ? YGEdgeEnd : YGEdgeStart;
}
inline Dimension dimension(const FlexDirection flexDirection) {
switch (flexDirection) {
case FlexDirection::Column: