Barra de control

La barra de controles proporciona controles asociados con una vista en particular. Muestra hasta 5 controles en la versión no expandida y hasta 5 controles adicionales cuando se expande.

En las apps de música, la barra de control se usa en la vista de reproducción para los controles Reproducir/Pausar, Anterior, Siguiente y otros, incluidos los para acciones personalizadas de terceros.


Anatomía

La barra de control tiene dos formatos: no expandido y expandido. La versión no expandida puede incluir hasta 5 controles. En las apps de música, una de ellas es Reproducir/Pausar.

Cuando se expande, la barra de control puede incluir hasta 5 controles adicionales en una segunda fila. Los usuarios pueden seleccionar el botón de menú ampliado para expandir o contraer la barra de control.

1. Parte de la barra de control visible antes de la expansión
2. Parte expandida de la barra de acciones
3. Uno de los controles
4. Botón ampliado (se expande y contrae la barra de control)

Especificaciones

Barra de control

Barra de control expandida

Colocación de 1 a 4 controles en la barra de control con un control central fijo

Un control central fijo es un control con una ubicación preferida en el centro de la barra de control, como un botón para reproducir/pausar música.

Posición de 1 a 4 controles en la barra de control sin un control fijo

Colocación de 6 a 9 controles en la barra de control


Cómo ajustar diseños

Estos diseños de referencia muestran cómo adaptar la barra de control para adaptarse a pantallas de varios anchos y alturas. Las categorías de ancho y altura se definen en la sección Diseño. Ten en cuenta que todos los valores de píxeles están en píxeles renderizados, antes de que se realice cualquier reducción o sobremuestreo.

Pantallas extra anchas con más de 1,028 dp entre los márgenes

Cuando el ancho entre los márgenes sea superior al ancho máximo de la barra de control (1,028 dp), centra la barra de control en sentido horizontal. La barra de control no se extenderá hasta los márgenes.

Pantallas extra anchas con menos de 1,028 dp entre los márgenes

Pantallas panorámicas

Pantallas de ancho estándar

En pantallas de ancho estándar, centra la barra de control horizontalmente. La barra de control se extenderá hacia los márgenes. En una pantalla de ancho estándar de exactamente 690 dp, como en este ejemplo, usa un relleno lateral de P5 entre los bordes de la barra de control y los bordes de la pantalla.

Pantallas cortas

Se expandió la barra de control en pantallas de menos de 1,000 dp

Se expandió la barra de control en pantallas cortas

Se expandió la barra de control en pantallas de más de 1,000 dp


Estilos

Color

Elemento Color(modo diurno) Color (modo nocturno)
Íconos principales White Blanco @ 88%
Lámina de pantalla completa Negro @ 78% Negro 84%
Lámina de gradientes Por definir Por definir

Tamaño

Elemento Tamaño (dp)
Barra de control 96 (pantallas cortas) / 128 (altura estándar y superiores)
Ícono principal 44

Ejemplos

Barra de control en la vista de reproducción
Barra de control expandida en la vista de reproducción
Barra de control en la cola de contenido multimedia
Barra de control expandida en la cola de contenido multimedia
Barra de control en la cola de contenido multimedia
Barra de control expandida en la cola de contenido multimedia
La barra de control se expande y se contrae cuando un usuario presiona el botón de menú ampliado