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

Fix aspectratio with margins

Browse Source 
Summary: aspect ratio did not account for the widths and heights being including padding. This diff fixes that.

Reviewed By: astreet

Differential Revision: D4473024

fbshipit-source-id: 5a747e2f267b077203bb3b63e4c152847dc30774
This commit is contained in:
Emil Sjolander
2017-01-27 09:56:35 -08:00
committed by Facebook Github Bot
parent abb91ae77b
commit 7fa4adb0d9
2 changed files with 109 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
tests/YGAspectRatioTest.cpp
View File

@@ -697,3 +697,53 @@ TEST(YogaTest, aspect_ratio_allow_child_overflow_parent_size) {
YGNodeFreeRecursive(root); YGNodeFreeRecursive(root);
} }
TEST(YogaTest, aspect_ratio_defined_main_with_margin) {
const YGNodeRef root = YGNodeNew();
YGNodeStyleSetAlignItems(root, YGAlignCenter);
YGNodeStyleSetJustifyContent(root, YGJustifyCenter);
YGNodeStyleSetWidth(root, 100);
YGNodeStyleSetHeight(root, 100);
const YGNodeRef root_child0 = YGNodeNew();
YGNodeStyleSetHeight(root_child0, 50);
YGNodeStyleSetAspectRatio(root_child0, 1);
YGNodeStyleSetMargin(root_child0, YGEdgeLeft, 10);
YGNodeStyleSetMargin(root_child0, YGEdgeRight, 10);
YGNodeInsertChild(root, root_child0, 0);
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
ASSERT_EQ(100, YGNodeLayoutGetWidth(root));
ASSERT_EQ(100, YGNodeLayoutGetHeight(root));
ASSERT_EQ(50, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(50, YGNodeLayoutGetHeight(root_child0));
YGNodeFreeRecursive(root);
}
TEST(YogaTest, aspect_ratio_defined_cross_with_margin) {
const YGNodeRef root = YGNodeNew();
YGNodeStyleSetAlignItems(root, YGAlignCenter);
YGNodeStyleSetJustifyContent(root, YGJustifyCenter);
YGNodeStyleSetWidth(root, 100);
YGNodeStyleSetHeight(root, 100);
const YGNodeRef root_child0 = YGNodeNew();
YGNodeStyleSetWidth(root_child0, 50);
YGNodeStyleSetAspectRatio(root_child0, 1);
YGNodeStyleSetMargin(root_child0, YGEdgeLeft, 10);
YGNodeStyleSetMargin(root_child0, YGEdgeRight, 10);
YGNodeInsertChild(root, root_child0, 0);
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
ASSERT_EQ(100, YGNodeLayoutGetWidth(root));
ASSERT_EQ(100, YGNodeLayoutGetHeight(root));
ASSERT_EQ(50, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(50, YGNodeLayoutGetHeight(root_child0));
YGNodeFreeRecursive(root);
}

101
yoga/Yoga.c
View File

@@ -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;
} }
@@ -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;
} }
@@ -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
@@ -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
@@ -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));
} }
} }
} }
@@ -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) &&
@@ -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) &&
@@ -2254,17 +2260,16 @@ 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));
@@ -2272,21 +2277,26 @@ static void YGNodelayoutImpl(const YGNodeRef node,
// 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;
} }
} }
@@ -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],