fix: remove gap if its last element in line (fix flex gap extra spacing when children determine parents main axis size) (#1188)
Summary: Fixes - https://github.com/facebook/react-native/issues/35553 ## Approach We're using `betweenMainDim` to add [gap between](bbeede82d3/yoga/Yoga.cpp (L2495)
) items in main axis. This is resulting in increased [main axis](bbeede82d3/yoga/Yoga.cpp (L2598)
) dimension of the container as it gets added even for the last element. One solution is to keep using it and subtract the gap when last element is reached. ## Aside Mutating this value feels weird, but I think `betweenMainDim` gets initialized for every line so should be fine? I did some manual tests to verify. I tried running tests but I'll have to downgrade the java version. Let me know if anything fails. Thanks! 🙏 Pull Request resolved: https://github.com/facebook/yoga/pull/1188 Test Plan: Added fixtures which previously failed but now pass. Reviewed By: necolas Differential Revision: D42078162 Pulled By: NickGerleman fbshipit-source-id: 0e535618350422e001141a8786a83fc81651afe9
This commit is contained in:
committed by
Facebook GitHub Bot
parent
35f3335efc
commit
ba27f9d1ec
@@ -1593,6 +1593,74 @@ TEST(YogaTest, column_gap_wrap_align_stretch) {
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, column_gap_determines_parent_width) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
const YGNodeRef root = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetFlexDirection(root, YGFlexDirectionRow);
|
||||
YGNodeStyleSetHeight(root, 100);
|
||||
YGNodeStyleSetGap(root, YGGutterColumn, 10);
|
||||
|
||||
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child0, 10);
|
||||
YGNodeInsertChild(root, root_child0, 0);
|
||||
|
||||
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child1, 20);
|
||||
YGNodeInsertChild(root, root_child1, 1);
|
||||
|
||||
const YGNodeRef root_child2 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root_child2, 30);
|
||||
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(80, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(30, 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(80, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root));
|
||||
|
||||
ASSERT_FLOAT_EQ(70, YGNodeLayoutGetLeft(root_child0));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
|
||||
ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child0));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(40, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeFreeRecursive(root);
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, row_gap_align_items_stretch) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
@@ -1976,3 +2044,70 @@ TEST(YogaTest, row_gap_row_wrap_child_margins) {
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
||||
TEST(YogaTest, row_gap_determines_parent_height) {
|
||||
const YGConfigRef config = YGConfigNew();
|
||||
|
||||
const YGNodeRef root = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetWidth(root, 100);
|
||||
YGNodeStyleSetGap(root, YGGutterRow, 10);
|
||||
|
||||
const YGNodeRef root_child0 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetHeight(root_child0, 10);
|
||||
YGNodeInsertChild(root, root_child0, 0);
|
||||
|
||||
const YGNodeRef root_child1 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetHeight(root_child1, 20);
|
||||
YGNodeInsertChild(root, root_child1, 1);
|
||||
|
||||
const YGNodeRef root_child2 = YGNodeNewWithConfig(config);
|
||||
YGNodeStyleSetHeight(root_child2, 30);
|
||||
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(100, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(80, 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(10, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root));
|
||||
ASSERT_FLOAT_EQ(80, 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(10, YGNodeLayoutGetHeight(root_child0));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetTop(root_child1));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child1));
|
||||
ASSERT_FLOAT_EQ(20, YGNodeLayoutGetHeight(root_child1));
|
||||
|
||||
ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child2));
|
||||
ASSERT_FLOAT_EQ(50, YGNodeLayoutGetTop(root_child2));
|
||||
ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child2));
|
||||
ASSERT_FLOAT_EQ(30, YGNodeLayoutGetHeight(root_child2));
|
||||
|
||||
YGNodeFreeRecursive(root);
|
||||
|
||||
YGConfigFree(config);
|
||||
}
|
||||
|
Reference in New Issue
Block a user