Place the `CROSS` outside the modal

Question

I use react-native-modal and how can I place the CROSS outside the modal, in the corner of the backdrop? If I use absolute positioning, then the CROSS is found under the background layer.

      <>
        <TouchableOpacity style={styles.cross}>
          <Image source={CROSS} />
        </TouchableOpacity>
        <Modal>
         {....}
        </Modal>
      </>

const styles = StyleSheet.create({
  cross: {
    position: 'absolute',
    zIndex: 100,
    elevation: 100,
  },
});

Answer 1

You must place cross inside modal. Modal takes whole screen. And other content of modal content place next to cross as sibling. :

<Modal>
  <TouchableOpacity style={styles.cross}>
    <Image source={CROSS} />
  </TouchableOpacity>
 {....}
</Modal>