Estoy escribiendo una aplicación de chat simple donde un usuario puede enviar una foto. Una vez que un usuario hace clic en un mensaje con una foto, se representa dentro de ImageViewer . Luego tengo la opción de guardar la foto. Una vez que se guarda la foto, quiero mostrar modal con "guardaste tu foto" o algo así. Hasta aquí todo bien. PERO, el modal con el mensaje informativo parece ocupar pantalla completa en lugar de un mensaje de una sola fila. Aquí está mi código:

 return ( <> <Modal animationType="slide" visible={showImageViewer && savedPhoto} onRequestClose={() => { setSavedPhoto(false); }} > <View style={styles.modalViewStyle}> <Text style={styles.modalTextStyle}> Please, dont take the whole screen </Text> </View> </Modal> </> );

Mis importaciones:

 import ImageViewer from "react-native-image-zoom-viewer"; import { GiftedChat } from "react-native-gifted-chat"; import { View, Text, Image, Modal, TouchableOpacity, StyleSheet, } from "react-native";

Mi estilo:

 const styles = StyleSheet.create({ image: { width: 150, height: 100, borderRadius: 13, margin: 3, resizeMode: "cover", }, modalViewStyle: { justifyContent: "center", alignItems: "center", flexDirection: "row", borderWidth: 3, borderColor: "red", height: 40, flex: 1 / 10, }, modalTextStyle: { fontWeight: "bold", color: "green", fontSize: 15, }, });