Fix flex-wrap with max constraint
Summary: Fixes `flex-wrap` with a max constraint and `justify-content`. Fixes facebook/yoga#514. Closes https://github.com/facebook/yoga/pull/519 Differential Revision: D4953727 Pulled By: emilsjolander fbshipit-source-id: 32dec48220be1392ea8dac5f34871d407eb8d49b
This commit is contained in:
Lukas Wöhrl
committed by
Facebook Github Bot
Facebook Github Bot
parent
cdfd05c742
commit
3178e3bf15
@@ -1381,5 +1381,169 @@ namespace Facebook.Yoga
|
||||
Assert.AreEqual(80f, root_child0_child1.LayoutHeight);
|
||||
}
|
||||
|
||||
[Test]
|
||||
public void Test_wrapped_column_max_height()
|
||||
{
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
YogaNode root = new YogaNode(config);
|
||||
root.JustifyContent = YogaJustify.Center;
|
||||
root.AlignContent = YogaAlign.Center;
|
||||
root.AlignItems = YogaAlign.Center;
|
||||
root.Wrap = YogaWrap.Wrap;
|
||||
root.Width = 700;
|
||||
root.Height = 500;
|
||||
|
||||
YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.Width = 100;
|
||||
root_child0.Height = 500;
|
||||
root_child0.MaxHeight = 200;
|
||||
root.Insert(0, root_child0);
|
||||
|
||||
YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.MarginLeft = 20;
|
||||
root_child1.MarginTop = 20;
|
||||
root_child1.MarginRight = 20;
|
||||
root_child1.MarginBottom = 20;
|
||||
root_child1.Width = 200;
|
||||
root_child1.Height = 200;
|
||||
root.Insert(1, root_child1);
|
||||
|
||||
YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.Width = 100;
|
||||
root_child2.Height = 100;
|
||||
root.Insert(2, root_child2);
|
||||
root.StyleDirection = YogaDirection.LTR;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(700f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(250f, root_child0.LayoutX);
|
||||
Assert.AreEqual(30f, root_child0.LayoutY);
|
||||
Assert.AreEqual(100f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(200f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(200f, root_child1.LayoutX);
|
||||
Assert.AreEqual(250f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(200f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(420f, root_child2.LayoutX);
|
||||
Assert.AreEqual(200f, root_child2.LayoutY);
|
||||
Assert.AreEqual(100f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(100f, root_child2.LayoutHeight);
|
||||
|
||||
root.StyleDirection = YogaDirection.RTL;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(700f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(350f, root_child0.LayoutX);
|
||||
Assert.AreEqual(30f, root_child0.LayoutY);
|
||||
Assert.AreEqual(100f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(200f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(300f, root_child1.LayoutX);
|
||||
Assert.AreEqual(250f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(200f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(180f, root_child2.LayoutX);
|
||||
Assert.AreEqual(200f, root_child2.LayoutY);
|
||||
Assert.AreEqual(100f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(100f, root_child2.LayoutHeight);
|
||||
}
|
||||
|
||||
[Test]
|
||||
public void Test_wrapped_column_max_height_flex()
|
||||
{
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
YogaNode root = new YogaNode(config);
|
||||
root.JustifyContent = YogaJustify.Center;
|
||||
root.AlignContent = YogaAlign.Center;
|
||||
root.AlignItems = YogaAlign.Center;
|
||||
root.Wrap = YogaWrap.Wrap;
|
||||
root.Width = 700;
|
||||
root.Height = 500;
|
||||
|
||||
YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.FlexGrow = 1;
|
||||
root_child0.FlexShrink = 1;
|
||||
root_child0.FlexBasis = 0.Percent();
|
||||
root_child0.Width = 100;
|
||||
root_child0.Height = 500;
|
||||
root_child0.MaxHeight = 200;
|
||||
root.Insert(0, root_child0);
|
||||
|
||||
YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.FlexGrow = 1;
|
||||
root_child1.FlexShrink = 1;
|
||||
root_child1.FlexBasis = 0.Percent();
|
||||
root_child1.MarginLeft = 20;
|
||||
root_child1.MarginTop = 20;
|
||||
root_child1.MarginRight = 20;
|
||||
root_child1.MarginBottom = 20;
|
||||
root_child1.Width = 200;
|
||||
root_child1.Height = 200;
|
||||
root.Insert(1, root_child1);
|
||||
|
||||
YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.Width = 100;
|
||||
root_child2.Height = 100;
|
||||
root.Insert(2, root_child2);
|
||||
root.StyleDirection = YogaDirection.LTR;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(700f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(300f, root_child0.LayoutX);
|
||||
Assert.AreEqual(0f, root_child0.LayoutY);
|
||||
Assert.AreEqual(100f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(180f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(250f, root_child1.LayoutX);
|
||||
Assert.AreEqual(200f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(180f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(300f, root_child2.LayoutX);
|
||||
Assert.AreEqual(400f, root_child2.LayoutY);
|
||||
Assert.AreEqual(100f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(100f, root_child2.LayoutHeight);
|
||||
|
||||
root.StyleDirection = YogaDirection.RTL;
|
||||
root.CalculateLayout();
|
||||
|
||||
Assert.AreEqual(0f, root.LayoutX);
|
||||
Assert.AreEqual(0f, root.LayoutY);
|
||||
Assert.AreEqual(700f, root.LayoutWidth);
|
||||
Assert.AreEqual(500f, root.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(300f, root_child0.LayoutX);
|
||||
Assert.AreEqual(0f, root_child0.LayoutY);
|
||||
Assert.AreEqual(100f, root_child0.LayoutWidth);
|
||||
Assert.AreEqual(180f, root_child0.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(250f, root_child1.LayoutX);
|
||||
Assert.AreEqual(200f, root_child1.LayoutY);
|
||||
Assert.AreEqual(200f, root_child1.LayoutWidth);
|
||||
Assert.AreEqual(180f, root_child1.LayoutHeight);
|
||||
|
||||
Assert.AreEqual(300f, root_child2.LayoutX);
|
||||
Assert.AreEqual(400f, root_child2.LayoutY);
|
||||
Assert.AreEqual(100f, root_child2.LayoutWidth);
|
||||
Assert.AreEqual(100f, root_child2.LayoutHeight);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -113,3 +113,15 @@
|
||||
<div style="width: 80px; height: 80px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="wrapped_column_max_height" style="height: 500px; width: 700px; flex-direction: column;align-items: center; justify-content: center; align-content: center; flex-wrap:wrap;">
|
||||
<div style="width: 100px; height: 500px; max-height: 200px;"></div>
|
||||
<div style="width: 200px; height: 200px; margin: 20px;"></div>
|
||||
<div style="width: 100px; height: 100px;"></div>
|
||||
</div>
|
||||
|
||||
<div id="wrapped_column_max_height_flex" style="height: 500px; width: 700px; flex-direction: column;align-items: center; justify-content: center; align-content: center; flex-wrap:wrap;">
|
||||
<div style="width: 100px; height: 500px; max-height: 200px; flex: 1;"></div>
|
||||
<div style="width: 200px; height: 200px; margin: 20px; flex: 1"></div>
|
||||
<div style="width: 100px; height: 100px;"></div>
|
||||
</div>
|
||||
@@ -1364,4 +1364,166 @@ public class YGFlexWrapTest {
|
||||
assertEquals(80f, root_child0_child1.getLayoutHeight(), 0.0f);
|
||||
}
|
||||
|
||||
@Test
|
||||
public void test_wrapped_column_max_height() {
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
final YogaNode root = new YogaNode(config);
|
||||
root.setJustifyContent(YogaJustify.CENTER);
|
||||
root.setAlignContent(YogaAlign.CENTER);
|
||||
root.setAlignItems(YogaAlign.CENTER);
|
||||
root.setWrap(YogaWrap.WRAP);
|
||||
root.setWidth(700f);
|
||||
root.setHeight(500f);
|
||||
|
||||
final YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.setWidth(100f);
|
||||
root_child0.setHeight(500f);
|
||||
root_child0.setMaxHeight(200f);
|
||||
root.addChildAt(root_child0, 0);
|
||||
|
||||
final YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.setMargin(YogaEdge.LEFT, 20f);
|
||||
root_child1.setMargin(YogaEdge.TOP, 20f);
|
||||
root_child1.setMargin(YogaEdge.RIGHT, 20f);
|
||||
root_child1.setMargin(YogaEdge.BOTTOM, 20f);
|
||||
root_child1.setWidth(200f);
|
||||
root_child1.setHeight(200f);
|
||||
root.addChildAt(root_child1, 1);
|
||||
|
||||
final YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.setWidth(100f);
|
||||
root_child2.setHeight(100f);
|
||||
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(700f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(250f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(30f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(200f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(200f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(250f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(420f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(200f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(100f, 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(700f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(350f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(30f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(200f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(300f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(250f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(180f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(200f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutHeight(), 0.0f);
|
||||
}
|
||||
|
||||
@Test
|
||||
public void test_wrapped_column_max_height_flex() {
|
||||
YogaConfig config = new YogaConfig();
|
||||
|
||||
final YogaNode root = new YogaNode(config);
|
||||
root.setJustifyContent(YogaJustify.CENTER);
|
||||
root.setAlignContent(YogaAlign.CENTER);
|
||||
root.setAlignItems(YogaAlign.CENTER);
|
||||
root.setWrap(YogaWrap.WRAP);
|
||||
root.setWidth(700f);
|
||||
root.setHeight(500f);
|
||||
|
||||
final YogaNode root_child0 = new YogaNode(config);
|
||||
root_child0.setFlexGrow(1f);
|
||||
root_child0.setFlexShrink(1f);
|
||||
root_child0.setFlexBasisPercent(0f);
|
||||
root_child0.setWidth(100f);
|
||||
root_child0.setHeight(500f);
|
||||
root_child0.setMaxHeight(200f);
|
||||
root.addChildAt(root_child0, 0);
|
||||
|
||||
final YogaNode root_child1 = new YogaNode(config);
|
||||
root_child1.setFlexGrow(1f);
|
||||
root_child1.setFlexShrink(1f);
|
||||
root_child1.setFlexBasisPercent(0f);
|
||||
root_child1.setMargin(YogaEdge.LEFT, 20f);
|
||||
root_child1.setMargin(YogaEdge.TOP, 20f);
|
||||
root_child1.setMargin(YogaEdge.RIGHT, 20f);
|
||||
root_child1.setMargin(YogaEdge.BOTTOM, 20f);
|
||||
root_child1.setWidth(200f);
|
||||
root_child1.setHeight(200f);
|
||||
root.addChildAt(root_child1, 1);
|
||||
|
||||
final YogaNode root_child2 = new YogaNode(config);
|
||||
root_child2.setWidth(100f);
|
||||
root_child2.setHeight(100f);
|
||||
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(700f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(300f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(180f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(250f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(180f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(300f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(400f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(100f, 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(700f, root.getLayoutWidth(), 0.0f);
|
||||
assertEquals(500f, root.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(300f, root_child0.getLayoutX(), 0.0f);
|
||||
assertEquals(0f, root_child0.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
|
||||
assertEquals(180f, root_child0.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(250f, root_child1.getLayoutX(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutY(), 0.0f);
|
||||
assertEquals(200f, root_child1.getLayoutWidth(), 0.0f);
|
||||
assertEquals(180f, root_child1.getLayoutHeight(), 0.0f);
|
||||
|
||||
assertEquals(300f, root_child2.getLayoutX(), 0.0f);
|
||||
assertEquals(400f, root_child2.getLayoutY(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutWidth(), 0.0f);
|
||||
assertEquals(100f, root_child2.getLayoutHeight(), 0.0f);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1423,3 +1423,173 @@ it("wrapped_row_within_align_items_flex_end", function () {
|
||||
config.free();
|
||||
}
|
||||
});
|
||||
it("wrapped_column_max_height", function () {
|
||||
var config = Yoga.Config.create();
|
||||
|
||||
try {
|
||||
var root = Yoga.Node.create(config);
|
||||
root.setJustifyContent(Yoga.JUSTIFY_CENTER);
|
||||
root.setAlignContent(Yoga.ALIGN_CENTER);
|
||||
root.setAlignItems(Yoga.ALIGN_CENTER);
|
||||
root.setFlexWrap(Yoga.WRAP_WRAP);
|
||||
root.setWidth(700);
|
||||
root.setHeight(500);
|
||||
|
||||
var root_child0 = Yoga.Node.create(config);
|
||||
root_child0.setWidth(100);
|
||||
root_child0.setHeight(500);
|
||||
root_child0.setMaxHeight(200);
|
||||
root.insertChild(root_child0, 0);
|
||||
|
||||
var root_child1 = Yoga.Node.create(config);
|
||||
root_child1.setMargin(Yoga.EDGE_LEFT, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_TOP, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_RIGHT, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_BOTTOM, 20);
|
||||
root_child1.setWidth(200);
|
||||
root_child1.setHeight(200);
|
||||
root.insertChild(root_child1, 1);
|
||||
|
||||
var root_child2 = Yoga.Node.create(config);
|
||||
root_child2.setWidth(100);
|
||||
root_child2.setHeight(100);
|
||||
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(700 === root.getComputedWidth(), "700 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
|
||||
|
||||
console.assert(250 === root_child0.getComputedLeft(), "250 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
|
||||
console.assert(30 === root_child0.getComputedTop(), "30 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
|
||||
console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
|
||||
console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(200 === root_child1.getComputedLeft(), "200 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(250 === root_child1.getComputedTop(), "250 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(420 === root_child2.getComputedLeft(), "420 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(200 === root_child2.getComputedTop(), "200 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(100 === root_child2.getComputedWidth(), "100 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(100 === root_child2.getComputedHeight(), "100 === 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(700 === root.getComputedWidth(), "700 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
|
||||
|
||||
console.assert(350 === root_child0.getComputedLeft(), "350 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
|
||||
console.assert(30 === root_child0.getComputedTop(), "30 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
|
||||
console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
|
||||
console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(300 === root_child1.getComputedLeft(), "300 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(250 === root_child1.getComputedTop(), "250 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(180 === root_child2.getComputedLeft(), "180 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(200 === root_child2.getComputedTop(), "200 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(100 === root_child2.getComputedWidth(), "100 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(100 === root_child2.getComputedHeight(), "100 === root_child2.getComputedHeight() (" + root_child2.getComputedHeight() + ")");
|
||||
} finally {
|
||||
if (typeof root !== "undefined") {
|
||||
root.freeRecursive();
|
||||
}
|
||||
|
||||
config.free();
|
||||
}
|
||||
});
|
||||
it("wrapped_column_max_height_flex", function () {
|
||||
var config = Yoga.Config.create();
|
||||
|
||||
try {
|
||||
var root = Yoga.Node.create(config);
|
||||
root.setJustifyContent(Yoga.JUSTIFY_CENTER);
|
||||
root.setAlignContent(Yoga.ALIGN_CENTER);
|
||||
root.setAlignItems(Yoga.ALIGN_CENTER);
|
||||
root.setFlexWrap(Yoga.WRAP_WRAP);
|
||||
root.setWidth(700);
|
||||
root.setHeight(500);
|
||||
|
||||
var root_child0 = Yoga.Node.create(config);
|
||||
root_child0.setFlexGrow(1);
|
||||
root_child0.setFlexShrink(1);
|
||||
root_child0.setFlexBasis("0%");
|
||||
root_child0.setWidth(100);
|
||||
root_child0.setHeight(500);
|
||||
root_child0.setMaxHeight(200);
|
||||
root.insertChild(root_child0, 0);
|
||||
|
||||
var root_child1 = Yoga.Node.create(config);
|
||||
root_child1.setFlexGrow(1);
|
||||
root_child1.setFlexShrink(1);
|
||||
root_child1.setFlexBasis("0%");
|
||||
root_child1.setMargin(Yoga.EDGE_LEFT, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_TOP, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_RIGHT, 20);
|
||||
root_child1.setMargin(Yoga.EDGE_BOTTOM, 20);
|
||||
root_child1.setWidth(200);
|
||||
root_child1.setHeight(200);
|
||||
root.insertChild(root_child1, 1);
|
||||
|
||||
var root_child2 = Yoga.Node.create(config);
|
||||
root_child2.setWidth(100);
|
||||
root_child2.setHeight(100);
|
||||
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(700 === root.getComputedWidth(), "700 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
|
||||
|
||||
console.assert(300 === root_child0.getComputedLeft(), "300 === 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(180 === root_child0.getComputedHeight(), "180 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(250 === root_child1.getComputedLeft(), "250 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(200 === root_child1.getComputedTop(), "200 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(180 === root_child1.getComputedHeight(), "180 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(300 === root_child2.getComputedLeft(), "300 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(400 === root_child2.getComputedTop(), "400 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(100 === root_child2.getComputedWidth(), "100 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(100 === root_child2.getComputedHeight(), "100 === 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(700 === root.getComputedWidth(), "700 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
|
||||
console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
|
||||
|
||||
console.assert(300 === root_child0.getComputedLeft(), "300 === 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(180 === root_child0.getComputedHeight(), "180 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
|
||||
|
||||
console.assert(250 === root_child1.getComputedLeft(), "250 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
|
||||
console.assert(200 === root_child1.getComputedTop(), "200 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
|
||||
console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
|
||||
console.assert(180 === root_child1.getComputedHeight(), "180 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
|
||||
|
||||
console.assert(300 === root_child2.getComputedLeft(), "300 === root_child2.getComputedLeft() (" + root_child2.getComputedLeft() + ")");
|
||||
console.assert(400 === root_child2.getComputedTop(), "400 === root_child2.getComputedTop() (" + root_child2.getComputedTop() + ")");
|
||||
console.assert(100 === root_child2.getComputedWidth(), "100 === root_child2.getComputedWidth() (" + root_child2.getComputedWidth() + ")");
|
||||
console.assert(100 === root_child2.getComputedHeight(), "100 === root_child2.getComputedHeight() (" + root_child2.getComputedHeight() + ")");
|
||||
} finally {
|
||||
if (typeof root !== "undefined") {
|
||||
root.freeRecursive();
|
||||
}
|
||||
|
||||
config.free();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1375,3 +1375,167 @@ TEST(YogaTest, wrapped_row_within_align_items_flex_end) {
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, wrapped_column_max_height) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
const YGNodeRef root = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetJustifyContent(root, YGJustifyCenter);
|
||||
YGNodeStyleSetAlignContent(root, YGAlignCenter);
|
||||
YGNodeStyleSetAlignItems(root, YGAlignCenter);
|
||||
YGNodeStyleSetFlexWrap(root, YGWrapWrap);
|
||||
YGNodeStyleSetWidth(root, 700);
|
||||
YGNodeStyleSetHeight(root, 500);
|
||||
|
||||
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child0, 100);
|
||||
YGNodeStyleSetHeight(root_child0, 500);
|
||||
YGNodeStyleSetMaxHeight(root_child0, 200);
|
||||
YGNodeInsertChild(root, root_child0, 0);
|
||||
|
||||
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeLeft, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeTop, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeRight, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeBottom, 20);
|
||||
YGNodeStyleSetWidth(root_child1, 200);
|
||||
YGNodeStyleSetHeight(root_child1, 200);
|
||||
YGNodeInsertChild(root, root_child1, 1);
|
||||
|
||||
const YGNodeRef root_child2 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child2, 100);
|
||||
YGNodeStyleSetHeight(root_child2, 100);
|
||||
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(700, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(250, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(250, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(420, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
|
||||
ASSERT_FLOAT_EQ(700, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(350, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(300, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(250, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(180, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeFreeRecursive(root);
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, wrapped_column_max_height_flex) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
const YGNodeRef root = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetJustifyContent(root, YGJustifyCenter);
|
||||
YGNodeStyleSetAlignContent(root, YGAlignCenter);
|
||||
YGNodeStyleSetAlignItems(root, YGAlignCenter);
|
||||
YGNodeStyleSetFlexWrap(root, YGWrapWrap);
|
||||
YGNodeStyleSetWidth(root, 700);
|
||||
YGNodeStyleSetHeight(root, 500);
|
||||
|
||||
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexGrow(root_child0, 1);
|
||||
YGNodeStyleSetFlexShrink(root_child0, 1);
|
||||
YGNodeStyleSetFlexBasisPercent(root_child0, 0);
|
||||
YGNodeStyleSetWidth(root_child0, 100);
|
||||
YGNodeStyleSetHeight(root_child0, 500);
|
||||
YGNodeStyleSetMaxHeight(root_child0, 200);
|
||||
YGNodeInsertChild(root, root_child0, 0);
|
||||
|
||||
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexGrow(root_child1, 1);
|
||||
YGNodeStyleSetFlexShrink(root_child1, 1);
|
||||
YGNodeStyleSetFlexBasisPercent(root_child1, 0);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeLeft, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeTop, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeRight, 20);
|
||||
YGNodeStyleSetMargin(root_child1, YGEdgeBottom, 20);
|
||||
YGNodeStyleSetWidth(root_child1, 200);
|
||||
YGNodeStyleSetHeight(root_child1, 200);
|
||||
YGNodeInsertChild(root, root_child1, 1);
|
||||
|
||||
const YGNodeRef root_child2 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child2, 100);
|
||||
YGNodeStyleSetHeight(root_child2, 100);
|
||||
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(700, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(300, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(180, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(250, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(180, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(300, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(400, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
|
||||
ASSERT_FLOAT_EQ(700, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(500, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(300, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(180, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(250, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(200, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(180, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(300, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(400, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeFreeRecursive(root);
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
18
yoga/Yoga.c
18
yoga/Yoga.c
@@ -2141,23 +2141,29 @@ static void YGNodelayoutImpl(const YGNodeRef node,
|
||||
|
||||
if (child->style.positionType != YGPositionTypeAbsolute) {
|
||||
const float childMarginMainAxis = YGNodeMarginForAxis(child, mainAxis, availableInnerWidth);
|
||||
const float outerFlexBasis =
|
||||
const float flexBasisWithMaxConstraints =
|
||||
fminf(YGResolveValue(&child->style.maxDimensions[dim[mainAxis]], mainAxisParentSize),
|
||||
fmaxf(YGResolveValue(&child->style.minDimensions[dim[mainAxis]],
|
||||
mainAxisParentSize),
|
||||
child->layout.computedFlexBasis));
|
||||
const float flexBasisWithMinAndMaxConstraints =
|
||||
fmaxf(YGResolveValue(&child->style.minDimensions[dim[mainAxis]], mainAxisParentSize),
|
||||
child->layout.computedFlexBasis) +
|
||||
childMarginMainAxis;
|
||||
flexBasisWithMaxConstraints);
|
||||
|
||||
// If this is a multi-line flow and this item pushes us over the
|
||||
// available size, we've
|
||||
// hit the end of the current line. Break out of the loop and lay out
|
||||
// the current line.
|
||||
if (sizeConsumedOnCurrentLineIncludingMinConstraint + outerFlexBasis >
|
||||
if (sizeConsumedOnCurrentLineIncludingMinConstraint + flexBasisWithMinAndMaxConstraints +
|
||||
childMarginMainAxis >
|
||||
availableInnerMainDim &&
|
||||
isNodeFlexWrap && itemsOnLine > 0) {
|
||||
break;
|
||||
}
|
||||
|
||||
sizeConsumedOnCurrentLineIncludingMinConstraint += outerFlexBasis;
|
||||
sizeConsumedOnCurrentLine += child->layout.computedFlexBasis + childMarginMainAxis;
|
||||
sizeConsumedOnCurrentLineIncludingMinConstraint +=
|
||||
flexBasisWithMinAndMaxConstraints + childMarginMainAxis;
|
||||
sizeConsumedOnCurrentLine += flexBasisWithMaxConstraints + childMarginMainAxis;
|
||||
itemsOnLine++;
|
||||
|
||||
if (YGNodeIsFlex(child)) {
|
||||
|
||||
Reference in New Issue
Block a user