The total flex factores need to be a minimum of 1 if any
Summary: The only thing I found in the spec for this change is the following. Not exactly sure if this is the thing this PR is about: > For each flex item, subtract its outer flex base size from its max-content contribution size. If that result is not zero, divide it by (if the result was positive) its **flex grow factor floored at 1** or (if the result was negative) by its scaled flex shrink factor, having **floored the flex shrink factor at 1**. This is the item’s max-content flex fraction. But at least it seems a required change. Fixes facebook/yoga#566 Closes https://github.com/facebook/yoga/pull/572 Differential Revision: D5264388 Pulled By: emilsjolander fbshipit-source-id: 0004d1c3b9bad070a98cd6766c1adc06a54475f8
This commit is contained in:
committed by
Facebook Github Bot
parent
6c67684fa6
commit
ca2c607f90
@@ -429,5 +429,73 @@ namespace Facebook.Yoga
|
||||
Assert.AreEqual(0f, root_child0_child0.LayoutHeight);
|
||||
}
|
||||
|
||||
[Test]
|
||||
public void Test_flex_grow_less_than_factor_one()
|
||||
{
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
YogaNode root = new YogaNode(config);
|
||||
root.Width = 200;
|
||||
root.Height = 500;
|
||||
|
||||
YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.FlexGrow = 0.2f;
|
||||
root_child0.FlexBasis = 40;
|
||||
root.Insert(0, root_child0);
|
||||
|
||||
YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.FlexGrow = 0.2f;
|
||||
root.Insert(1, root_child1);
|
||||
|
||||
YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.FlexGrow = 0.4f;
|
||||
root.Insert(2, root_child2);
|
||||
root.StyleDirection = YogaDirection.LTR;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(200f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child0.LayoutX);
|
||||
Assert.AreEqual(0f, root_child0.LayoutY);
|
||||
Assert.AreEqual(200f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(132f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child1.LayoutX);
|
||||
Assert.AreEqual(132f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(92f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child2.LayoutX);
|
||||
Assert.AreEqual(224f, root_child2.LayoutY);
|
||||
Assert.AreEqual(200f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(184f, root_child2.LayoutHeight);
|
||||
|
||||
root.StyleDirection = YogaDirection.RTL;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(200f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child0.LayoutX);
|
||||
Assert.AreEqual(0f, root_child0.LayoutY);
|
||||
Assert.AreEqual(200f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(132f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child1.LayoutX);
|
||||
Assert.AreEqual(132f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(92f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(0f, root_child2.LayoutX);
|
||||
Assert.AreEqual(224f, root_child2.LayoutY);
|
||||
Assert.AreEqual(200f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(184f, root_child2.LayoutHeight);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
@@ -35,3 +35,9 @@
|
||||
<div style="flex-grow:1; flex-shrink:1;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="flex_grow_less_than_factor_one" style="height: 500px; width: 200px; flex-direction:column;">
|
||||
<div style="flex-grow:0.2; flex-shrink:0; flex-basis: 40px;"></div>
|
||||
<div style="flex-grow:0.2; flex-shrink:0;"></div>
|
||||
<div style="flex-grow:0.4; flex-shrink:0;"></div>
|
||||
</div>
|
||||
|
@@ -421,4 +421,71 @@ public class YGFlexTest {
|
||||
assertEquals(0f, root_child0_child0.getLayoutHeight(), 0.0f);
|
||||
}
|
||||
|
||||
@Test
|
||||
public void test_flex_grow_less_than_factor_one() {
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
final YogaNode root = new YogaNode(config);
|
||||
root.setWidth(200f);
|
||||
root.setHeight(500f);
|
||||
|
||||
final YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.setFlexGrow(0.2f);
|
||||
root_child0.setFlexBasis(40f);
|
||||
root.addChildAt(root_child0, 0);
|
||||
|
||||
final YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.setFlexGrow(0.2f);
|
||||
root.addChildAt(root_child1, 1);
|
||||
|
||||
final YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.setFlexGrow(0.4f);
|
||||
root.addChildAt(root_child2, 2);
|
||||
root.setDirection(YogaDirection.LTR);
|
||||
root.calculateLayout(YogaConstants.UNDEFINED, YogaConstants.UNDEFINED);
|
||||
|
||||
assertEquals(0f, root.getLayoutX(), 0.0f);
|
||||
assertEquals(0f, root.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(132f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(132f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(92f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(224f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(184f, root_child2.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(200f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(132f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(132f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(92f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(0f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(224f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(184f, root_child2.getLayoutHeight(), 0.0f);
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -444,3 +444,74 @@ it("flex_grow_shrink_at_most", function () {
|
||||
config.free();
|
||||
}
|
||||
});
|
||||
it("flex_grow_less_than_factor_one", function () {
|
||||
var config = Yoga.Config.create();
|
||||
|
||||
try {
|
||||
var root = Yoga.Node.create(config);
|
||||
root.setWidth(200);
|
||||
root.setHeight(500);
|
||||
|
||||
var root_child0 = Yoga.Node.create(config);
|
||||
root_child0.setFlexGrow(0.2);
|
||||
root_child0.setFlexBasis(40);
|
||||
root.insertChild(root_child0, 0);
|
||||
|
||||
var root_child1 = Yoga.Node.create(config);
|
||||
root_child1.setFlexGrow(0.2);
|
||||
root.insertChild(root_child1, 1);
|
||||
|
||||
var root_child2 = Yoga.Node.create(config);
|
||||
root_child2.setFlexGrow(0.4);
|
||||
root.insertChild(root_child2, 2);
|
||||
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(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === 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(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
|
||||
console.assert(132 === root_child0.getComputedHeight(), "132 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(132 === root_child1.getComputedTop(), "132 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(92 === root_child1.getComputedHeight(), "92 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(0 === root_child2.getComputedLeft(), "0 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(224 === root_child2.getComputedTop(), "224 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(200 === root_child2.getComputedWidth(), "200 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(184 === root_child2.getComputedHeight(), "184 === root_child2.getComputedHeight() (" + root_child2.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(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === 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(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
|
||||
console.assert(132 === root_child0.getComputedHeight(), "132 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(132 === root_child1.getComputedTop(), "132 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(92 === root_child1.getComputedHeight(), "92 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(0 === root_child2.getComputedLeft(), "0 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(224 === root_child2.getComputedTop(), "224 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(200 === root_child2.getComputedWidth(), "200 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(184 === root_child2.getComputedHeight(), "184 === root_child2.getComputedHeight() (" + root_child2.getComputedHeight() + ")");
|
||||
} finally {
|
||||
if (typeof root !== "undefined") {
|
||||
root.freeRecursive();
|
||||
}
|
||||
|
||||
config.free();
|
||||
}
|
||||
});
|
||||
|
@@ -423,3 +423,71 @@ TEST(YogaTest, flex_grow_shrink_at_most) {
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, flex_grow_less_than_factor_one) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
const YGNodeRef root = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root, 200);
|
||||
YGNodeStyleSetHeight(root, 500);
|
||||
|
||||
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexGrow(root_child0, 0.2f);
|
||||
YGNodeStyleSetFlexBasis(root_child0, 40);
|
||||
YGNodeInsertChild(root, root_child0, 0);
|
||||
|
||||
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexGrow(root_child1, 0.2f);
|
||||
YGNodeInsertChild(root, root_child1, 1);
|
||||
|
||||
const YGNodeRef root_child2 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexGrow(root_child2, 0.4f);
|
||||
YGNodeInsertChild(root, root_child2, 2);
|
||||
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(132, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(132, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(92, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(224, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(184, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(132, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(132, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(92, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(224, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(184, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeFreeRecursive(root);
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
10
yoga/Yoga.c
10
yoga/Yoga.c
@@ -2278,6 +2278,16 @@ static void YGNodelayoutImpl(const YGNodeRef node,
|
||||
}
|
||||
}
|
||||
|
||||
// The total flex factor needs to be floored to 1.
|
||||
if (totalFlexGrowFactors > 0 && totalFlexGrowFactors < 1) {
|
||||
totalFlexGrowFactors = 1;
|
||||
}
|
||||
|
||||
// The total flex shrink factor needs to be floored to 1.
|
||||
if (totalFlexShrinkScaledFactors > 0 && totalFlexShrinkScaledFactors < 1) {
|
||||
totalFlexShrinkScaledFactors = 1;
|
||||
}
|
||||
|
||||
// If we don't need to measure the cross axis, we can skip the entire flex
|
||||
// step.
|
||||
const bool canSkipFlex = !performLayout && measureModeCrossDim == YGMeasureModeExactly;
|
||||
|
Reference in New Issue
Block a user