Skip to content

Text numberOfLines prop causes text to be cut off on Android #22419

Closed
@shlokamin

Description

@shlokamin

Environment

Run react-native info in your terminal and paste its contents here.
React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 817.49 MB / 16.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.9.4 - /usr/local/bin/node
Yarn: 1.5.1 - /usr/local/bin/yarn
npm: 6.4.1 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.3, macOS 10.13, tvOS 11.3, watchOS 4.3
Android SDK:
API Levels: 23, 25, 26, 27, 28
Build Tools: 23.0.1, 25.0.0, 25.0.1, 25.0.2, 26.0.1, 26.0.2, 26.0.3, 27.0.3
System Images: android-25 | Google APIs Intel x86 Atom_64, android-27 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.1 AI-173.4907809
Xcode: 9.3/9E145 - /usr/bin/xcodebuild
npmPackages:
react: ^16.5.1 => 16.5.2
react-native: 0.57.5 => 0.57.5
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

When using the numberOfLines Text prop on Android along with any horizontal margin, it causes the edges of the last line to be cut off horizontally as shown below:

image

Reproducible Demo

As shown in the snack below, the first Text component that has margin gets cut off on the last line, while the second one with no margin does not get cut off.

Note: Make sure you're viewing the snack on Android

https://snack.expo.io/@shlokamin/text-number-of-lines-bug

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugComponent: TextPlatform: AndroidAndroid applications.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions