Issues With Android Keyboard within Dialogs
esaulopezTek opened this issue · comments
Description
Using an android device, I am utilizing the the Picker Component.
I am rendering a custom Header and Modal.
For the Modal I am using Incubator.Dialog.
I have a search box in my dialog, we are using it for filtering.
The main issue is that the keyboard avoiding view dose not work when setting,
modalProps={{ statusBarTranslucent: true}}
Without this prop, it works just fine with the exception of the status bar remaining white.
Related to
- Components
Steps to reproduce
use custom dialog in picker with android and keyboard avoiding view,
Set the line below within the props of the dialog.
modalProps={{ statusBarTranslucent: true}}
Expected behavior
Keyboard avoiding view would work the same as without.
Actual behavior
Keyboard avoiding view dose not work.
More Info
Code snippet
<Incubator.Dialog
ref={modalRef}
visible={visible}
onDismiss={() => {
onDone();
toggleModal(false);
}}
width="100%"
height='25%'
position={'bottom'}
bottom
migrate
modalProps={{ useKeyboardAvoidingView: true,statusBarTranslucent:true }}
// eslint-disable-next-line react-native/no-inline-styles
containerStyle={{ backgroundColor: 'white', marginBottom: 0 }}
direction={PanningProvider.Directions.DOWN}
headerProps={{
leadingAccessory: header,
showKnob: false,
showDivider: false
}}
### Screenshots/Video
### Environment
- React Native UI Lib version:
### Affected platforms
- [ ] Android