Open ShahilMangroliya opened 2 years ago
I have the same issue. Can maybe provide a bit more information if it maybe will be easier to solve this issue.
Content inside <KeyboardAwareScrollView />
should scroll, and stay visible even if inside <Modal />
and it has statusBarTranslucent
set to true
When statusBarTranslucent
is set to true
on a <Modal />
component from react-native <KeyboardAwareScrollView />
inside this modal is not scrolling contents into view when keyboard is opened.
npx react-native init repro
yarn add react-native-keyboard-aware-scroll-view@0.9.5
import React from 'react';
import { Modal, SafeAreaView, StyleSheet, Text, TextInput, View, } from 'react-native';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
const App = () => { return (
); };
const styles = StyleSheet.create({ backgroundColor: { backgroundColor: '#F3F3F3', height: '100%', }, modal: { justifyContent: 'flex-end', margin: 0, }, content: { height: '40%', marginTop: 'auto', backgroundColor: '#AAA', padding: 16, }, text_input: { borderStyle: 'solid', borderWidth: 1, borderColor: '000', }, });
export default App;
4. run on Android
5. Click inside text input
### Context (Environment)
"react": "17.0.2",
"react-native": "0.68.0",
"react-native-keyboard-aware-scroll-view": "0.9.5"
Up
Same problem, any update?
Any updates? Facing same problem.
"react": "18.2.0",
"react-native": "0.72.6",
"react-native-keyboard-aware-scroll-view": "0.9.5"
Update.
Adding enableOnAndroid={true} in KeyboardAwareScrollView worked for me!
<Modal
...
statusBarTranslucent={true}
>
<KeyboardAwareScrollView enableOnAndroid={true}>{children}</KeyboardAwareScrollView>
</Modal>
import {Modal} from "react-native"