Skip to content

Commit

Permalink
Let containing blocks layout their absolute descendants, not parents (f…
Browse files Browse the repository at this point in the history
…acebook#1470)

Summary:
X-link: facebook/react-native#41488


The way we plan on implementing `position: static` is by changing how we lay out absolutely positioned nodes. Instead of letting their direct parent lay them out we are going to let their containing block handle it. This is useful because by the time the containing block gets to this step it will already know its size, which is needed to ensure that absolute nodes can get the right value with percentage units. Additionally, it means that we can "translate" the position of the absolute nodes to be relative to their parent fairly easily, instead of some second pass that would not be possible with a different design.

This change just gets the core pieces of this process going. It makes it so that containing blocks will layout out absolute descendants that they contain. We also pass in the containing block size to the owner size args for `layoutAbsoluteChild`. This new path will only happen if we have the errata turned off. If there is no positioned ancestor for a given node we just assume the root is. This is not exactly how it works on the web - there is a notion of an initial containing block - but we are not implementing that as of right now.

Reviewed By: NickGerleman

Differential Revision: D51182593
  • Loading branch information
Joe Vilches authored and facebook-github-bot committed Dec 4, 2023
1 parent a7080ea commit 7bf6e7b
Showing 1 changed file with 77 additions and 21 deletions.
98 changes: 77 additions & 21 deletions yoga/algorithm/CalculateLayout.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -531,6 +531,45 @@ static void layoutAbsoluteChild(
}
}

static void layoutAbsoluteDescendants(
yoga::Node* currentNode,
SizingMode widthSizingMode,
Direction currentNodeDirection,
LayoutData& layoutMarkerData,
uint32_t currentDepth,
uint32_t generationCount,
float containingBlockWidth,
float containingBlockHeight) {
for (auto child : currentNode->getChildren()) {
if (child->getStyle().display() == Display::None) {
continue;
} else if (child->getStyle().positionType() == PositionType::Absolute) {
layoutAbsoluteChild(
currentNode,
child,
containingBlockWidth,
widthSizingMode,
containingBlockHeight,
currentNodeDirection,
layoutMarkerData,
currentDepth,
generationCount);
} else if (child->getStyle().positionType() == PositionType::Static) {
const Direction childDirection =
child->resolveDirection(currentNodeDirection);
layoutAbsoluteDescendants(
child,
widthSizingMode,
childDirection,
layoutMarkerData,
currentDepth + 1,
generationCount,
containingBlockWidth,
containingBlockHeight);
}
}
}

static void measureNodeWithMeasureFunc(
yoga::Node* const node,
float availableWidth,
Expand Down Expand Up @@ -2304,29 +2343,46 @@ static void calculateLayoutImpl(

if (performLayout) {
// STEP 10: SIZING AND POSITIONING ABSOLUTE CHILDREN
for (auto child : node->getChildren()) {
if (child->getStyle().display() == Display::None ||
child->getStyle().positionType() != PositionType::Absolute) {
continue;
if (!node->hasErrata(Errata::PositionStaticBehavesLikeRelative)) {
// Let the containing block layout its absolute descendants. By definition
// the containing block will not be static unless we are at the root.
if (node->getStyle().positionType() != PositionType::Static ||
depth == 1) {
layoutAbsoluteDescendants(
node,
isMainAxisRow ? sizingModeMainDim : sizingModeCrossDim,
direction,
layoutMarkerData,
depth,
generationCount,
node->getLayout().measuredDimension(Dimension::Width),
node->getLayout().measuredDimension(Dimension::Height));
}
const bool absolutePercentageAgainstPaddingEdge =
node->getConfig()->isExperimentalFeatureEnabled(
ExperimentalFeature::AbsolutePercentageAgainstPaddingEdge);
} else {
for (auto child : node->getChildren()) {
if (child->getStyle().display() == Display::None ||
child->getStyle().positionType() != PositionType::Absolute) {
continue;
}
const bool absolutePercentageAgainstPaddingEdge =
node->getConfig()->isExperimentalFeatureEnabled(
ExperimentalFeature::AbsolutePercentageAgainstPaddingEdge);

layoutAbsoluteChild(
node,
child,
absolutePercentageAgainstPaddingEdge
? node->getLayout().measuredDimension(Dimension::Width)
: availableInnerWidth,
isMainAxisRow ? sizingModeMainDim : sizingModeCrossDim,
absolutePercentageAgainstPaddingEdge
? node->getLayout().measuredDimension(Dimension::Height)
: availableInnerHeight,
direction,
layoutMarkerData,
depth,
generationCount);
layoutAbsoluteChild(
node,
child,
absolutePercentageAgainstPaddingEdge
? node->getLayout().measuredDimension(Dimension::Width)
: availableInnerWidth,
isMainAxisRow ? sizingModeMainDim : sizingModeCrossDim,
absolutePercentageAgainstPaddingEdge
? node->getLayout().measuredDimension(Dimension::Height)
: availableInnerHeight,
direction,
layoutMarkerData,
depth,
generationCount);
}
}

// STEP 11: SETTING TRAILING POSITIONS FOR CHILDREN
Expand Down

0 comments on commit 7bf6e7b

Please sign in to comment.