Layout bug caused by floating point rounding error

[leafduo]

Report

• I have searched existing issues and this is not a duplicate

Issues and Steps to Reproduce

• Layout multiple layers of views, and put a label as leaf node.
• Run it in a 3x resolution screen, like iPhone X or one of the Plus models.

Expected Behavior

The text on the label should be displayed without problem

Actual Behavior

The text got truncated.

Link to Code

Example project to reproduce the issue https://github.com/leafduo/yoga-rounding

The problem was caused by the accumulation of floating point rounding error in complex layout. The view tree in the example has a height of 4, and causes floating point rounding errors to accumulate. In YGRoundValueToPixelGrid, the fractialvariable is 0.999877929 and is considered not a whole integer. In the end, the width of the label is one pixel short, causing the text truncation.

This issue is presented when pointScaleFactor is 3 (not 1 or 2), and perhaps it's because 1) 3 is bigger and will cause more error, and 2) multiply and division by 2 is pretty accurate because the binary nature of computer.

Using double instead of float to represent points, or raising the threshold in YGFloatsEqual will make the text fully displayed in the example, but not solve this problem completely. It will still exist in a more complex layout.

I think maybe we can store scaled value or use a real fraction representation?

[LeoSchleicher]

I think this problem is the same as mine:
#738

[linqingmo]

how about YGConfigSetPointScaleFactor(globalConfig, 0);?

[leafduo]

@LeoSchleicher It appears so.

[leafduo]

@linqingmo I've tried to set pointScaleFactor to 0, and the truncation will be solved. But will it cause view not align to pixel grid and become blurry?

[jmaurice-unity]

You might want to try with these changes : #688

[leafduo]

@jmaurice-unity It's not related, #688 is about bug when rounding negative numbers, my coordinates are all positive.

[LeoSchleicher]

Can I set YGConfigSetPointScaleFactor outside of Yoga sources? How to get globalConfig?

[lunarraid]

I believe I am running into this issue as well. If I set the pointScaleFactor to 0, then widths are calculated correctly. If not, continuous updates lead to constant shrinking of elements. I have an example of this running here: https://codesandbox.io/s/qxnnm7272j

[ahuinee]

我尝试了一下，字符串后面加一个空格可以解决 😅
I tried it, and add a space after string. hhhh