Oppo A77 - Some texts gets cut-off

Environment

1. react-native -v: 0.34 through 0.59
2. node -v:4.4.7
3. npm -v: 4.5.0
4. yarn --version:

• Target Platform: Android
• Development Operating System: Windows
• Build tools: The issue is specific to Oppo A77 model. Note that upgrading to latest react-native version is not an option now due to breaking changes and time constraints

Steps to Reproduce

There’s no necessary steps to produce these bug. You just have to run the app either in dev or production

Expected Behavior

Texts should not be cut-off

Actual Behavior

Some texts are cut-off as shown below. These cut-off issue doesnt occur in iphone and other phone models except Oppo A77

Screenshots:

Those screenshots are just few of the texts that are cut-off

Sorry i can’t provide a link to the project

[yeswanth]

I have faced similar issues in OnePlus 5. These issues only happen in a OnePlus 5 phone when you have chosen “OnePlus Slate” font in Settings. If you change the font to Roboto, the issues don’t occur. I’m gonna ship Roboto font along with my app in the next version to go around this.

[johnwook]

@mykelaballe cc @hramos We’ve had similar issue(some texts getting cut off in Oppo device). Although it’s not a complete solution, we found some hacky-way to solve this problem.

in short, (at least in our case) just adding empty space at the end of the text seems work. my colleague @saystone will explain in detail 😃

for example, use 1.5.3+space instead of 1.5.3(space at the end of the string)