Reaccionar Nativo: ¿Cómo gestiono los tamaños de pantalla de Android 9000?
Acabo de construir la aplicación más increíble increíblemente complicado en el curso de los últimos 6 meses para ambos iOS y Android con React nativo.
Todo iba perfecto, y todo está funcionando muy bien …
- ¿Reactiva Nativo Realmente Soporta Fragmentos Android?
- ¿Cómo obtener un nombre de versión en la aplicación de reactivo nativo en Android?
- Proyecto de la biblioteca de Android con React Native
- ¿Cómo actualizar observable en RxJava?
- ¿Cómo activar la recarga en vivo en reaccionar nativo en android?
Diseñé para el iPhone 4s, 5, 6, 6+ usando un componente especial que escribí que trabaja básicamente como …
override: { ip4: { fontSize: 8 }, ip5: { fontSize: 10 } }
Etc.
Esto realmente funcionó perfecto para iOS.
Hoy abrí GA y estaba aterrorizado al darse cuenta de que se me había olvidado del estilo de Android. Miré a nuestra analítica de Google y hay literalmente como … 700 tamaños de pantalla que son diferentes.
Estoy totalmente confundido en la perspectiva de diseñar para todos estos, especialmente teniendo en cuenta las densidades de píxeles múltiples.
Mi pregunta es, ¿Qué debo hacer para dar cuenta de …
- Márgenes / espaciamientos (enteros básicamente genéricos para relleno o lo que sea)
- Tamaños de fuente
Esas son las 2 cosas que estoy muy confundido cómo manejar todas las combinaciones diferentes.
He echado un vistazo a PixelRatio
, pero no tengo ni idea de cómo usarlo o incluso si estoy en el camino correcto.
¿Cómo maneja la mayoría de la gente esto?
- React Native Duplicate nombre del módulo
- Reaccionar-despliegue nativo al error del dispositivo android 3 clase de actividad no existe
- ¿Cómo acceder a Actividad desde un módulo React Native Android?
- Cómo actualizar el número de versión de la aplicación de reaccionar nativo
- La aplicación de Android se bloquea después de integrar React Native con NoClassDefFoundError: com.facebook.react.bridge.JSPackagerWebSocketClient
- Requerir módulo desconocido "ReactPerf" al integrar React Native con la aplicación Android existente
- ¿Cómo cargar reacciona el paquete JS nativo de la red en Android?
- Cómo configurar la pantalla de bienvenida para reaccionar con Android nativo
Puede utilizar tanto Dimensiones como PixelRatio para obtener las dimensiones de la pantalla y los píxeles. Yo uso esto por ejemplo para establecer el tamaño de la imagen en función del tamaño de la pantalla ..
Por ejemplo:
import Dimensions from 'Dimensions'; import PixelRatio from 'PixelRatio'; var {height, width} = Dimensions.get('window'); var pixelr = PixelRatio.get(); // Calculate styles, heights, fontsizes based on the numbers above
Usted puede utilizar Media Consultas para administrar los múltiples tamaños de pantalla, yo era el uso de medios de comunicación concepto en mi phonecap (Córdoba) en la etapa anterior de desarrollo.
He encontrado en el tutorial durante la búsqueda, creo que es útil,
Terminamos usamos flexboxes alrededor de la aplicación. Así que el contenido se acomodan cuando el espacio está disponible.
Por supuesto, perdimos días enteros en probar y probar
- Abrir el teclado virtual para el elemento ListAdapter contiene una vista con una cadena
- SecurityException – Nombre del paquete de llamadas desconocido -Android 6.0.1