Child nodes shrink when parent node move across an axis #683

New Issue

2017-12-09T12:13:40-08:00

jmaurice-unity commented

2017-12-09 12:13:40 -08:00

(Migrated from github.com)

Report

I have searched existing issues and this is not a duplicate

Issues and Steps to Reproduce

Child nodes get smaller and smaller on every layout calculation when the parent node is moving across an axis or positioned along the axis.

The 2 test cases below reproduce the issue, notice that when the tests fail the leaf node is smaller by 10.

TEST(YogaTest, leaf_node_width_shrink_on_axis)
{
  const YGConfigRef config = YGConfigNew();

  const YGNodeRef root = YGNodeNewWithConfig(config);
  const YGNodeRef top = YGNodeNewWithConfig(config);
  // Happen with absolute position as well
  //YGNodeStyleSetPositionType(top, YGPositionTypeAbsolute);

  const YGNodeRef mid = YGNodeNewWithConfig(config);

  const YGNodeRef leaf = YGNodeNewWithConfig(config);
  YGNodeStyleSetWidth(leaf, 100);
  YGNodeStyleSetHeight(leaf, 100);

  YGNodeInsertChild(mid, leaf, 0);
  YGNodeInsertChild(top, mid, 0);
  YGNodeInsertChild(root, top, 0);

  YGNodeStyleSetPosition(top, YGEdgeLeft, 5);
  YGNodeStyleSetPosition(top, YGEdgeTop, 5);

  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

  for (int i = 0; i < 100; i++)
  {
    float pos = YGNodeLayoutGetLeft(top);
    // Moving top container by float values > 1.5 and < 2.0 will eventually shrink the child node!
    // Everything seems fine when moving by integer or values that are rounded downward.
    // The shrink start when the top node x position gets negative.
    float newPos = pos - 1.75f;
    YGNodeStyleSetPosition(top, YGEdgeLeft, newPos);
    YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

    // This will eventually get smaller and smaller.
    // The shrinking of the leaf stop when the top node has crossed the y axis completely
    ASSERT_GT(YGNodeLayoutGetWidth(leaf), 90);
  }

  YGNodeFreeRecursive(root);

  YGConfigFree(config);
}

// Same test as above but moving along the y axis
TEST(YogaTest, leaf_node_height_shrink_on_axis)
{
  const YGConfigRef config = YGConfigNew();

  const YGNodeRef root = YGNodeNewWithConfig(config);
  const YGNodeRef top = YGNodeNewWithConfig(config);
  const YGNodeRef mid = YGNodeNewWithConfig(config);

  const YGNodeRef leaf = YGNodeNewWithConfig(config);
  YGNodeStyleSetWidth(leaf, 100);
  YGNodeStyleSetHeight(leaf, 100);

  YGNodeInsertChild(mid, leaf, 0);
  YGNodeInsertChild(top, mid, 0);
  YGNodeInsertChild(root, top, 0);

  YGNodeStyleSetPosition(top, YGEdgeLeft, 5);
  YGNodeStyleSetPosition(top, YGEdgeTop, 5);

  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

  for (int i = 0; i < 100; i++)
  {
    float pos = YGNodeLayoutGetTop(top);
    float newPos = pos - 1.8f;
    YGNodeStyleSetPosition(top, YGEdgeTop, newPos);
    YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);

    ASSERT_GT(YGNodeLayoutGetHeight(leaf), 90);
  }

  YGNodeFreeRecursive(root);

  YGConfigFree(config);
}

Expected Behavior

The width and height of the child node do not change when moving the top parent node.

Actual Behavior

Child nodes keep shrinking until they don't have any width and/or height.

# Report - [x] I have searched [existing issues](https://github.com/facebook/yoga/issues) and this is not a duplicate # Issues and Steps to Reproduce Child nodes get smaller and smaller on every layout calculation when the parent node is moving across an axis or positioned along the axis. ![shrink](https://user-images.githubusercontent.com/30119574/33799128-4df9ce76-dcf3-11e7-8137-bc15ed53a149.gif) The 2 test cases below reproduce the issue, notice that when the tests fail the leaf node is smaller by 10. ``` TEST(YogaTest, leaf_node_width_shrink_on_axis) { const YGConfigRef config = YGConfigNew(); const YGNodeRef root = YGNodeNewWithConfig(config); const YGNodeRef top = YGNodeNewWithConfig(config); // Happen with absolute position as well //YGNodeStyleSetPositionType(top, YGPositionTypeAbsolute); const YGNodeRef mid = YGNodeNewWithConfig(config); const YGNodeRef leaf = YGNodeNewWithConfig(config); YGNodeStyleSetWidth(leaf, 100); YGNodeStyleSetHeight(leaf, 100); YGNodeInsertChild(mid, leaf, 0); YGNodeInsertChild(top, mid, 0); YGNodeInsertChild(root, top, 0); YGNodeStyleSetPosition(top, YGEdgeLeft, 5); YGNodeStyleSetPosition(top, YGEdgeTop, 5); YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR); for (int i = 0; i < 100; i++) { float pos = YGNodeLayoutGetLeft(top); // Moving top container by float values > 1.5 and < 2.0 will eventually shrink the child node! // Everything seems fine when moving by integer or values that are rounded downward. // The shrink start when the top node x position gets negative. float newPos = pos - 1.75f; YGNodeStyleSetPosition(top, YGEdgeLeft, newPos); YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR); // This will eventually get smaller and smaller. // The shrinking of the leaf stop when the top node has crossed the y axis completely ASSERT_GT(YGNodeLayoutGetWidth(leaf), 90); } YGNodeFreeRecursive(root); YGConfigFree(config); } // Same test as above but moving along the y axis TEST(YogaTest, leaf_node_height_shrink_on_axis) { const YGConfigRef config = YGConfigNew(); const YGNodeRef root = YGNodeNewWithConfig(config); const YGNodeRef top = YGNodeNewWithConfig(config); const YGNodeRef mid = YGNodeNewWithConfig(config); const YGNodeRef leaf = YGNodeNewWithConfig(config); YGNodeStyleSetWidth(leaf, 100); YGNodeStyleSetHeight(leaf, 100); YGNodeInsertChild(mid, leaf, 0); YGNodeInsertChild(top, mid, 0); YGNodeInsertChild(root, top, 0); YGNodeStyleSetPosition(top, YGEdgeLeft, 5); YGNodeStyleSetPosition(top, YGEdgeTop, 5); YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR); for (int i = 0; i < 100; i++) { float pos = YGNodeLayoutGetTop(top); float newPos = pos - 1.8f; YGNodeStyleSetPosition(top, YGEdgeTop, newPos); YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR); ASSERT_GT(YGNodeLayoutGetHeight(leaf), 90); } YGNodeFreeRecursive(root); YGConfigFree(config); } ``` # Expected Behavior The width and height of the child node do not change when moving the top parent node. # Actual Behavior Child nodes keep shrinking until they don't have any width and/or height.

👍 1

jmaurice-unity commented

2017-12-19 09:21:36 -08:00

(Migrated from github.com)

Created pull request here : https://github.com/facebook/yoga/pull/688