Íconos de la vista de lista

Los íconos de la vista de lista se parecen mucho a los íconos de diálogo, pero usan un efecto de sombra interna en el que la fuente de luz se encuentra por encima del objeto. También están diseñados para usarse solo en un ListView. Algunos ejemplos incluyen la aplicación Configuración.

Como se describe en Cómo proporcionar conjuntos de íconos específicos de densidad, debes crear conjuntos de íconos separados para pantallas de baja, media y alta densidad. Esto garantiza que tus íconos se muestren correctamente en todos los dispositivos en los que se puede instalar tu aplicación. Consulta la tabla 1 para obtener una lista de los tamaños de íconos terminados recomendados para cada densidad. Además, consulta Sugerencias para diseñadores si quieres obtener sugerencias sobre cómo trabajar con varios conjuntos de íconos.

Tabla 1: Resumen de las dimensiones de íconos de la vista de lista finalizadas para cada una de las tres densidades de pantalla generalizadas

	ldpi (120 dpi) (Pantalla de baja densidad)	mdpi (160 dpi) (Pantalla de densidad media)	hdpi (240 dpi) (Pantalla de alta densidad)	xhdpi (320 dpi) (Pantalla de densidad extraalta)
Tamaño del ícono de vista de lista	24 × 24 px	32 × 32 px	48 × 48 px	64 × 64 px

La imagen final debe exportarse como un archivo PNG transparente. No incluyas un color de fondo.

Las plantillas para crear íconos en Adobe Photoshop están disponibles en el Paquete de plantillas de íconos.

Todas las versiones de Android

En los siguientes lineamientos, se describe cómo diseñar íconos de vista de lista para todas las versiones de la plataforma de Android.

Estructura

• Los íconos de las vistas de lista suelen tener un SafeFrame de 1 px, pero está bien usar el área de SafeFrame para el borde del suavizado de una forma redonda.
• Todas las dimensiones especificadas se basan en un tamaño de mesa de trabajo de 32 x 32 píxeles en Photoshop. Mantén 1 píxel de relleno alrededor del cuadro de límite dentro de la plantilla.

Figura 1: SafeFrame y gradiente de relleno para los íconos de la vista de lista. El tamaño del ícono es de 32 x 32

Luz, efectos y sombras

Los íconos de la vista de lista son planos y se muestran de frente con una sombra interna. Creado con un gradiente de luz y una sombra interior, se destacan bien en un fondo oscuro.

Figura 2: Luces, efectos y sombras para los íconos de la vista de lista 1. Sombra interna: negro | opacidad del 57% | ángulo de 120° | modo de combinación normal | distancia de 1 px | tamaño de 1 px 2. Fondo: negro | color estándar del sistema Estos íconos se muestran solo en las vistas de lista. Nota: El ícono de la vista de lista se encuentra en una mesa de trabajo de 32 x 32 px en Photoshop, sin un SafeFrame.

Paso a paso Agrega los efectos que aparecen en la figura 2 para lograr el filtro adecuado. Exporta el ícono a 32 x 32 como un archivo PNG con transparencia habilitada. Crea las formas básicas con una herramienta como Adobe Illustrator. Importa la forma a una herramienta como Adobe Photoshop y escálala para que se ajuste a una imagen de 32 x 32 px en un fondo transparente.