Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
TextLayout: take full width if text wrapped (#47435)
Summary: ### Problem The calculated width for a multiline text is based on the longest line. However it does not account for text that wraps. **Example** if numberOfLines=1 and the text wraps ``` +---------------------------+ This is a long text that will wrap +---------------------------+ ``` The TextView will render ``` +---------------------------+ This is a long text t... +---------------------------+ ``` because the `calculatedWidth` took the width of the first line. Also see #41770 (comment) for additional context. ### Solution If the text wraps, take the whole width. ``` +---------------------------+ This is a long text that w... +---------------------------+ ``` Fixes #39722 Fixes facebook/yoga#1730 ## Changelog: [GENERAL] [FIXED] - Fix text not taking full width Pull Request resolved: #47435 Test Plan: ```tsx <Text numberOfLines={1} style={{ backgroundColor: 'red', alignSelf: 'flex-start', color: 'white', fontSize: 34, }}> {'This is a long text that will wrap.'} </Text> <Text numberOfLines={3} style={{ backgroundColor: 'red', alignSelf: 'flex-start', color: 'white', fontSize: 34, }}> { '1\n\ntest\nThis is a long text that will wrap.This is a long text that will wrap.This is a long text that will wrap.\n' } </Text> <Text numberOfLines={3} style={{ backgroundColor: 'red', alignSelf: 'flex-start', color: 'white', fontSize: 34, }}> { '1\n\nThis is a long text that will wrap.This is a long text that will wrap.This is a long text that will wrap.\n' } </Text> ``` 1. Verify that the first and third text take full width 2. Verify that the second text does not take full width | Before | After | |:------:|:-----:| | <img width="480" alt="Screenshot 2024-11-05 at 9 00 24 PM" src="https://github.com/user-attachments/assets/b8d765c0-f4b1-42c6-afc7-75862c52612a"> | <img width="480" alt="Screenshot 2024-11-05 at 9 01 49 PM" src="https://github.com/user-attachments/assets/f1534c14-a56a-4d44-8edc-4d9f75166cb2"> | Reviewed By: NickGerleman Differential Revision: D65521732 Pulled By: realsoelynn fbshipit-source-id: 0bb0bb306445e73e8b24ff4c02921739d15ee07e
- Loading branch information