Fix flex basis not accounting for max size constraint

Summary: Fix flex basis not being constraint to the max size in the main direction. Previously this caused the added test to fail due to NaN in child dimensions.

Reviewed By: gkassabli

Differential Revision: D5044314

fbshipit-source-id: d9f9db832e4943a57a89c9d162ff6077b709795a
This commit is contained in:
Emil Sjolander
2017-05-12 09:03:22 -07:00
committed by Facebook Github Bot
parent dcf57d2f7e
commit 85c2e406e4
8 changed files with 305 additions and 48 deletions

View File

@@ -905,6 +905,64 @@ namespace Facebook.Yoga
Assert.AreEqual(50f, root_child1.LayoutHeight);
}
[Test]
public void Test_child_min_max_width_flexing()
{
YogaConfig config = new YogaConfig();
YogaNode root = new YogaNode(config);
root.FlexDirection = YogaFlexDirection.Row;
root.Width = 120;
root.Height = 50;
YogaNode root_child0 = new YogaNode(config);
root_child0.FlexGrow = 1;
root_child0.FlexBasis = 0;
root_child0.MinWidth = 60;
root.Insert(0, root_child0);
YogaNode root_child1 = new YogaNode(config);
root_child1.FlexGrow = 1;
root_child1.FlexBasis = 50.Percent();
root_child1.MaxWidth = 20;
root.Insert(1, root_child1);
root.StyleDirection = YogaDirection.LTR;
root.CalculateLayout();
Assert.AreEqual(0f, root.LayoutX);
Assert.AreEqual(0f, root.LayoutY);
Assert.AreEqual(120f, root.LayoutWidth);
Assert.AreEqual(50f, root.LayoutHeight);
Assert.AreEqual(0f, root_child0.LayoutX);
Assert.AreEqual(0f, root_child0.LayoutY);
Assert.AreEqual(100f, root_child0.LayoutWidth);
Assert.AreEqual(50f, root_child0.LayoutHeight);
Assert.AreEqual(100f, root_child1.LayoutX);
Assert.AreEqual(0f, root_child1.LayoutY);
Assert.AreEqual(20f, root_child1.LayoutWidth);
Assert.AreEqual(50f, root_child1.LayoutHeight);
root.StyleDirection = YogaDirection.RTL;
root.CalculateLayout();
Assert.AreEqual(0f, root.LayoutX);
Assert.AreEqual(0f, root.LayoutY);
Assert.AreEqual(120f, root.LayoutWidth);
Assert.AreEqual(50f, root.LayoutHeight);
Assert.AreEqual(20f, root_child0.LayoutX);
Assert.AreEqual(0f, root_child0.LayoutY);
Assert.AreEqual(100f, root_child0.LayoutWidth);
Assert.AreEqual(50f, root_child0.LayoutHeight);
Assert.AreEqual(0f, root_child1.LayoutX);
Assert.AreEqual(0f, root_child1.LayoutY);
Assert.AreEqual(20f, root_child1.LayoutWidth);
Assert.AreEqual(50f, root_child1.LayoutHeight);
}
[Test]
public void Test_min_width_overrides_width()
{

View File

@@ -84,6 +84,11 @@
<div style="height: 50px;"></div>
</div>
<div id="child_min_max_width_flexing" style="width: 120px; height: 50px; flex-direction: row; align-items:stretch">
<div style="min-width: 60px; flex-grow:1; flex-shrink:0; flex-basis: 0px"></div>
<div style="max-width: 20px; flex-grow:1; flex-shrink:0; flex-basis: 50%"></div>
</div>
<div id="min_width_overrides_width" style="min-width: 100px; width: 50px;">
</div>

View File

@@ -153,10 +153,10 @@ struct JYogaLogLevel : public JavaClass<JYogaLogLevel> {
};
static int YGJNILogFunc(const YGConfigRef config,
const YGNodeRef node,
YGLogLevel level,
const char *format,
va_list args) {
const YGNodeRef node,
YGLogLevel level,
const char *format,
va_list args) {
char buffer[256];
int result = vsnprintf(buffer, sizeof(buffer), format, args);

View File

@@ -887,6 +887,63 @@ public class YGMinMaxDimensionTest {
assertEquals(50f, root_child1.getLayoutHeight(), 0.0f);
}
@Test
public void test_child_min_max_width_flexing() {
YogaConfig config = new YogaConfig();
final YogaNode root = new YogaNode(config);
root.setFlexDirection(YogaFlexDirection.ROW);
root.setWidth(120f);
root.setHeight(50f);
final YogaNode root_child0 = new YogaNode(config);
root_child0.setFlexGrow(1f);
root_child0.setFlexBasis(0f);
root_child0.setMinWidth(60f);
root.addChildAt(root_child0, 0);
final YogaNode root_child1 = new YogaNode(config);
root_child1.setFlexGrow(1f);
root_child1.setFlexBasisPercent(50f);
root_child1.setMaxWidth(20f);
root.addChildAt(root_child1, 1);
root.setDirection(YogaDirection.LTR);
root.calculateLayout(YogaConstants.UNDEFINED, YogaConstants.UNDEFINED);
assertEquals(0f, root.getLayoutX(), 0.0f);
assertEquals(0f, root.getLayoutY(), 0.0f);
assertEquals(120f, root.getLayoutWidth(), 0.0f);
assertEquals(50f, root.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child0.getLayoutHeight(), 0.0f);
assertEquals(100f, root_child1.getLayoutX(), 0.0f);
assertEquals(0f, root_child1.getLayoutY(), 0.0f);
assertEquals(20f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child1.getLayoutHeight(), 0.0f);
root.setDirection(YogaDirection.RTL);
root.calculateLayout(YogaConstants.UNDEFINED, YogaConstants.UNDEFINED);
assertEquals(0f, root.getLayoutX(), 0.0f);
assertEquals(0f, root.getLayoutY(), 0.0f);
assertEquals(120f, root.getLayoutWidth(), 0.0f);
assertEquals(50f, root.getLayoutHeight(), 0.0f);
assertEquals(20f, root_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child0.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child1.getLayoutX(), 0.0f);
assertEquals(0f, root_child1.getLayoutY(), 0.0f);
assertEquals(20f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child1.getLayoutHeight(), 0.0f);
}
@Test
public void test_min_width_overrides_width() {
YogaConfig config = new YogaConfig();

View File

@@ -950,6 +950,67 @@ it("flex_grow_within_constrained_max_column", function () {
config.free();
}
});
it("child_min_max_width_flexing", function () {
var config = Yoga.Config.create();
try {
var root = Yoga.Node.create(config);
root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
root.setWidth(120);
root.setHeight(50);
var root_child0 = Yoga.Node.create(config);
root_child0.setFlexGrow(1);
root_child0.setFlexBasis(0);
root_child0.setMinWidth(60);
root.insertChild(root_child0, 0);
var root_child1 = Yoga.Node.create(config);
root_child1.setFlexGrow(1);
root_child1.setFlexBasis("50%");
root_child1.setMaxWidth(20);
root.insertChild(root_child1, 1);
root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
console.assert(120 === root.getComputedWidth(), "120 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
console.assert(50 === root.getComputedHeight(), "50 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
console.assert(100 === root_child1.getComputedLeft(), "100 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
console.assert(20 === root_child1.getComputedWidth(), "20 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
console.assert(50 === root_child1.getComputedHeight(), "50 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
console.assert(120 === root.getComputedWidth(), "120 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
console.assert(50 === root.getComputedHeight(), "50 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
console.assert(20 === root_child0.getComputedLeft(), "20 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
console.assert(20 === root_child1.getComputedWidth(), "20 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
console.assert(50 === root_child1.getComputedHeight(), "50 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
} finally {
if (typeof root !== "undefined") {
root.freeRecursive();
}
config.free();
}
});
it("min_width_overrides_width", function () {
var config = Yoga.Config.create();

View File

@@ -276,7 +276,7 @@ TEST(YogaTest, aspect_ratio_with_max_main_defined) {
ASSERT_EQ(0, YGNodeLayoutGetLeft(root_child0));
ASSERT_EQ(0, YGNodeLayoutGetTop(root_child0));
ASSERT_EQ(50, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(40, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(40, YGNodeLayoutGetHeight(root_child0));
YGNodeFreeRecursive(root);
@@ -320,7 +320,7 @@ TEST(YogaTest, aspect_ratio_with_min_main_defined) {
ASSERT_EQ(0, YGNodeLayoutGetLeft(root_child0));
ASSERT_EQ(0, YGNodeLayoutGetTop(root_child0));
ASSERT_EQ(30, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(40, YGNodeLayoutGetWidth(root_child0));
ASSERT_EQ(40, YGNodeLayoutGetHeight(root_child0));
YGNodeFreeRecursive(root);

View File

@@ -900,6 +900,64 @@ TEST(YogaTest, flex_grow_within_constrained_max_column) {
YGConfigFree(config);
}
TEST(YogaTest, child_min_max_width_flexing) {
const YGConfigRef config = YGConfigNew();
const YGNodeRef root = YGNodeNewWithConfig(config);
YGNodeStyleSetFlexDirection(root, YGFlexDirectionRow);
YGNodeStyleSetWidth(root, 120);
YGNodeStyleSetHeight(root, 50);
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
YGNodeStyleSetFlexGrow(root_child0, 1);
YGNodeStyleSetFlexBasis(root_child0, 0);
YGNodeStyleSetMinWidth(root_child0, 60);
YGNodeInsertChild(root, root_child0, 0);
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
YGNodeStyleSetFlexGrow(root_child1, 1);
YGNodeStyleSetFlexBasisPercent(root_child1, 50);
YGNodeStyleSetMaxWidth(root_child1, 20);
YGNodeInsertChild(root, root_child1, 1);
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
ASSERT_FLOAT_EQ(120, YGNodeLayoutGetWidth(root));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child0));
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetLeft(root_child1));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child1));
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
ASSERT_FLOAT_EQ(120, YGNodeLayoutGetWidth(root));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetLeft(root_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child1));
YGNodeFreeRecursive(root);
YGConfigFree(config);
}
TEST(YogaTest, min_width_overrides_width) {
const YGConfigRef config = YGConfigNew();

View File

@@ -387,8 +387,8 @@ void YGNodeFreeRecursive(const YGNodeRef root) {
void YGNodeReset(const YGNodeRef node) {
YGAssertWithNode(node,
YGNodeGetChildCount(node) == 0,
"Cannot reset a node which still has children attached");
YGNodeGetChildCount(node) == 0,
"Cannot reset a node which still has children attached");
YGAssertWithNode(node, node->parent == NULL, "Cannot reset a node still attached to a parent");
YGNodeListFree(node->children);
@@ -449,9 +449,10 @@ void YGNodeSetMeasureFunc(const YGNodeRef node, YGMeasureFunc measureFunc) {
// TODO: t18095186 Move nodeType to opt-in function and mark appropriate places in Litho
node->nodeType = YGNodeTypeDefault;
} else {
YGAssertWithNode(node,
YGNodeGetChildCount(node) == 0,
"Cannot set measure function: Nodes with measure functions cannot have children.");
YGAssertWithNode(
node,
YGNodeGetChildCount(node) == 0,
"Cannot set measure function: Nodes with measure functions cannot have children.");
node->measure = measureFunc;
// TODO: t18095186 Move nodeType to opt-in function and mark appropriate places in Litho
node->nodeType = YGNodeTypeText;
@@ -471,10 +472,12 @@ YGBaselineFunc YGNodeGetBaselineFunc(const YGNodeRef node) {
}
void YGNodeInsertChild(const YGNodeRef node, const YGNodeRef child, const uint32_t index) {
YGAssertWithNode(node, child->parent == NULL, "Child already has a parent, it must be removed first.");
YGAssertWithNode(node,
node->measure == NULL,
"Cannot add child: Nodes with measure functions cannot have children.");
child->parent == NULL,
"Child already has a parent, it must be removed first.");
YGAssertWithNode(node,
node->measure == NULL,
"Cannot add child: Nodes with measure functions cannot have children.");
YGNodeListInsert(&node->children, child, index);
child->parent = node;
@@ -503,9 +506,9 @@ inline uint32_t YGNodeGetChildCount(const YGNodeRef node) {
void YGNodeMarkDirty(const YGNodeRef node) {
YGAssertWithNode(node,
node->measure != NULL,
"Only leaf nodes with custom measure functions"
"should manually mark themselves as dirty");
node->measure != NULL,
"Only leaf nodes with custom measure functions"
"should manually mark themselves as dirty");
YGNodeMarkDirtyInternal(node);
}
@@ -702,27 +705,29 @@ static inline const YGValue *YGNodeResolveFlexBasisPtr(const YGNodeRef node) {
return node->layout.instanceName; \
}
#define YG_NODE_LAYOUT_RESOLVED_PROPERTY_IMPL(type, name, instanceName) \
type YGNodeLayoutGet##name(const YGNodeRef node, const YGEdge edge) { \
YGAssertWithNode(node, edge < YGEdgeEnd, "Cannot get layout properties of multi-edge shorthands"); \
\
if (edge == YGEdgeLeft) { \
if (node->layout.direction == YGDirectionRTL) { \
return node->layout.instanceName[YGEdgeEnd]; \
} else { \
return node->layout.instanceName[YGEdgeStart]; \
} \
} \
\
if (edge == YGEdgeRight) { \
if (node->layout.direction == YGDirectionRTL) { \
return node->layout.instanceName[YGEdgeStart]; \
} else { \
return node->layout.instanceName[YGEdgeEnd]; \
} \
} \
\
return node->layout.instanceName[edge]; \
#define YG_NODE_LAYOUT_RESOLVED_PROPERTY_IMPL(type, name, instanceName) \
type YGNodeLayoutGet##name(const YGNodeRef node, const YGEdge edge) { \
YGAssertWithNode(node, \
edge < YGEdgeEnd, \
"Cannot get layout properties of multi-edge shorthands"); \
\
if (edge == YGEdgeLeft) { \
if (node->layout.direction == YGDirectionRTL) { \
return node->layout.instanceName[YGEdgeEnd]; \
} else { \
return node->layout.instanceName[YGEdgeStart]; \
} \
} \
\
if (edge == YGEdgeRight) { \
if (node->layout.direction == YGDirectionRTL) { \
return node->layout.instanceName[YGEdgeStart]; \
} else { \
return node->layout.instanceName[YGEdgeEnd]; \
} \
} \
\
return node->layout.instanceName[edge]; \
}
YG_NODE_PROPERTY_IMPL(void *, Context, context, context);
@@ -1143,8 +1148,8 @@ static float YGBaseline(const YGNodeRef node) {
node->layout.measuredDimensions[YGDimensionWidth],
node->layout.measuredDimensions[YGDimensionHeight]);
YGAssertWithNode(node,
!YGFloatIsUndefined(baseline),
"Expect custom baseline function to not return NaN");
!YGFloatIsUndefined(baseline),
"Expect custom baseline function to not return NaN");
return baseline;
}
@@ -1949,13 +1954,15 @@ static void YGNodelayoutImpl(const YGNodeRef node,
const bool performLayout,
const YGConfigRef config) {
YGAssertWithNode(node,
YGFloatIsUndefined(availableWidth) ? widthMeasureMode == YGMeasureModeUndefined : true,
"availableWidth is indefinite so widthMeasureMode must be "
"YGMeasureModeUndefined");
YGFloatIsUndefined(availableWidth) ? widthMeasureMode == YGMeasureModeUndefined
: true,
"availableWidth is indefinite so widthMeasureMode must be "
"YGMeasureModeUndefined");
YGAssertWithNode(node,
YGFloatIsUndefined(availableHeight) ? heightMeasureMode == YGMeasureModeUndefined : true,
"availableHeight is indefinite so heightMeasureMode must be "
"YGMeasureModeUndefined");
YGFloatIsUndefined(availableHeight) ? heightMeasureMode == YGMeasureModeUndefined
: true,
"availableHeight is indefinite so heightMeasureMode must be "
"YGMeasureModeUndefined");
// Set the resolved resolution in the node's layout.
const YGDirection direction = YGNodeResolveDirection(node, parentDirection);
@@ -2337,7 +2344,12 @@ static void YGNodelayoutImpl(const YGNodeRef node,
float deltaFlexGrowFactors = 0;
currentRelativeChild = firstRelativeChild;
while (currentRelativeChild != NULL) {
childFlexBasis = currentRelativeChild->layout.computedFlexBasis;
childFlexBasis =
fminf(YGResolveValue(&currentRelativeChild->style.maxDimensions[dim[mainAxis]],
mainAxisParentSize),
fmaxf(YGResolveValue(&currentRelativeChild->style.minDimensions[dim[mainAxis]],
mainAxisParentSize),
currentRelativeChild->layout.computedFlexBasis));
if (remainingFreeSpace < 0) {
flexShrinkScaledFactor = -YGNodeResolveFlexShrink(currentRelativeChild) * childFlexBasis;
@@ -2375,6 +2387,7 @@ static void YGNodelayoutImpl(const YGNodeRef node,
baseMainSize,
availableInnerMainDim,
availableInnerWidth);
if (baseMainSize != boundMainSize) {
// By excluding this item's size and flex factor from remaining,
// this item's
@@ -2399,7 +2412,12 @@ static void YGNodelayoutImpl(const YGNodeRef node,
deltaFreeSpace = 0;
currentRelativeChild = firstRelativeChild;
while (currentRelativeChild != NULL) {
childFlexBasis = currentRelativeChild->layout.computedFlexBasis;
childFlexBasis =
fminf(YGResolveValue(&currentRelativeChild->style.maxDimensions[dim[mainAxis]],
mainAxisParentSize),
fmaxf(YGResolveValue(&currentRelativeChild->style.minDimensions[dim[mainAxis]],
mainAxisParentSize),
currentRelativeChild->layout.computedFlexBasis));
float updatedMainSize = childFlexBasis;
if (remainingFreeSpace < 0) {