1

I am using "react-native": "0.70.4", with the @react-navigation/material-top-tabs to make a custom bottomsheet with top tabs inside. When clicking the TextInput in tab nr 2 it dismiss the keyboard, but if i click again it does not happen. I tried multiple ways, it happens when there is 3 or more tabs. It works as intended in the other tabs.

Tabs example

Example of the bottomsheet and tabs. If I click the "søk" (TextInput) in tab "test2". It would open and close the keyboard the first time I click it.

enter image description here

this after the second time I click the TextInput.

I am thinking of using android:windowSoftInputMode="adjustNothing" but this doesnt let me use an useffect/keyboard lisnter

KLK
  • 49
  • 7
  • I have found if tab 2 is inital route, both tab 1 and tab 3 have the same result. closeing on first click. working on all other. The resizing of the view is the issue. but it works in all the other tabs and on second click. finding issues when changing the keyboard handler because either the bottomsheet act weird or is hidden by the keboard. – KLK Dec 05 '22 at 12:48

3 Answers3

0

looks like there is not enough space to open the keyboard in the BottomSheet menu, should you use const snapPoints = useMemo(() => ["30%", "50%"], []); for snapPoints?

JSONCMD
  • 79
  • 3
  • There is no issue about the height, the other tabs handle the view fine. I have something that resize the screen and do more then the keyboard is up. – KLK Dec 02 '22 at 13:29
  • I did not understand the essence of the question a little, I'm sorry, but the problem is in keyboard handling? When the keyboard overrides the BottomSheet view? – JSONCMD Dec 02 '22 at 13:32
  • The view gets pushed by the default keyboard handling, up the same height of the keyboard. – KLK Dec 02 '22 at 13:34
  • that is, when you click the first time on the text input, the keyboard opens and closes, if you click the second time, a window opens from the screen? – JSONCMD Dec 02 '22 at 13:40
  • I belive I have found I am wrong. It is the way I am resizeing the view that is the issue. – KLK Dec 02 '22 at 15:12
0

I had to change android:windowSoftInputMode="adjustResize" with adjustPan, change my layout to use flex instead of height and change tabBarHideOnKeyboard: true to false.

It makes me have to change quite a bit of code. But atleast the bug is gone.

KLK
  • 49
  • 7
  • issue comes from `react-native-pager-view`. is there any replacements for this component that can give me top tabs? – KLK Dec 07 '22 at 09:17
0

I made a custom tab component with scrollView. the issue is with react-native-pager-view. unable to resize or move things so that it can reach all components when using pager-view.

KLK
  • 49
  • 7