Share via


Creación de recursos para diferentes pantallas

Android se ejecuta en muchos dispositivos diferentes, cada uno con una amplia variedad de resoluciones, tamaños y densidades de pantalla. Android realizará el escalado y el cambio de tamaño para que la aplicación funcione en estos dispositivos, pero esto puede dar lugar a una experiencia de usuario menos satisfactoria. Por ejemplo, las imágenes podrían aparecer borrosas o estar colocadas según lo previsto en una vista.

Conceptos

Algunos términos y conceptos son importantes para comprender la compatibilidad con varias pantallas.

  • Tamaño de pantalla: la cantidad de espacio físico para mostrar la aplicación.

  • Densidad de pantalla: el número de píxeles en cualquier área determinada de la pantalla. La unidad de medida típica es de puntos por pulgada (ppp).

  • Resolución: el número total de píxeles en la pantalla. Al desarrollar aplicaciones, la resolución no es tan importante como el tamaño y la densidad de la pantalla.

  • Píxel independiente de densidad (dp): unidad virtual de medida para permitir que se creen diseños independientemente de la densidad. Esta fórmula se usa para convertir dp en píxeles de pantalla:

    px = dp × ppp ÷ 160

  • Orientación: la orientación de la pantalla se considera horizontal cuando es más ancha que alta. En cambio, la orientación es vertical cuando la pantalla es más alta que la ancha. La orientación puede cambiar durante la vigencia de una aplicación a medida que el usuario gira el dispositivo.

Observe que los tres primeros conceptos están relacionados entre sí: aumentar la resolución sin aumentar la densidad aumentará el tamaño de la pantalla. Sin embargo, si se aumenta la densidad y la resolución, el tamaño de la pantalla puede permanecer sin cambios. Esta relación entre el tamaño de pantalla, la densidad y la resolución complican rápidamente la compatibilidad entre pantallas.

Para ayudar a tratar esta complejidad, el marco de Android prefiere usar píxeles independientes de densidad (dp) para los diseños de pantalla. Mediante el uso de píxeles independientes de la densidad, los elementos de la interfaz de usuario parecerán tener el mismo tamaño físico para el usuario aún en pantallas con densidades diferentes.

Compatibilidad con varios tamaños y densidades de pantalla

Android controla la mayor parte del trabajo para representar los diseños correctamente para cada configuración de pantalla. Sin embargo, hay algunas acciones que se pueden realizar para ayudar al sistema.

El uso de píxeles independientes de densidad en lugar de píxeles reales en los diseños es suficiente en la mayoría de los casos para garantizar la independencia de la densidad. Android escalará los recursos Drawable en el runtime al tamaño adecuado. Sin embargo, es posible que el escalado provoque que los mapas de bits aparezcan borrosos. Para solucionar este problema, proporcione recursos alternativos para las diferentes densidades. Al diseñar dispositivos para varias resoluciones y densidades de pantalla, resultará más fácil empezar con las imágenes de mayor resolución o densidad y, a continuación, reducir verticalmente.

Declarar el tamaño de pantalla admitido

Declarar el tamaño de pantalla garantiza que solo los dispositivos compatibles puedan descargar la aplicación. Esto se logra configurando el elemento supports-screens en el archivo AndroidManifest.xml. Este elemento se usa para especificar qué tamaños de pantalla admite la aplicación. Se considera que se admite una pantalla determinada si la aplicación puede colocar correctamente sus diseños para rellenar la pantalla. Al usar este elemento de manifiesto, la aplicación no se mostrará en Google Play para dispositivos que no cumplan las especificaciones de pantalla. Sin embargo, la aplicación igualmente se ejecutará en dispositivos con pantallas no admitidas, pero los diseños pueden aparecer borrosos y pixelados.

Las seis pantallas admitidas se declaran en el archivo Properites/AndroidManifest.xml de la solución:

Edite AndroidManifest.xml para que incluya supports-screens:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          android:versionCode="1"
          android:versionName="1.0"
          package="HelloWorld.HelloWorld">
      <uses-sdk android:minSdkVersion="21" android:targetSdkVersion="27" />
      <supports-screens android:resizable="true"
                        android:smallScreens="true"
                        android:normalScreens="true"
                        android:largeScreens="true" />
      <application android:allowBackup="true"
                   android:icon="@mipmap/ic_launcher"
                   android:label="@string/app_name"
                   android:roundIcon="@mipmap/ic_launcher_round"
                   android:supportsRtl="true" android:theme="@style/AppTheme">
  </application>
</manifest>

Proporcionar diseños alternativos para diferentes tamaños de pantalla

Los diseños alternativos permiten personalizar una vista para un tamaño de pantalla específico, cambiando el posicionamiento o el tamaño de los elementos de la interfaz de usuario del componente.

A partir del nivel de API 13 (Android 3.2), los tamaños de pantalla están en desuso en favor del uso del calificador swNdp. Este nuevo calificador declara la cantidad de espacio que necesita un diseño determinado. Se recomienda que las aplicaciones diseñadas para ejecutarse en Android 3.2 o superior usen estos calificadores más recientes.

Por ejemplo, si un diseño requiere un mínimo de 700 dp de ancho de pantalla, el diseño alternativo irá en la carpeta layout-sw700dp:

Como guía, estos son algunos números para varios dispositivos:

  • Teléfono típico, 320 dp: un teléfono típico

  • Tableta de 5"/dispositivo de "interpolación", 480 dp: como la Samsung Note

  • Tableta de 7", 600 dp: como Nook de Barnes & Noble

  • Tableta de 10", 720 dp: como la Motorola Xoom

En el caso de las aplicaciones destinadas a niveles de API de hasta 12 (Android 3.1), los diseños deben ir en directorios que usen los calificadores pequeño/normal/grande/extra grande como generalizaciones de los distintos tamaños de pantalla que están disponibles en la mayoría de los dispositivos. Por ejemplo, en la imagen siguiente, hay recursos alternativos para los cuatro tamaños de pantalla diferentes:

A continuación se muestra cómo se comparan los calificadores de tamaño de pantalla anteriores al nivel de API 13 con los píxeles independientes de densidad:

  • 426 dp x 320 dp es pequeño

  • 470 dp x 320 dp es normal

  • 640 dp x 480 dp es grande

  • 960 dp x 720 dp es extra grande

Los calificadores de tamaño de pantalla más recientes en el nivel de API 13 y superior tienen una prioridad mayor que los calificadores de pantalla anteriores de los niveles de API 12 y versiones inferiores. En el caso de las aplicaciones que abarcarán los niveles de API antiguos y nuevos, puede que sea necesario crear recursos alternativos mediante ambos conjuntos de calificadores, como se muestra en la captura de pantalla siguiente:

Proporcionar mapas de bits diferentes para las diferentes densidades de pantalla

Aunque Android escalará los mapas de bits según sea necesario para un dispositivo, es posible que los propios mapas de bits no se escalen o reduzcan verticalmente de forma elegante: se pueden volver confusos o borrosos. Proporcionar mapas de bits adecuados para la densidad de pantalla mitigará este problema.

Por ejemplo, la imagen siguiente es un ejemplo de los problemas de diseño y apariencia que pueden producirse cuando no se proporcionan los recursos de especificación de densidad.

Screenshots without density resources

Compare esto con un diseño que considera los recursos específicos de densidad:

Screenshots with density-specific resources

Creación de recursos de densidad variables con Android Asset Studio

La creación de estos mapas de bits de varias densidades puede ser un poco tediosa. Es por ello que Google ha creado una utilidad en línea denominada Android Asset Studio que puede reducir algunas de las molestias implicadas en la creación de estos mapas de bits.

Android Asset Studio

Este sitio web le ayudará a crear mapas de bits que tienen como destino las cuatro densidades de pantalla más comunes proporcionando una sola imagen. Después, Android Asset Studio creará los mapas de bits con algunas personalizaciones y, a continuación, les permitirá descargarlos como un archivo ZIP.

Sugerencias para varias pantallas

Android se ejecuta en un número impresionante de dispositivos, por lo que la combinación de tamaños y densidades de pantalla puede ser abrumadora. Las siguientes sugerencias pueden ayudar a minimizar el esfuerzo necesario para admitir varios dispositivos:

  • Diseñe y desarrolle solo para lo que necesita: hay muchos dispositivos diferentes por ahí, pero algunos existen en factores de forma poco frecuentes que pueden requerir un esfuerzo significativo para su diseño y desarrollo. El panel Tamaño y densidad de pantalla es una página proporcionada por Google que proporciona datos sobre el desglose de la matriz de densidad de pantalla o de tamaño de pantalla. Este desglose proporciona información sobre cómo realizar el trabajo de desarrollo en pantallas auxiliares.

  • Use DP en lugar de píxeles: los píxeles se vuelven problemáticos a medida que cambia la densidad de la pantalla. No codifique los valores de píxeles de forma rígida. Evite píxeles en favor de dp (píxeles independientes de densidad).

  • EviteAbsoluteLayoutsiempre que sea posible: está en desuso en el nivel de API 3 (Android 1.5) y dará como resultado diseños frágiles. No debe usarse. En su lugar, intente usar widgets de diseño más flexibles, como LinearLayout, RelativeLayout o el nuevo GridLayout.

  • Elija una orientación de diseño como predeterminada: por ejemplo, en lugar de proporcionar los recursos alternativos layout-land y layout-port, coloque los recursos horizontales en layout-land y los recursos verticales en layout-port.

  • Use LayoutParams para Alto y Ancho: al definir los elementos de la interfaz de usuario en un archivo de diseño XML, una aplicación Android con los valores de wrap_content y fill_parent tendrá más éxito en garantizar un aspecto adecuado en distintos dispositivos que usar unidades independientes de píxeles o densidad. Estos valores de dimensión hacen que Android escale los recursos de mapa de bits según corresponda. Por este mismo motivo, las unidades independientes de densidad se reservan mejor para cuando se especifican los márgenes y el relleno de los elementos de la interfaz de usuario.

Probar varias pantallas

Una aplicación Android debe probarse en todas las configuraciones compatibles. Lo ideal es que los diseños se prueben en los propios dispositivos reales, pero en muchos casos esto no es posible o práctico. En este caso, el uso del emulador y la configuración de dispositivos virtuales Android para cada configuración de dispositivo será útil.

Android SDK proporciona algunas máscaras del emulador que se pueden usar para crear los AVD que replicarán el tamaño, la densidad y la resolución de muchos dispositivos. Muchos de los proveedores de hardware también proporcionan máscaras para sus dispositivos.

Otra opción es usar los servicios de un servicio de prueba de terceros. Estos servicios tomarán un APK, lo ejecutarán en varios dispositivos diferentes y, a continuación, proporcionarán comentarios sobre cómo funcionó la aplicación.