You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
It seems that if you have a <Text> with textAlign: 'center', the text is drawn in the wrong place after an update if the size of the text remains the same. A little hard to describe, but here's a repro case:
The initial render is fine, but subsequent renders show the misaligned text.
Unclear to me why this happens – if you give a fixed width to the <Text> then the problem goes away, and if you introduce a small bit of random fuzz in RCTShadowText's RCTMeasure so that the frame changes on every render, the problems also disappears.
I did my best to dig through the code but couldn't figure out what was up. @nicklockwood@a2@tadeuzagallo maybe you have ideas?
Fixesfacebook#979.
Previously, a Text whose width is determined automatically (as opposed
to set by a container) would position the text incorrectly after an
update to the text *if* the text's width did not change (i.e., when
changing only digits in a font with tabular numbers).
Every time RCTShadowText's RCTMeasure runs, it sets the text container's
size to be the maximum allowed size for the text. When RCTText's
drawRect is called later, it relied on layoutSubviews having been called
to set the text container's size back to the proper width. But if
RCTMeasure returned the same dimensions as last time, then RCTText's
frame wasn't reset and so layoutSubviews was never re-called. With this
change, we set the textContainer's size each time we draw the text.
We could also fix this by using a different NSTextContainer instance in
RCTMeasure. Not sure what the pros and cons of that are.
It seems that if you have a
<Text>
withtextAlign: 'center'
, the text is drawn in the wrong place after an update if the size of the text remains the same. A little hard to describe, but here's a repro case:The initial render is fine, but subsequent renders show the misaligned text.
Unclear to me why this happens – if you give a fixed
width
to the<Text>
then the problem goes away, and if you introduce a small bit of random fuzz in RCTShadowText's RCTMeasure so that the frame changes on every render, the problems also disappears.I did my best to dig through the code but couldn't figure out what was up. @nicklockwood @a2 @tadeuzagallo maybe you have ideas?
Thanks @MichelleTodd for finding this.
The text was updated successfully, but these errors were encountered: