Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React-native click button while keyboard is presented

Tags:

react-native

I have several inputs fields that are presented one after the other using flatlist and smartView that represents each input, with the structure being like this:

    <View>
    <Dialog>
    <View >
    <KeyboardAvoidingView>
    <FlatList
    renderItem={({ item }) => (
    <SmartView //structure of view per input
 <SafeAreaView>
<View>
   <InputItem/>
 <TouchableNativeFeedback/> //button that must be clicked
</View>
 </SafeAreaView>
 />
    )}>
    </KeyboardAvoidingView>
    </View>
    </Dialog>
    </View >

The class <InputItem/> contains the <TextInput> in question and the <TouchableNativeFeedback/> is on the same level as the <InputItem/>

I just need for the button to register a click WHEN KEYBOARD is showing, as this app is running on iPad and keyboard do not come in they way of anything. Many thanks

like image 593
Abdulla kh. Skip Avatar asked Sep 06 '25 03:09

Abdulla kh. Skip


2 Answers

Fixed issue by adding keyboardShouldPersistTaps={"always"} to component <Dialog>.

like image 192
Abdulla kh. Skip Avatar answered Sep 07 '25 20:09

Abdulla kh. Skip


Add this prop to your FlatList so that touches will get detected even though the keyboard is opened: keyboardShouldPersistTaps="handled" or keyboardShouldPersistTaps="always"

like image 22
Thomas D Cat Avatar answered Sep 07 '25 22:09

Thomas D Cat