adjusted text and fixed alignment on column/row direction difference

This commit is contained in:
Lukas Woehrl
2017-01-05 17:33:49 +01:00
parent d10d050a2e
commit e87edbf206
5 changed files with 101 additions and 81 deletions

View File

@@ -786,22 +786,22 @@ namespace Facebook.Yoga
root.Insert(0, root_child0);
YogaNode root_child1 = new YogaNode();
root_child1.Width = 50;
root_child1.Width = 30;
root_child1.Height = 50;
root.Insert(1, root_child1);
YogaNode root_child1_child0 = new YogaNode();
root_child1_child0.Width = 50;
root_child1_child0.Height = 10;
root_child1_child0.Width = 20;
root_child1_child0.Height = 20;
root_child1.Insert(0, root_child1_child0);
YogaNode root_child2 = new YogaNode();
root_child2.Width = 50;
root_child2.Height = 20;
root_child2.Width = 40;
root_child2.Height = 70;
root.Insert(2, root_child2);
YogaNode root_child2_child0 = new YogaNode();
root_child2_child0.Width = 50;
root_child2_child0.Width = 10;
root_child2_child0.Height = 10;
root_child2.Insert(0, root_child2_child0);
@@ -824,26 +824,26 @@ namespace Facebook.Yoga
Assert.AreEqual(0f, root_child1.LayoutX);
Assert.AreEqual(50f, root_child1.LayoutY);
Assert.AreEqual(50f, root_child1.LayoutWidth);
Assert.AreEqual(30f, root_child1.LayoutWidth);
Assert.AreEqual(50f, root_child1.LayoutHeight);
Assert.AreEqual(0f, root_child1_child0.LayoutX);
Assert.AreEqual(0f, root_child1_child0.LayoutY);
Assert.AreEqual(50f, root_child1_child0.LayoutWidth);
Assert.AreEqual(10f, root_child1_child0.LayoutHeight);
Assert.AreEqual(20f, root_child1_child0.LayoutWidth);
Assert.AreEqual(20f, root_child1_child0.LayoutHeight);
Assert.AreEqual(50f, root_child2.LayoutX);
Assert.AreEqual(0f, root_child2.LayoutY);
Assert.AreEqual(50f, root_child2.LayoutWidth);
Assert.AreEqual(20f, root_child2.LayoutHeight);
Assert.AreEqual(40f, root_child2.LayoutWidth);
Assert.AreEqual(70f, root_child2.LayoutHeight);
Assert.AreEqual(0f, root_child2_child0.LayoutX);
Assert.AreEqual(0f, root_child2_child0.LayoutY);
Assert.AreEqual(50f, root_child2_child0.LayoutWidth);
Assert.AreEqual(10f, root_child2_child0.LayoutWidth);
Assert.AreEqual(10f, root_child2_child0.LayoutHeight);
Assert.AreEqual(50f, root_child3.LayoutX);
Assert.AreEqual(20f, root_child3.LayoutY);
Assert.AreEqual(70f, root_child3.LayoutY);
Assert.AreEqual(50f, root_child3.LayoutWidth);
Assert.AreEqual(20f, root_child3.LayoutHeight);
@@ -860,28 +860,28 @@ namespace Facebook.Yoga
Assert.AreEqual(50f, root_child0.LayoutWidth);
Assert.AreEqual(50f, root_child0.LayoutHeight);
Assert.AreEqual(50f, root_child1.LayoutX);
Assert.AreEqual(70f, root_child1.LayoutX);
Assert.AreEqual(50f, root_child1.LayoutY);
Assert.AreEqual(50f, root_child1.LayoutWidth);
Assert.AreEqual(30f, root_child1.LayoutWidth);
Assert.AreEqual(50f, root_child1.LayoutHeight);
Assert.AreEqual(0f, root_child1_child0.LayoutX);
Assert.AreEqual(10f, root_child1_child0.LayoutX);
Assert.AreEqual(0f, root_child1_child0.LayoutY);
Assert.AreEqual(50f, root_child1_child0.LayoutWidth);
Assert.AreEqual(10f, root_child1_child0.LayoutHeight);
Assert.AreEqual(20f, root_child1_child0.LayoutWidth);
Assert.AreEqual(20f, root_child1_child0.LayoutHeight);
Assert.AreEqual(0f, root_child2.LayoutX);
Assert.AreEqual(10f, root_child2.LayoutX);
Assert.AreEqual(0f, root_child2.LayoutY);
Assert.AreEqual(50f, root_child2.LayoutWidth);
Assert.AreEqual(20f, root_child2.LayoutHeight);
Assert.AreEqual(40f, root_child2.LayoutWidth);
Assert.AreEqual(70f, root_child2.LayoutHeight);
Assert.AreEqual(0f, root_child2_child0.LayoutX);
Assert.AreEqual(30f, root_child2_child0.LayoutX);
Assert.AreEqual(0f, root_child2_child0.LayoutY);
Assert.AreEqual(50f, root_child2_child0.LayoutWidth);
Assert.AreEqual(10f, root_child2_child0.LayoutWidth);
Assert.AreEqual(10f, root_child2_child0.LayoutHeight);
Assert.AreEqual(0f, root_child3.LayoutX);
Assert.AreEqual(20f, root_child3.LayoutY);
Assert.AreEqual(70f, root_child3.LayoutY);
Assert.AreEqual(50f, root_child3.LayoutWidth);
Assert.AreEqual(20f, root_child3.LayoutHeight);
}

View File

@@ -75,11 +75,11 @@
<div id="align_baseline_multiline_column" style="width: 100px; height: 100px; flex-direction:column; align-items: baseline;flex-wrap:wrap;">
<div style="width: 50px; height: 50px;"></div>
<div style="width: 50px; height: 50px;">
<div style="width: 50px; height: 10px;"></div>
<div style="width: 30px; height: 50px;">
<div style="width: 20px; height: 20px;"></div>
</div>
<div style="width: 50px; height: 20px;">
<div style="width: 50px; height: 10px;"></div>
<div style="width: 40px; height: 70px;">
<div style="width: 10px; height: 10px;"></div>
</div>
<div style="width: 50px; height: 20px;"></div>
</div>

View File

@@ -772,22 +772,22 @@ public class YGAlignItemsTest {
root.addChildAt(root_child0, 0);
final YogaNode root_child1 = new YogaNode();
root_child1.setWidth(50f);
root_child1.setWidth(30f);
root_child1.setHeight(50f);
root.addChildAt(root_child1, 1);
final YogaNode root_child1_child0 = new YogaNode();
root_child1_child0.setWidth(50f);
root_child1_child0.setHeight(10f);
root_child1_child0.setWidth(20f);
root_child1_child0.setHeight(20f);
root_child1.addChildAt(root_child1_child0, 0);
final YogaNode root_child2 = new YogaNode();
root_child2.setWidth(50f);
root_child2.setHeight(20f);
root_child2.setWidth(40f);
root_child2.setHeight(70f);
root.addChildAt(root_child2, 2);
final YogaNode root_child2_child0 = new YogaNode();
root_child2_child0.setWidth(50f);
root_child2_child0.setWidth(10f);
root_child2_child0.setHeight(10f);
root_child2.addChildAt(root_child2_child0, 0);
@@ -810,26 +810,26 @@ public class YGAlignItemsTest {
assertEquals(0f, root_child1.getLayoutX(), 0.0f);
assertEquals(50f, root_child1.getLayoutY(), 0.0f);
assertEquals(50f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(30f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child1.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child1_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child1_child0.getLayoutY(), 0.0f);
assertEquals(50f, root_child1_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child1_child0.getLayoutHeight(), 0.0f);
assertEquals(20f, root_child1_child0.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child1_child0.getLayoutHeight(), 0.0f);
assertEquals(50f, root_child2.getLayoutX(), 0.0f);
assertEquals(0f, root_child2.getLayoutY(), 0.0f);
assertEquals(50f, root_child2.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child2.getLayoutHeight(), 0.0f);
assertEquals(40f, root_child2.getLayoutWidth(), 0.0f);
assertEquals(70f, root_child2.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child2_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child2_child0.getLayoutY(), 0.0f);
assertEquals(50f, root_child2_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child2_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child2_child0.getLayoutHeight(), 0.0f);
assertEquals(50f, root_child3.getLayoutX(), 0.0f);
assertEquals(20f, root_child3.getLayoutY(), 0.0f);
assertEquals(70f, root_child3.getLayoutY(), 0.0f);
assertEquals(50f, root_child3.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child3.getLayoutHeight(), 0.0f);
@@ -846,28 +846,28 @@ public class YGAlignItemsTest {
assertEquals(50f, root_child0.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child0.getLayoutHeight(), 0.0f);
assertEquals(50f, root_child1.getLayoutX(), 0.0f);
assertEquals(70f, root_child1.getLayoutX(), 0.0f);
assertEquals(50f, root_child1.getLayoutY(), 0.0f);
assertEquals(50f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(30f, root_child1.getLayoutWidth(), 0.0f);
assertEquals(50f, root_child1.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child1_child0.getLayoutX(), 0.0f);
assertEquals(10f, root_child1_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child1_child0.getLayoutY(), 0.0f);
assertEquals(50f, root_child1_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child1_child0.getLayoutHeight(), 0.0f);
assertEquals(20f, root_child1_child0.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child1_child0.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child2.getLayoutX(), 0.0f);
assertEquals(10f, root_child2.getLayoutX(), 0.0f);
assertEquals(0f, root_child2.getLayoutY(), 0.0f);
assertEquals(50f, root_child2.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child2.getLayoutHeight(), 0.0f);
assertEquals(40f, root_child2.getLayoutWidth(), 0.0f);
assertEquals(70f, root_child2.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child2_child0.getLayoutX(), 0.0f);
assertEquals(30f, root_child2_child0.getLayoutX(), 0.0f);
assertEquals(0f, root_child2_child0.getLayoutY(), 0.0f);
assertEquals(50f, root_child2_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child2_child0.getLayoutWidth(), 0.0f);
assertEquals(10f, root_child2_child0.getLayoutHeight(), 0.0f);
assertEquals(0f, root_child3.getLayoutX(), 0.0f);
assertEquals(20f, root_child3.getLayoutY(), 0.0f);
assertEquals(70f, root_child3.getLayoutY(), 0.0f);
assertEquals(50f, root_child3.getLayoutWidth(), 0.0f);
assertEquals(20f, root_child3.getLayoutHeight(), 0.0f);
}

View File

@@ -755,22 +755,22 @@ TEST(YogaTest, align_baseline_multiline_column) {
YGNodeInsertChild(root, root_child0, 0);
const YGNodeRef root_child1 = YGNodeNew();
YGNodeStyleSetWidth(root_child1, 50);
YGNodeStyleSetWidth(root_child1, 30);
YGNodeStyleSetHeight(root_child1, 50);
YGNodeInsertChild(root, root_child1, 1);
const YGNodeRef root_child1_child0 = YGNodeNew();
YGNodeStyleSetWidth(root_child1_child0, 50);
YGNodeStyleSetHeight(root_child1_child0, 10);
YGNodeStyleSetWidth(root_child1_child0, 20);
YGNodeStyleSetHeight(root_child1_child0, 20);
YGNodeInsertChild(root_child1, root_child1_child0, 0);
const YGNodeRef root_child2 = YGNodeNew();
YGNodeStyleSetWidth(root_child2, 50);
YGNodeStyleSetHeight(root_child2, 20);
YGNodeStyleSetWidth(root_child2, 40);
YGNodeStyleSetHeight(root_child2, 70);
YGNodeInsertChild(root, root_child2, 2);
const YGNodeRef root_child2_child0 = YGNodeNew();
YGNodeStyleSetWidth(root_child2_child0, 50);
YGNodeStyleSetWidth(root_child2_child0, 10);
YGNodeStyleSetHeight(root_child2_child0, 10);
YGNodeInsertChild(root_child2, root_child2_child0, 0);
@@ -792,26 +792,26 @@ TEST(YogaTest, align_baseline_multiline_column) {
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetTop(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child1));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child1_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child1_child0));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1_child0));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child1_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetLeft(root_child2));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child2));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child2));
ASSERT_FLOAT_EQ(40, YGNodeLayoutGetWidth(root_child2));
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetHeight(root_child2));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child2_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child2_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child2_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetLeft(root_child3));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetTop(root_child3));
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetTop(root_child3));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child3));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child3));
@@ -827,28 +827,28 @@ TEST(YogaTest, align_baseline_multiline_column) {
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetLeft(root_child1));
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetLeft(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetTop(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetWidth(root_child1));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetHeight(root_child1));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetLeft(root_child1_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child1_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child1_child0));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1_child0));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child1_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetLeft(root_child2));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child2));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child2));
ASSERT_FLOAT_EQ(40, YGNodeLayoutGetWidth(root_child2));
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetHeight(root_child2));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2_child0));
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetLeft(root_child2_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2_child0));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child2_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child2_child0));
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child2_child0));
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child3));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetTop(root_child3));
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetTop(root_child3));
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetWidth(root_child3));
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child3));

View File

@@ -938,7 +938,14 @@ static inline float YGNodePaddingAndBorderForAxis(const YGNodeRef node,
}
static inline YGAlign YGNodeAlignItem(const YGNodeRef node, const YGNodeRef child) {
return child->style.alignSelf == YGAlignAuto ? node->style.alignItems : child->style.alignSelf;
YGAlign align =
child->style.alignSelf == YGAlignAuto ? node->style.alignItems : child->style.alignSelf;
if (align == YGAlignBaseline &&
YGFlexDirectionIsRow(node->style.flexDirection) ==
YGFlexDirectionIsRow(child->style.flexDirection)) {
return YGAlignFlexStart;
}
return align;
}
static inline YGDirection YGNodeResolveDirection(const YGNodeRef node,
@@ -950,7 +957,9 @@ static inline YGDirection YGNodeResolveDirection(const YGNodeRef node,
}
}
static float YGBaseline(const YGNodeRef node, const YGFlexDirection crossAxis) {
static float YGBaseline(const YGNodeRef node,
const YGFlexDirection crossAxis,
const YGFlexDirection mainAxis) {
if (node->baseline != NULL) {
const float baseline = node->baseline(node);
if (YGFloatIsUndefined(baseline)) {
@@ -979,7 +988,18 @@ static float YGBaseline(const YGNodeRef node, const YGFlexDirection crossAxis) {
if (baselineChild == NULL) {
return node->layout.measuredDimensions[dim[crossAxis]];
}
const float baseline = YGBaseline(baselineChild, crossAxis);
float baseline = YGUndefined;
if (YGFlexDirectionIsRow(node->style.flexDirection) &&
YGFlexDirectionIsColumn(baselineChild->style.flexDirection)) {
baseline = baselineChild->layout.measuredDimensions[dim[crossAxis]];
} else if (YGFlexDirectionIsColumn(node->style.flexDirection) &&
YGFlexDirectionIsRow(baselineChild->style.flexDirection)) {
baseline = baselineChild->layout.measuredDimensions[dim[mainAxis]];
} else {
baseline = YGBaseline(baselineChild, crossAxis, mainAxis);
}
return baseline + baselineChild->layout.position[pos[crossAxis]];
}
@@ -2524,7 +2544,7 @@ static void YGNodelayoutImpl(const YGNodeRef node,
YGNodeMarginForAxis(child, crossAxis, availableInnerWidth));
}
if (YGNodeAlignItem(node, child) == YGAlignBaseline) {
const float ascent = YGBaseline(child, crossAxis) +
const float ascent = YGBaseline(child, crossAxis, mainAxis) +
YGNodeLeadingMargin(child, crossAxis, availableInnerWidth);
const float descent = child->layout.measuredDimensions[dim[crossAxis]] +
YGNodeMarginForAxis(child, crossAxis, availableInnerWidth) -
@@ -2571,7 +2591,7 @@ static void YGNodelayoutImpl(const YGNodeRef node,
}
case YGAlignBaseline: {
child->layout.position[pos[crossAxis]] =
currentLead + maxAscentForCurrentLine - YGBaseline(child, crossAxis) +
currentLead + maxAscentForCurrentLine - YGBaseline(child, crossAxis, mainAxis) +
YGNodeLeadingPosition(child, crossAxis, availableInnerCrossDim);
break;
}