Skip to content

Commit

Permalink
Fix aspectratio with margins
Browse files Browse the repository at this point in the history
Reviewed By: astreet

Differential Revision: D4473024

fbshipit-source-id: 5a747e2f267b077203bb3b63e4c152847dc30774
  • Loading branch information
Emil Sjolander authored and facebook-github-bot committed Jan 27, 2017
1 parent 5cbb05c commit 81fe1a3
Showing 1 changed file with 59 additions and 42 deletions.
101 changes: 59 additions & 42 deletions ReactCommon/yoga/yoga/Yoga.c
Expand Up @@ -1274,14 +1274,17 @@ static void YGNodeComputeFlexBasisForChild(const YGNodeRef node,
childWidthMeasureMode = YGMeasureModeUndefined; childWidthMeasureMode = YGMeasureModeUndefined;
childHeightMeasureMode = YGMeasureModeUndefined; childHeightMeasureMode = YGMeasureModeUndefined;


const float marginRow = YGNodeMarginForAxis(child, YGFlexDirectionRow, parentWidth);
const float marginColumn = YGNodeMarginForAxis(child, YGFlexDirectionColumn, parentWidth);

if (isRowStyleDimDefined) { if (isRowStyleDimDefined) {
childWidth = YGValueResolve(&child->style.dimensions[YGDimensionWidth], parentWidth) + childWidth =
YGNodeMarginForAxis(child, YGFlexDirectionRow, parentWidth); YGValueResolve(&child->style.dimensions[YGDimensionWidth], parentWidth) + marginRow;
childWidthMeasureMode = YGMeasureModeExactly; childWidthMeasureMode = YGMeasureModeExactly;
} }
if (isColumnStyleDimDefined) { if (isColumnStyleDimDefined) {
childHeight = YGValueResolve(&child->style.dimensions[YGDimensionHeight], parentHeight) + childHeight =
YGNodeMarginForAxis(child, YGFlexDirectionColumn, parentWidth); YGValueResolve(&child->style.dimensions[YGDimensionHeight], parentHeight) + marginColumn;
childHeightMeasureMode = YGMeasureModeExactly; childHeightMeasureMode = YGMeasureModeExactly;
} }


Expand Down Expand Up @@ -1320,12 +1323,12 @@ static void YGNodeComputeFlexBasisForChild(const YGNodeRef node,
if (!YGFloatIsUndefined(child->style.aspectRatio)) { if (!YGFloatIsUndefined(child->style.aspectRatio)) {
if (!isMainAxisRow && childWidthMeasureMode == YGMeasureModeExactly) { if (!isMainAxisRow && childWidthMeasureMode == YGMeasureModeExactly) {
child->layout.computedFlexBasis = child->layout.computedFlexBasis =
fmaxf(childWidth / child->style.aspectRatio, fmaxf((childWidth - marginRow) / child->style.aspectRatio,
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionColumn, parentWidth)); YGNodePaddingAndBorderForAxis(child, YGFlexDirectionColumn, parentWidth));
return; return;
} else if (isMainAxisRow && childHeightMeasureMode == YGMeasureModeExactly) { } else if (isMainAxisRow && childHeightMeasureMode == YGMeasureModeExactly) {
child->layout.computedFlexBasis = child->layout.computedFlexBasis =
fmaxf(childHeight * child->style.aspectRatio, fmaxf((childHeight - marginColumn) * child->style.aspectRatio,
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionRow, parentWidth)); YGNodePaddingAndBorderForAxis(child, YGFlexDirectionRow, parentWidth));
return; return;
} }
Expand Down Expand Up @@ -1376,9 +1379,11 @@ static void YGNodeAbsoluteLayoutChild(const YGNodeRef node,
YGMeasureMode childWidthMeasureMode = YGMeasureModeUndefined; YGMeasureMode childWidthMeasureMode = YGMeasureModeUndefined;
YGMeasureMode childHeightMeasureMode = YGMeasureModeUndefined; YGMeasureMode childHeightMeasureMode = YGMeasureModeUndefined;


const float marginRow = YGNodeMarginForAxis(child, YGFlexDirectionRow, width);
const float marginColumn = YGNodeMarginForAxis(child, YGFlexDirectionColumn, width);

if (YGNodeIsStyleDimDefined(child, YGFlexDirectionRow)) { if (YGNodeIsStyleDimDefined(child, YGFlexDirectionRow)) {
childWidth = YGValueResolve(&child->style.dimensions[YGDimensionWidth], width) + childWidth = YGValueResolve(&child->style.dimensions[YGDimensionWidth], width) + marginRow;
YGNodeMarginForAxis(child, YGFlexDirectionRow, width);
} else { } else {
// If the child doesn't have a specified width, compute the width based // If the child doesn't have a specified width, compute the width based
// on the left/right // on the left/right
Expand All @@ -1395,8 +1400,8 @@ static void YGNodeAbsoluteLayoutChild(const YGNodeRef node,
} }


if (YGNodeIsStyleDimDefined(child, YGFlexDirectionColumn)) { if (YGNodeIsStyleDimDefined(child, YGFlexDirectionColumn)) {
childHeight = YGValueResolve(&child->style.dimensions[YGDimensionHeight], height) + childHeight =
YGNodeMarginForAxis(child, YGFlexDirectionColumn, width); YGValueResolve(&child->style.dimensions[YGDimensionHeight], height) + marginColumn;
} else { } else {
// If the child doesn't have a specified height, compute the height // If the child doesn't have a specified height, compute the height
// based on the top/bottom // based on the top/bottom
Expand All @@ -1417,11 +1422,13 @@ static void YGNodeAbsoluteLayoutChild(const YGNodeRef node,
if (YGFloatIsUndefined(childWidth) ^ YGFloatIsUndefined(childHeight)) { if (YGFloatIsUndefined(childWidth) ^ YGFloatIsUndefined(childHeight)) {
if (!YGFloatIsUndefined(child->style.aspectRatio)) { if (!YGFloatIsUndefined(child->style.aspectRatio)) {
if (YGFloatIsUndefined(childWidth)) { if (YGFloatIsUndefined(childWidth)) {
childWidth = fmaxf(childHeight * child->style.aspectRatio, childWidth =
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionColumn, width)); marginRow + fmaxf((childHeight - marginColumn) * child->style.aspectRatio,
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionColumn, width));
} else if (YGFloatIsUndefined(childHeight)) { } else if (YGFloatIsUndefined(childHeight)) {
childHeight = fmaxf(childWidth / child->style.aspectRatio, childHeight =
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionRow, width)); marginColumn + fmaxf((childWidth - marginRow) / child->style.aspectRatio,
YGNodePaddingAndBorderForAxis(child, YGFlexDirectionRow, width));
} }
} }
} }
Expand Down Expand Up @@ -2213,10 +2220,13 @@ static void YGNodelayoutImpl(const YGNodeRef node,
YGMeasureMode childWidthMeasureMode; YGMeasureMode childWidthMeasureMode;
YGMeasureMode childHeightMeasureMode; YGMeasureMode childHeightMeasureMode;


const float marginRow =
YGNodeMarginForAxis(currentRelativeChild, YGFlexDirectionRow, availableInnerWidth);
const float marginColumn =
YGNodeMarginForAxis(currentRelativeChild, YGFlexDirectionColumn, availableInnerWidth);

if (isMainAxisRow) { if (isMainAxisRow) {
childWidth = childWidth = updatedMainSize + marginRow;
updatedMainSize +
YGNodeMarginForAxis(currentRelativeChild, YGFlexDirectionRow, availableInnerWidth);
childWidthMeasureMode = YGMeasureModeExactly; childWidthMeasureMode = YGMeasureModeExactly;


if (!YGFloatIsUndefined(availableInnerCrossDim) && if (!YGFloatIsUndefined(availableInnerCrossDim) &&
Expand All @@ -2232,15 +2242,11 @@ static void YGNodelayoutImpl(const YGNodeRef node,
} else { } else {
childHeight = YGValueResolve(&currentRelativeChild->style.dimensions[YGDimensionHeight], childHeight = YGValueResolve(&currentRelativeChild->style.dimensions[YGDimensionHeight],
availableInnerHeight) + availableInnerHeight) +
YGNodeMarginForAxis(currentRelativeChild, marginColumn;
YGFlexDirectionColumn,
availableInnerWidth);
childHeightMeasureMode = YGMeasureModeExactly; childHeightMeasureMode = YGMeasureModeExactly;
} }
} else { } else {
childHeight = childHeight = updatedMainSize + marginColumn;
updatedMainSize +
YGNodeMarginForAxis(currentRelativeChild, YGFlexDirectionColumn, availableInnerWidth);
childHeightMeasureMode = YGMeasureModeExactly; childHeightMeasureMode = YGMeasureModeExactly;


if (!YGFloatIsUndefined(availableInnerCrossDim) && if (!YGFloatIsUndefined(availableInnerCrossDim) &&
Expand All @@ -2254,39 +2260,43 @@ static void YGNodelayoutImpl(const YGNodeRef node,
childWidthMeasureMode = childWidthMeasureMode =
YGFloatIsUndefined(childWidth) ? YGMeasureModeUndefined : YGMeasureModeAtMost; YGFloatIsUndefined(childWidth) ? YGMeasureModeUndefined : YGMeasureModeAtMost;
} else { } else {
childWidth = childWidth = YGValueResolve(&currentRelativeChild->style.dimensions[YGDimensionWidth],
YGValueResolve(&currentRelativeChild->style.dimensions[YGDimensionWidth], availableInnerWidth) +
availableInnerWidth) + marginRow;
YGNodeMarginForAxis(currentRelativeChild, YGFlexDirectionRow, availableInnerWidth);
childWidthMeasureMode = YGMeasureModeExactly; childWidthMeasureMode = YGMeasureModeExactly;
} }
} }


if (!YGFloatIsUndefined(currentRelativeChild->style.aspectRatio)) { if (!YGFloatIsUndefined(currentRelativeChild->style.aspectRatio)) {
if (isMainAxisRow) { if (isMainAxisRow) {
childHeight = fmaxf(childWidth / currentRelativeChild->style.aspectRatio, childHeight = fmaxf((childWidth - marginRow) / currentRelativeChild->style.aspectRatio,
YGNodePaddingAndBorderForAxis(currentRelativeChild, YGNodePaddingAndBorderForAxis(currentRelativeChild,
YGFlexDirectionColumn, YGFlexDirectionColumn,
availableInnerWidth)); availableInnerWidth));
childHeightMeasureMode = YGMeasureModeExactly; childHeightMeasureMode = YGMeasureModeExactly;


// Parent size constraint should have higher priority than flex // Parent size constraint should have higher priority than flex
if (YGNodeIsFlex(currentRelativeChild)) { if (YGNodeIsFlex(currentRelativeChild)) {
childHeight = fminf(childHeight, availableInnerHeight); childHeight = fminf((childHeight - marginColumn), availableInnerHeight);
childWidth = childHeight * currentRelativeChild->style.aspectRatio; childWidth = marginRow + childHeight * currentRelativeChild->style.aspectRatio;
} }

childHeight += marginColumn;
} else { } else {
childWidth = fmaxf(childHeight * currentRelativeChild->style.aspectRatio, childWidth =
YGNodePaddingAndBorderForAxis(currentRelativeChild, fmaxf((childHeight - marginColumn) * currentRelativeChild->style.aspectRatio,
YGFlexDirectionRow, YGNodePaddingAndBorderForAxis(currentRelativeChild,
availableInnerWidth)); YGFlexDirectionRow,
availableInnerWidth));
childWidthMeasureMode = YGMeasureModeExactly; childWidthMeasureMode = YGMeasureModeExactly;


// Parent size constraint should have higher priority than flex // Parent size constraint should have higher priority than flex
if (YGNodeIsFlex(currentRelativeChild)) { if (YGNodeIsFlex(currentRelativeChild)) {
childWidth = fminf(childWidth, availableInnerWidth); childWidth = fminf((childWidth - marginRow), availableInnerWidth);
childHeight = childWidth / currentRelativeChild->style.aspectRatio; childHeight = marginColumn + childWidth / currentRelativeChild->style.aspectRatio;
} }

childWidth += marginRow;
} }
} }


Expand Down Expand Up @@ -2495,24 +2505,31 @@ static void YGNodelayoutImpl(const YGNodeRef node,
YGMeasureMode childWidthMeasureMode = YGMeasureModeExactly; YGMeasureMode childWidthMeasureMode = YGMeasureModeExactly;
YGMeasureMode childHeightMeasureMode = YGMeasureModeExactly; YGMeasureMode childHeightMeasureMode = YGMeasureModeExactly;


const float marginRow =
YGNodeMarginForAxis(child, YGFlexDirectionRow, availableInnerWidth);
const float marginColumn =
YGNodeMarginForAxis(child, YGFlexDirectionColumn, availableInnerWidth);

if (isMainAxisRow) { if (isMainAxisRow) {
childWidth = child->layout.measuredDimensions[YGDimensionWidth] + childWidth = child->layout.measuredDimensions[YGDimensionWidth];
YGNodeMarginForAxis(child, YGFlexDirectionRow, availableInnerWidth);


if (!YGFloatIsUndefined(child->style.aspectRatio)) { if (!YGFloatIsUndefined(child->style.aspectRatio)) {
childHeight = childWidth / child->style.aspectRatio; childHeight = marginColumn + childWidth / child->style.aspectRatio;
} else { } else {
childHeight = crossDim; childHeight = crossDim;
} }

childWidth += marginRow;
} else { } else {
childHeight = child->layout.measuredDimensions[YGDimensionHeight] + childHeight = child->layout.measuredDimensions[YGDimensionHeight];
YGNodeMarginForAxis(child, YGFlexDirectionColumn, availableInnerWidth);


if (!YGFloatIsUndefined(child->style.aspectRatio)) { if (!YGFloatIsUndefined(child->style.aspectRatio)) {
childWidth = childHeight * child->style.aspectRatio; childWidth = marginRow + childHeight * child->style.aspectRatio;
} else { } else {
childWidth = crossDim; childWidth = crossDim;
} }

childHeight += marginColumn;
} }


YGConstrainMaxSizeForMode(YGValueResolve(&child->style.maxDimensions[YGDimensionWidth], YGConstrainMaxSizeForMode(YGValueResolve(&child->style.maxDimensions[YGDimensionWidth],
Expand Down

0 comments on commit 81fe1a3

Please sign in to comment.