Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Certain phrases won't break the complete word to a new line #22446

Closed
3 tasks done
martinshhh opened this issue Nov 28, 2018 · 4 comments
Closed
3 tasks done

Certain phrases won't break the complete word to a new line #22446

martinshhh opened this issue Nov 28, 2018 · 4 comments
Labels
Bug Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@martinshhh
Copy link

martinshhh commented Nov 28, 2018

Environment

React Native Environment Info:
System:
OS: macOS 10.14.1
CPU: x64 Intel(R) Core(TM) i7-3720QM CPU @ 2.60GHz
Memory: 1.61 GB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.12.0 - /usr/local/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
SDKs:
iOS SDK:
Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
Android SDK:
Build Tools: 20.0.0, 22.0.1, 23.0.3, 24.0.3, 25.0.2, 26.0.3, 27.0.3, 28.0.3
API Levels: 22, 23, 24, 25, 26, 27, 28
IDEs:
Android Studio: 3.2 AI-181.5540.7.32.5056338
Xcode: 10.0/10A255 - /usr/bin/xcodebuild
npmPackages:
@storybook/react-native: 4.0.0-alpha.7 => 4.0.0-alpha.7
@types/react: ^16.3.16 => 16.3.16
@types/react-native: ^0.55.17 => 0.55.17
react: ^16.4.1 => 16.4.1
react-native: 0.57.7
npmGlobalPackages:
react-native-cli: 2.0.1

Description

Certain phrases won't fully break the word to a new line, instead, it breaks the word leaving some letters behind. Using flexWrap, flexShrink doesn't change anything. Tried several fixes but the result is the same. Indeed some phrases do not break the words properly.

Reproducible Demo

The following phrase will break the words properly:

<View style={{flex: 1}}>
  <Text>
       Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has 
       been the industry's standard dummy text ever since the 1500s
  </Text>
</View>

And the result will be the expected, even if you remove some words or letters they will break properly (the whole word) to a new line.
But the following phrase won't break the words as expected:

<View style={{flex: 1}}>
  <Text>
      Animal animal animal animal animal animal animal animal animal animal animal
  </Text>
</View>

This example will break the words leaving some letters behind in the previous line.
If I add random letters to any of these words they still break leaving some letters behind.
Even if I had flexWrap or flexShrink nothing changes.

@react-native-bot

This comment has been minimized.

@jsaraiva
Copy link

jsaraiva commented Jan 3, 2019

Have you tried adjusting the textBreakStrategy prop in your Text element?

https://facebook.github.io/react-native/docs/text#textbreakstrategy

@stale
Copy link

stale bot commented Aug 2, 2019

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Aug 2, 2019
@stale
Copy link

stale bot commented Aug 9, 2019

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

@stale stale bot closed this as completed Aug 9, 2019
@facebook facebook locked as resolved and limited conversation to collaborators Aug 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

4 participants