question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. ItĀ collects links to all the places you might be looking at while hunting down a tough bug.

And, if youā€™re still stuck at the end, weā€™re happy to hop on a call to see how we can help out.

Keyboardavoidingview not working properly with TextInput Password Field

See original GitHub issue

šŸ› Bug Report

When we make TextInput as a password fields KeyboardAvoidingView not work as expected.
Currently when remove secureTextEntry={true} it works fine like when I press next button on keyboard it will go to password textInput field from State textInput field and also password textInput field scroll up and works perfectly, but when I added secureTextEntry={true} which is mandatory this is not working for password fields, working fine on other fields perfectly. I also created a demo code, Please look into this. This issue is only in Android.

53394742-fd245980-39c1-11e9-9734-035712d6c2ae

To Reproduce

I made a demo code to check this issue, just remove secureTextEntry={true} from Password Fields This issue will arise only in android,

Expected Behavior

When I press next on keyboard it should go to password field and password field should scroll up like other Input Fields.

Code Example

Demo Code having Issue Question on StackOverflow

Environment

software version
android 8.0.1
react-native 0.57.1
node 8.12.0
npm 6.4.1
expo sdk 32.0.0

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
hussainahmadcommented, Mar 20, 2019

I couldnā€™t reproduce the issue on RN 0.59, or I can click next and go to a next field even if it has secureTextEntry={true}

@dulmandakh yes you are right it go to the next field this is not the issue. I tried with RN 0.59.1 but Issue I am discussing here not fixed , I am sure you didnā€™t understand my context or may be I am explaining in a wrong way.
AS @JKCooper2 mentioned

On Android the KeyboardAvoidingView will only scroll when starting to type (not on focus), regardless of whether secureTextEntry is enabled.

I think in android too keyboard should scroll when click next before we start type

1reaction
ironhide0396commented, Oct 10, 2019

Hi , I am facing the same issue as exactly mentioned by @hussainahmad . The error does occur in 0.59 too . One way i fixed it was to wrap the KeyBoardAvoidingView inside a ScrollView. Let me know if that works out .

Read more comments on GitHub >

github_iconTop Results From Across the Web

KeyboardAvoidingView not working with TextInput password ...
Had the same problem. I managed it by setting secureTextEntry prop to true only when the password input is focused.
Read more >
KeyboardAvoidingView not working properly? Check your ...
Check your Flexbox Layout first. Keyboard overlaying Input or Submit button is a common problem in React Native. Something likeĀ ...
Read more >
keyboard avoiding view not working ios - You.com
KeyboardAvoidingView not Working Properly - Stack Overflow. Stackoverflow.com > questions > 48420468 ... When clicked on the username input field, imageĀ ...
Read more >
Avoid Keyboard in React Native Like a Pro - Netguru
In KeyboardAvoidingView screen, after opening the bottom sheet and focusing input, content is not changing its position, which makes itĀ ...
Read more >
React Native KeyboardAvoidingView: A How-To Guide - Waldo
Create a React Native Project Ā· Run the Project Ā· Create the Initial Components Ā· Add the Components to the App.js File Ā·...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found