-
-
Notifications
You must be signed in to change notification settings - Fork 148
Description
Hello,
ActionSheet opens, but when I click the input, the keyboard opens for 1-1.5 seconds and then closes again. I don't know if this has anything to do with the ScrollView. Perhaps the problem is a mistake on my part, but I've shared some of the code below in its purest form. Another ActionSheet on a page without a ScrollView opens when I click the keyboard but it doesn't close. How can I fix this? I need to use a ScrollView. I noticed that when I click the input, it's as if the height value tries to increase, but it doesn't. Then, the page detects movement and closes the keyboard. How can I fix this?
Version: "react-native-actions-sheet": "^0.9.8",
Thanks
Code:
import ActionSheet, { ScrollView } from 'react-native-actions-sheet';
export const Search: React.FC = ({
}) => {
return (
<ActionSheet
ref={actionSheetRef}
onClose={handleClose}
containerStyle={{
...styles.actionSheetContainer,
backgroundColor: isDarkMode ? 'rgba(15, 15, 25, 0.8)' : 'rgba(255, 255, 255, 0.8)',
flex: 1,
}}
gestureEnabled={true}
closeOnTouchBackdrop={true}
drawUnderStatusBar={false}
defaultOverlayOpacity={0.3}
indicatorStyle={{
...styles.indicator,
backgroundColor: isDarkMode ? '#6B7280' : '#9CA3AF'
}}
>
<View style={[
{ backgroundColor: 'transparent' }
]}>
{/* Header */}
<TextInput
ref={inputRef}
style={[styles.searchInput, { color: isDarkMode ? '#E5E7EB' : colors.text }]}
placeholder={t('routing.overlay.search', 'Ara...')}
placeholderTextColor={isDarkMode ? '#6B7280' : '#D3D3D3'}
value={query}
onChangeText={text => {
setQuery(text);
if (searchTimeoutRef.current)
clearTimeout(searchTimeoutRef.current);
searchTimeoutRef.current = setTimeout(
() => performSearch(text),
400,
);
}}
autoCorrect={false}
autoFocus={true}
/>
{/* Content */}
<ScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollViewContent}
showsVerticalScrollIndicator={true}
bounces={true}
keyboardShouldPersistTaps="handled"
>
.....
</ScrollView>
</View>
</ActionSheet>
);
};