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

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

View File

@@ -157,18 +157,41 @@ float Node::getInlineEndMargin(
return resolveValue(trailingMargin, widthSize).unwrapOrDefault(0.0f);
}
float Node::getFlexStartBorder(FlexDirection axis) const {
float Node::getInlineStartBorder(FlexDirection axis, Direction direction)
const {
const YGEdge startEdge = getInlineStartEdgeUsingErrata(axis, direction);
YGValue leadingBorder = isRow(axis)
? computeEdgeValueForRow(style_.border(), YGEdgeStart, startEdge)
: computeEdgeValueForColumn(style_.border(), startEdge);
return maxOrDefined(leadingBorder.value, 0.0f);
}
float Node::getFlexStartBorder(FlexDirection axis, Direction direction) const {
const YGEdge leadRelativeFlexItemEdge =
flexStartRelativeEdge(axis, direction);
YGValue leadingBorder = isRow(axis)
? computeEdgeValueForRow(
style_.border(), YGEdgeStart, flexStartEdge(axis))
style_.border(), leadRelativeFlexItemEdge, flexStartEdge(axis))
: computeEdgeValueForColumn(style_.border(), flexStartEdge(axis));
return maxOrDefined(leadingBorder.value, 0.0f);
}
float Node::getFlexEndBorder(FlexDirection axis) const {
float Node::getInlineEndBorder(FlexDirection axis, Direction direction) const {
const YGEdge endEdge = getInlineEndEdgeUsingErrata(axis, direction);
YGValue trailingBorder = isRow(axis)
? computeEdgeValueForRow(style_.border(), YGEdgeEnd, flexEndEdge(axis))
? computeEdgeValueForRow(style_.border(), YGEdgeEnd, endEdge)
: computeEdgeValueForColumn(style_.border(), endEdge);
return maxOrDefined(trailingBorder.value, 0.0f);
}
float Node::getFlexEndBorder(FlexDirection axis, Direction direction) const {
const YGEdge trailRelativeFlexItemEdge = flexEndRelativeEdge(axis, direction);
YGValue trailingBorder = isRow(axis)
? computeEdgeValueForRow(
style_.border(), trailRelativeFlexItemEdge, flexEndEdge(axis))
: computeEdgeValueForColumn(style_.border(), flexEndEdge(axis));
return maxOrDefined(trailingBorder.value, 0.0f);
@@ -191,14 +214,35 @@ float Node::getFlexEndPadding(FlexDirection axis, float widthSize) const {
return maxOrDefined(resolveValue(trailingPadding, widthSize).unwrap(), 0.0f);
}
float Node::getFlexStartPaddingAndBorder(FlexDirection axis, float widthSize)
const {
return getFlexStartPadding(axis, widthSize) + getFlexStartBorder(axis);
float Node::getInlineStartPaddingAndBorder(
FlexDirection axis,
Direction direction,
float widthSize) const {
return getFlexStartPadding(axis, widthSize) +
getInlineStartBorder(axis, direction);
}
float Node::getFlexEndPaddingAndBorder(FlexDirection axis, float widthSize)
const {
return getFlexEndPadding(axis, widthSize) + getFlexEndBorder(axis);
float Node::getFlexStartPaddingAndBorder(
FlexDirection axis,
Direction direction,
float widthSize) const {
return getFlexStartPadding(axis, widthSize) +
getFlexStartBorder(axis, direction);
}
float Node::getInlineEndPaddingAndBorder(
FlexDirection axis,
Direction direction,
float widthSize) const {
return getFlexEndPadding(axis, widthSize) +
getInlineEndBorder(axis, direction);
}
float Node::getFlexEndPaddingAndBorder(
FlexDirection axis,
Direction direction,
float widthSize) const {
return getFlexEndPadding(axis, widthSize) + getFlexEndBorder(axis, direction);
}
float Node::getMarginForAxis(FlexDirection axis, float widthSize) const {