Questions tagged [react-native-textinput]
240 questions
12
votes
2 answers
Keyboard dismisses while typing TextInput in nested functional component React Native
I have this strange issue, keyboard keeps closing while typing when TextInput is placed inside Child Functional Component. This issue does not exist if TextInput is placed directly under Parent Component. Here is my code
const SignInScreenC = props…

VjLxmi
- 400
- 1
- 4
- 17
12
votes
2 answers
How to wrap text within multiline react native textInput
I am trying to implement a multiline text input in react native, but when user types the text doesn't get wrapped but gets written horizontally on the same line,
the code for my text input is as follows

Naveed Sheriffdeen
- 940
- 6
- 18
- 37
11
votes
1 answer
React native TextInput box-shadow
I want to apply a shadow on TextInput, as shown here:
I am making this style, using shadow, and elevation for android:
shadowColor: colors.shadowColor,
shadowOpacity: 0.5,
shadowRadius: 3,
shadowOffset: {
height: 0,
width:…

ketimaBU
- 901
- 4
- 15
- 35
8
votes
1 answer
React-native - TextInput decimal-pad showing comma instead of a dot on iOS
Some iOS devices seems to be showing a , (comma) instead of a . on the decimal-pad. I believe this is to do with the keyboard language / locale. Is there a way I can force the decimal-pad to show a . regardless of keyboard language /…

Abdul Sadik Yalcin
- 1,744
- 2
- 19
- 50
7
votes
1 answer
React native - Click not trigger on button when an input is focused
I'm currently building a React native mobile app on Android, and I realized that when an input is focused (for the user to type something on his keyboard), the click event doesn't apply on other elements.
For instance, when the user is typing…

Julien Pepe
- 142
- 8
7
votes
3 answers
How to handle back button when TexInput is focused
This is a react-native question for Android.
How can I handle the back button in Android when a TextInput is focused?
BackHandler.addEventListener('hardwareBackPress'. () => {}) does not catch any event if TextInput is focused. It automatically…

Francisco Sarmento
- 288
- 4
- 14
6
votes
2 answers
React Native TextInput: why does secureEntryText shift outside of input box and have ellipsis?
I have TextInput components in my React Native app, and when I added secureEntryText: 'true' for the password input, I noticed two things:
1) As I'm typing the password, the left edge of the typed password shifts out and to the left of the input…

RNdev
- 953
- 1
- 8
- 26
5
votes
1 answer
React native: Android soft keyboard push the View up
I have made one custom animated bottom sheet. It has two snap points. It starts top of the screen, if scroll the Animated card down it will come middle of the screen , again scroll down the card it will come bottom of the screen. If user scroll the…

Krisna
- 2,854
- 2
- 24
- 66
5
votes
2 answers
Hide the bottom image view when showing keyboard react-native
How I can hide this picture...
Thank you for any help!

Trần Tùng
- 81
- 1
- 5
4
votes
0 answers
React Native Textinput backspace won't fire if textinput value is empty in Android
As titled,
I need the backspace event to alter other states in the component.
const onKeyPressHandler = ({ nativeEvent }) => {
if (nativeEvent.key === 'Backspace') {
if (
!TextInputValue.trim() &&
…

Fred A
- 1,602
- 1
- 24
- 41
4
votes
0 answers
Prevent ScrollView from scrolling to TextInput on focus or edit. React Native. Android
I have a couple of views that I have implemented a way for the user to drag them around the screen to place them where they want them. Each of these views has an editable text field inside of them. (Think Sticky notes).
In order to put the sticky…

Kyle Storey
- 57
- 4
4
votes
0 answers
TextInput with securTextEntry automatically clear when type something after losing the focus
I have an TextInput with secureTextEntry set as true. When I do the following steps this input unnecessarily clear all it's content:
Type something in the TextInput
Make any action to lose focus (as example Keyboard.dismiss())
Tap TextInput again…

Vladimir Borutsky
- 66
- 5
4
votes
1 answer
TextInput on React-native-paper is not working
I wanted to get an input on Card from react native paper. I tried to put the textInput in card, card.title, card.content or card.actions, and it is not working, what am I doing wrong? is there any work around on this?
Here is the code I am working…

hanan
- 532
- 2
- 7
- 23
4
votes
1 answer
How to use react native TextInput selection props?
I have the following simple component:
function TestComp() {
const [selection, setselection] = React.useState({ start: 0, end: 0 });
return (

Ryan Pergent
- 4,432
- 3
- 36
- 78
4
votes
0 answers
React-navigation focus on input blurs immediately when going back to previous screen
I want to focus on a textinput when I navigate to a new screen. This works when I add a screen to the stack, but not when I go back in the stack.
Instead, the input focuses for a second and blurs immediately.
Here is what I get:
Screen A is first…

Ryan Pergent
- 4,432
- 3
- 36
- 78