React-native: Setting height on a TextInput causes text to cut off

Created on 15 Feb 2020  路  9Comments  路  Source: facebook/react-native

Description:

  • Set a height on any text input.
  • Try to input text. Notice how the text is cut off in the beginning.

React Native version:

Steps To Reproduce

  • Set a height on any text input.
  • Try to input text. Notice how the text is cut off in the beginning.

Expected Results

  • I expect the text to not cut off, or otherwise its width be affected by settings its height.

Snack, code example, screenshot, or link to a repository:

Here's a text input with no height set, and in editing mode:
Screen Shot 2020-02-14 at 11 00 17 PM

Here's a text input with a height set, and in editing mode:
Screen Shot 2020-02-14 at 10 59 48 PM

Needs

Most helpful comment

You can add padding: 0;
And it will work fine.

All 9 comments

You can add padding: 0;
And it will work fine.

Thanks @aryankush25 . Though, from my perspective, padding: 0 works fine when textInput is not focused, but fails to fix when it is in focus.

same problem

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.

Still requires discussion/attention.

I don't have the power to add/edit labels.
Please help, stalebot. You are our only hope!

I'm also having the same issue

I got this fixed after vertical center the TextInput

I'm having the same issue on iOS.

The only viable workaround is to set the height of the parent view. If that's not an option, then you can wrap the TextInput with a View and set the height on that, along with alignItems: "center" or justifyContent: "center" depending on the flex direction.

I had same issue on iOS 13.7, iPhone 11 simulator and fix it by adding width.
On same phone with iOS 14.0 is fine without adding width.

Was this page helpful?
0 / 5 - 0 ratings