Estoy usando react native expo para mostrar imágenes de varios temas. Las imágenes que estoy usando tienen una variedad de anchos, altos y relaciones de aspecto. Las imágenes en sí provienen del almacenamiento de Google Firebase y se recuperan de los datos JSON de los sujetos seleccionados actualmente que contienen la URL de la imagen del almacenamiento de Firebase.

Algunos sujetos no tienen imágenes en absoluto, lo cual está bien, sin embargo, quiero que el contenido a continuación se mueva hacia arriba, por lo que una imagen o vista de tamaño fijo/relación de aspecto en este caso no es apropiada. Y como dije, las imágenes son de varios altos y anchos (algunos paisajes / algunos retratos).

Actualmente, el estilo de la imagen que estoy intentando es así:

 Image: { height: null, width: "90%", alignSelf: 'center', resizeMode: 'contain' },

Actualmente, con la altura establecida en nulo, la imagen no se muestra en absoluto, y el contenido de abajo se encuentra arriba.

El ancho que quiero se fija en el 90 % del ancho de la pantalla, lo que está haciendo actualmente; sin embargo, tengo problemas con la altura. Intenté establecer la altura en 'indefinido' y también los porcentajes en '40%', etc. Sin embargo, esto no es apropiado para las imágenes de los sujetos que faltan.

Otra forma que he intentado es colocar la imagen dentro de una vista así:

 <View style={styles.ImageContainer}> <Image style={styles.Image} source={{ url: subject.ImageUrl }}/> </View> ... // Styling: Image: { height: null, width: "100%", // 100% of the image container which is 90% of screen. alignSelf: 'center', resizeMode: 'contain' }, ImageContainer: { width: '90%', alignSelf: 'center', justifyContent: 'center' }

Lo que realmente quiero lograr es configurar el contenedor de la imagen al tamaño de la altura de la imagen, que se redimensiona para que ocupe el 90% del ancho de la pantalla (sin sesgar/estirar la imagen).

¿Hay alguna forma de hacer esto dentro del estilo o tengo que intentar usar una función? Estoy seguro de que he tenido éxito al lograr esto a través del estilo en el pasado.