react-native-element-dropdown
react-native-element-dropdown copied to clipboard
hoaphantn7604
Keyboard issue on search
- On search if the item is clicked on the menu when the keyboard is showing on iOS it only dismisses the keyboard but does not hide the open menu.
- Also when applied in Keyboard Scrollview the field scrolls up when keyboard is open and menu opens from under the field, but when the keyboard is dismissed, the menu stays in the opened position and the field scrolls down to the actual position which looks odd.
hi @abhisekmallik , This issue cannot reproduce. You can send Repo example.
- On search if the item is clicked on the menu when the keyboard is showing on iOS it only dismisses the keyboard but does not hide the open menu.
- Also when applied in Keyboard Scrollview the field scrolls up when keyboard is open and menu opens from under the field, but when the keyboard is dismissed, the menu stays in the opened position and the field scrolls down to the actual position which looks odd.
keyboard issues on android by running the example
when keyboard shows up
input container with placeholder scrolls up but the dropDown container stays at the previous position
I am having this same issue as @AkshayPatel7000. The search bar avoids the keyboard just fine, but the dropdown is hidden by the keyboard, so when we search for items in the dropdown, we can't see any results since the keyboard is hiding it.
Hi @hoaphantn7604, sorry for the long delay in checking this. I downloaded the code and ran the example in expo and the dropdown is still being hidden by the keyboard like in the photo by @AkshayPatel7000. I messed around with the code and have a fix for the logic as to when it renders the dropdown on top, but the keyboard keeps getting dismissed upon mounting the dropdown on top. I assume the keyboard keeps getting dismissed due to how the dropdown is being rendered. I was hoping you could take a look at this when you get a chance please and thank you!
Here is my work in progress changes: #139
I have also attached a video that shows how the dropdown rendering is messed up currently https://user-images.githubusercontent.com/16094260/216484305-63e16078-0359-4498-a9cb-f125e0d52045.mp4
Hi @hoaphantn7604, I was able to tinker around with this some more and realized the problem was with conditionally rendering the search input. Since the keyboard references the search input, then un-rendering it and rendering a different search input will cause the keyboard to be dismissed.
To fix this, I conditionally render the list instead as that will not affect the keyboard when it disappears and is rendered before/after the search input.
Please see the same PR #139 for the new changes and feel free to modify any of my changes as you see fit. This change does make the dropdown behave how I expect it should when the keyboard is showing.
hi @myou11 , Thank you create PR. I merged your PR and it raised a new issue.
https://user-images.githubusercontent.com/50919571/216881926-f8897b9e-09d5-4363-9991-ed6a34954aea.mp4