From ca2c607f9004303f47870200e8018a634de5b594 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lukas=20W=C3=B6hrl?= Date: Fri, 16 Jun 2017 07:31:19 -0700 Subject: [PATCH] The total flex factores need to be a minimum of 1 if any MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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 --- csharp/tests/Facebook.Yoga/YGFlexTest.cs | 68 +++++++++++++++++++ gentest/fixtures/YGFlexTest.html | 6 ++ java/tests/com/facebook/yoga/YGFlexTest.java | 67 ++++++++++++++++++ javascript/tests/Facebook.Yoga/YGFlexTest.js | 71 ++++++++++++++++++++ tests/YGFlexTest.cpp | 68 +++++++++++++++++++ yoga/Yoga.c | 10 +++ 6 files changed, 290 insertions(+) diff --git a/csharp/tests/Facebook.Yoga/YGFlexTest.cs b/csharp/tests/Facebook.Yoga/YGFlexTest.cs index b980b540..ef5f9611 100644 --- a/csharp/tests/Facebook.Yoga/YGFlexTest.cs +++ b/csharp/tests/Facebook.Yoga/YGFlexTest.cs @@ -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); + } + } } diff --git a/gentest/fixtures/YGFlexTest.html b/gentest/fixtures/YGFlexTest.html index 30da202e..5d8ae13c 100644 --- a/gentest/fixtures/YGFlexTest.html +++ b/gentest/fixtures/YGFlexTest.html @@ -35,3 +35,9 @@
+ +
+
+
+
+
diff --git a/java/tests/com/facebook/yoga/YGFlexTest.java b/java/tests/com/facebook/yoga/YGFlexTest.java index 7460ac39..45d0b8a3 100644 --- a/java/tests/com/facebook/yoga/YGFlexTest.java +++ b/java/tests/com/facebook/yoga/YGFlexTest.java @@ -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); + } + } diff --git a/javascript/tests/Facebook.Yoga/YGFlexTest.js b/javascript/tests/Facebook.Yoga/YGFlexTest.js index 7cde3474..0c74f465 100644 --- a/javascript/tests/Facebook.Yoga/YGFlexTest.js +++ b/javascript/tests/Facebook.Yoga/YGFlexTest.js @@ -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(); + } +}); diff --git a/tests/YGFlexTest.cpp b/tests/YGFlexTest.cpp index 825de3a2..c9c310fd 100644 --- a/tests/YGFlexTest.cpp +++ b/tests/YGFlexTest.cpp @@ -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); +} diff --git a/yoga/Yoga.c b/yoga/Yoga.c index 96c6c5a5..b9469263 100644 --- a/yoga/Yoga.c +++ b/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;