lo que pasa es que al desarrollar con react native y expo, cuando corro la app en mi móvil siempre trabajo en base a la resolución actual de mi móvil, pero cuando decido probar en otro dispositivo todo cambia.. es decir: la app queda de cierta forma adaptada a la resolución de mi móvil y no se ajusta a las resoluciones de diferentes dispositivos. Mi pregunta es como hacen ustedes para trabajar en cuento a este aspecto, o que debería hacer para poder tener una visualización estándar de la app en cualquier dispositivo. Muchas gracias.
-
Puedes mostrar tu código? En qué tipo de dispositivo muestra un diseño diferente? He programado con expo y nunca tuve este problema. Te recomiendo revisar el simulador de Android y iOS mientras trabajas en tu código, a mi me sirve hacerlo de este modo.– milmalCommented el 1 nov. 2020 a las 10:12
-
@milmal Lo que pasa es que es en general, por ejemplo un botón lo acomodo para que se vea bien basándome en como lo veo en el hotreload en mi celular, luego quiero ver como se ve en otro dispositivo y me sucede que el botón se ve muy grande, teniendo en cuenta que el otro dispositivo tiene menos resolución, entonces no sabría que parte de código mostrarte por que esto me pasa en todas las vistas– Diego MonsalveCommented el 1 nov. 2020 a las 14:59
Añade un comentario
|
1 respuesta
Te comento mi solución:
import Dimensions from 'react-native'
Luego en una variable de estado:
//Esto da la dimension del dispositivo.
const [ancho, setAncho] = useState(Dimensions.get ('window').width)
Luego en los estilos (yo uso tailwind css) verifico el tamaño y dependiendo de la resolución aplico un estilo u otro
Ej:
<Text style={tw.style(`${ancho > 400 ? "text-xl" : "text-4x1"}`)}>
{item.descripcion}
</Text>
Para que tengas una idea, mayor a 400 seria un tel de 6.2"
Es medio tedioso pero lo pude resolver de esta manera.