React Native Modal background doesn't work properly

Question

This was my modal

import Modal from 'react-native-modal';
..
....
..
   <Modal
      visible={modalVisible} //this one was the issue (should be isVisible)
      animationType={'slide'}
      swipeDirection="down"
      transparent={true}
      onRequestClose={() => closeModal()}
      onSwipeComplete={() => closeModal()}
      style={{justifyContent: 'flex-end', margin: 0}}
    >
    </Modal>

So as you can see, my idea was to open it half way and slide it down to close

My problem was that it was acting weird, the modal wasn't updating properly, sometimes the modal opened way less than it was supposed to

what is the meaning of line - "my idea was to open it half way " ?? — MukulSharma, Jul 16 '21 at 02:59
@MukulSharma i was referring to something like *Bottom Half* in this gif https://github.com/react-native-modal/react-native-modal/raw/master/.github/images/example-modal.gif . But to go as far as the middle screen — NiB, Jul 17 '21 at 21:58
@MukulSharma I already figured it out tho, I googled it but couldn´t find an answer so I just posted the question + answer for someone else to find it faster — NiB, Jul 17 '21 at 22:00

score 0 · Accepted Answer · answered Jul 15 '21 at 05:19

0

After reading the documentation and common problems:

The solution was to change the visible prop to isVisible

isVisible={modalVisible}

answered Jul 15 '21 at 05:19

NiB

801
1
9
26

React Native Modal background doesn't work properly

1 Answers1