Las barras de desplazamiento indican la ubicación del usuario en un documento que es más grande que el espacio de visualización. Permiten navegar por el resto del documento moviendo el área de visualización de la ventana hacia arriba o hacia abajo.
Los usuarios interactúan con las barras de desplazamiento mediante el tacto, la rueda giratoria o el panel táctil. Al tocar las flechas de la barra de desplazamiento, el contenido se desplaza por páginas, es decir, en incrementos equivalentes a la altura de la pantalla. Sin embargo, si los usuarios se desplazan rápidamente (dependiendo de la sensibilidad de la pantalla táctil), este movimiento puede generar un impulso inercial que desplaza más de una página. Independientemente de cómo se inicie el desplazamiento, este siempre debería ajustarse a un elemento.
Anatomía
La barra de desplazamiento se compone de las opciones de desplazamiento ascendente y descendente, y del indicador de progreso. Las cheurones se utilizan en las opciones de desplazamiento para indicar la dirección del desplazamiento. El indicador de progreso es un elemento opcional que indica el contenido visible y la posición de desplazamiento en relación con el contenido total de la página.
2. Indicador de progreso de desplazamiento
3. Posibilidad de desplazarse hacia abajo
Especificaciones
Posición de la barra de desplazamiento con navegación principal apilada y barra de control minimizada
Posición de la barra de desplazamiento solo con el encabezado de la aplicación
Posición de la barra de desplazamiento con el encabezado de la aplicación y la barra de control
Posición de la barra de desplazamiento con el encabezado de la aplicación y la barra de control expandida
Posición de la barra de desplazamiento con la barra de aplicaciones/encabezado y la barra de control minimizada
Posición de la barra de desplazamiento solo con la barra de la aplicación/encabezado
Posición de la barra de desplazamiento con el encabezado de la aplicación y la barra de control
Posición de la barra de desplazamiento con el encabezado de la aplicación y la barra de control expandida
Posición de la barra de desplazamiento con altura de pantalla corta
Indicador de progreso de desplazamiento opcional
Estilos
Color
| Elemento | Color (modo día) | Color (modo nocturno) |
|---|---|---|
| Iconos principales - estado activo | Blanco | Blanco @ 88% |
| Iconos principales: estado inactivo | Blanco @ 56% | Blanco al 50% |
| Indicador de progreso de desplazamiento | Blanco @ 16% | Blanco al 12% |
Apresto
| Elemento | Tamaño (dp) |
|---|---|
| Icono principal | 44 |
| Objetivo táctil | 76 |
| Ancho del indicador de progreso de desplazamiento | 6 |
| Radio de esquina redondeado (R4) | Lleno |
Ejemplos
