Indicador de progreso del contenido multimedia

El componente del indicador de progreso multimedia es exclusivo de las apps de contenido multimedia.

El indicador de progreso es una representación visual de la duración y el tiempo de reproducción transcurrido de una fuente multimedia. Aparece en las apps de música durante la reproducción.


Anatomía

El indicador de progreso de contenido multimedia consta de una pista inactiva (en gris) que representa la duración de la fuente de contenido multimedia y una pista activa (que se muestra con un color de acento) que se superpone a la pista inactiva para indicar el tiempo de reproducción transcurrido.

Anatomía del indicador de progreso de medios
1. Pista activa
2. Pista inactiva

El indicador de progreso de medios puede ser lineal o circular.

Indicador de progreso lineal de contenido multimedia

El indicador de progreso lineal muestra la duración y el tiempo transcurrido en un eje horizontal. La parte visible del seguimiento se centra en un área de objetivo táctil de 76 dp. Si el usuario presiona o arrastra el tiempo transcurrido, se puede mover a diferentes ubicaciones en la fuente de contenido multimedia. El indicador de progreso multimedia lineal está diseñado para pantallas de 800 dp o más altas.

Anatomía del indicador de progreso circular

El indicador de progreso circular muestra la duración y el tiempo transcurrido en forma de círculo. No puedes presionar ni arrastrar el tiempo transcurrido para moverte a diferentes ubicaciones. El indicador de progreso multimedia circular está diseñado para pantallas de menos de 800 dp y se usa cuando se minimizan los controles de reproducción de contenido multimedia.

Estados del indicador de progreso de contenido multimedia

Durante la reproducción, el indicador de progreso se encuentra en uno de los siguientes cuatro estados:

  • Reproduciendo: Se está reproduciendo contenido multimedia y la pista activa avanza por la pista inactiva para indicar el tiempo transcurrido.
  • Pausada: El usuario pausó la reproducción. La pista activa permanece quieta en el punto en el que se pausa la reproducción.
  • Almacenamiento en búfer: La app de música está cargando contenido para reproducirlo. El indicador muestra una línea blanca que avanza repetidamente por la pista inactiva mientras se carga el contenido.
  • Error: No se puede reproducir el contenido multimedia. No hay un segmento activo y uno inactivo está inhabilitado.
La pista activa avanza por la pista inactiva a medida que se reproduce el contenido multimedia
Estado de reproducción: La pista activa avanza por la pista inactiva a medida que se reproduce el contenido multimedia.
La pista activa permanece fija mientras la reproducción de contenido multimedia está pausada
Estado de pausa: La pista activa permanece fija mientras la reproducción de contenido multimedia está pausada.
Una línea blanca avanza repetidamente por el segmento inactivo mientras se carga el contenido.
Estado de almacenamiento en búfer: Una línea blanca avanza repetidamente por la pista inactiva mientras se carga el contenido.
La pista inactiva se inhabilita cuando se produce un error de reproducción del medai. Estado de error: Cuando se produce un error multimedia, no se muestra ningún segmento activo y se inhabilita el segmento inactivo.

Especificaciones

Indicador de progreso lineal de contenido multimedia

Revisión del indicador de progreso de contenido multimedia lineal

Indicador de progreso de contenido multimedia circular

Revisión del indicador de progreso de contenido multimedia circular

Personalización

Durante la reproducción de contenido multimedia, se muestra la pista activa del indicador de progreso multimedia con un color de acento. El color predeterminado es un tono de azul. Los desarrolladores de apps pueden optar por proporcionar un color para los elementos destacados de la app que refleje su marca de medios. Del mismo modo, los OEM pueden proporcionar un color de elementos destacados que refleje la marca de su automóvil. Si se proporciona, el color de los elementos destacados del OEM tiene prioridad sobre el color de los elementos destacados de una app.

Barra de progreso de medios lineal que muestra un segmento activo con colores de los elementos predeterminados, de terceros y del OEM
El estilo predeterminado del indicador de progreso es el tono azul. Los desarrolladores de apps pueden anular el estilo predeterminado de la app con el color de los elementos destacados de su propia marca (en este ejemplo, el verde). Los OEMs también pueden anular el estilo predeterminado y el de la app con el color de los elementos destacados de su propia marca (en este ejemplo, naranja).
Barra de progreso de contenido multimedia circular que muestra un segmento activo con los colores predeterminados, de terceros y de OEM
Ejemplos de estilos de colores de acento predeterminados, de apps y de OEM aplicados a un indicador de progreso circular

La Guía de integración de la biblioteca de IU del vehículo proporciona orientación de los OEM para personalizar componentes.

Si quieres obtener orientación específica sobre cómo usar color para personalizar componentes, consulta Color.


Ejemplos

Indicador de progreso de medios lineal en acción
Indicador de progreso multimedia lineal en la vista de reproducción de la app de música
Indicador de progreso de contenido multimedia circular en acción
Aquí, el indicador de progreso de contenido multimedia circular aparece en el control de reproducción minimizado. El control minimizado se superpone a la pantalla de una lista de reproducción.