I am trying to put a Dialog component inside a MapView but this one is only showed when the map unmounts (too strange). I am using react-native-popup-dialog, but I have also tried to use other libraries and having the same problem. I don't know what I am doing wrong, because if in the code I replace this Dialog component with a Text, the text is correctly shown.
Map.js
<View style={[styles.container, { backgroundColor: colors.white }]}><MapView ref={mapRef} key={key} mapType="standard" rotateEnabled={false} showsUserLocation={showsUserLocation} renderToHardwareTextureAndroid={true} loadingEnabled={true} loadingIndicatorColor={colors.primary} initialRegion={initialRegion} provider={PROVIDER_GOOGLE} customMapStyle={mapStyle} style={styles.map}> {marker && marker.coordinate && (<MapView.Marker key={marker.id} coordinate={marker.coordinate} title={marker.title} pinColor={colors.primary} /> )}</MapView><AnimatedDialog visible title="Hello" text="Example"/> {/*MY CUSTOM COMPONENT*/}</View>AnimatedDialog.js
<Dialog useNativeDriver={true} visible={visible} rounded dialogAnimation={ new SlideAnimation({ slideFrom: "bottom", }) } dialogTitle={<DialogTitle title={title} />} footer={<DialogFooter><DialogButton text="CANCEL" onPress={() => {}} /><DialogButton text="OK" onPress={() => {}} /></DialogFooter> }><DialogContent><Text>{text}</Text></DialogContent></Dialog>