Definición de Barra de desplazamiento (Scrollbar)
La barra de desplazamiento es un elemento de las interfaces gráficas que consta de una barra horizontal o vertical (o ambas) con dos extremos con flechas que apuntan en sentidos contrarios y que suelen ubicarse en los extremos de una ventana o recuadro.
En inglés: Scrollbar.
Las barras de desplazamiento permiten desplazar el contenido del cuadro o área de trabajo hacia un lado u otro.
Las barras suelen aparecer o activarse cuando el recuadro o la ventana no es lo suficientemente grande como para visualizar todo el contenido del documento en el que se trabaja.
Además de las flechas en los extremos, la barra de desplazamiento también cuenta con un área central, conocida como "pulgar", que se desplaza a lo largo de la barra en función del desplazamiento del contenido. Esta área central es la que se utiliza para arrastrar y desplazar el contenido de manera más precisa.
En algunas interfaces gráficas, la barra de desplazamiento puede tener una apariencia personalizada, adaptada al diseño y estilo de la aplicación. También es común encontrar opciones de configuración para ajustar el comportamiento y la apariencia de la barra de desplazamiento, como el tamaño del pulgar o la velocidad de desplazamiento.
A medida que se desplaza el contenido, los extremos de la barra muestran una flecha en la dirección del desplazamiento, indicando la posibilidad de seguir desplazándose en esa dirección. Si el contenido ya está en el extremo, la flecha correspondiente se encuentra desactivada y no permite seguir desplazándose en esa dirección.
Es importante tener en cuenta que la barra de desplazamiento es una herramienta fundamental para la navegación dentro de una ventana o área de trabajo que contiene una gran cantidad de contenido. Sin ella, sería imposible acceder a toda la información y desplazarse de manera cómoda y eficiente.
Funcionamiento de las barras de desplazamiento
La barra de desplazamiento es una técnica de interacción que permite continuar con un texto, imagen u otro contenido que pueda ser desplazado en una determinada dirección (arriba, abajo, izquierda o derecha) en una pantalla, ventana o pestaña.
Permite desplazarse y ver todo el contenido del documento aunque sólo sea visible en pantalla una fracción del mismo en un determinado momento.
Ofrece una solución al problema de navegación entre lo visible y no visible dentro de un espacio de dos dimensiones.
Características de las barras de desplazamiento
Las barras de desplazamiento se introdujeron en las primeras interfaces gráficas y están disponibles en todo tipo de dispositivos como computadoras, calculadoras gráficas, teléfonos celulares, reproductores multimedia, etc.
El usuario interactúa con una barra de desplazamiento empleando algún método y la barra de desplazamiento lo traduce en comandos de desplazamiento, el usuario recibirá la respuesta de forma visual.
Si bien el diseño de barras de desplazamiento ha cambiado a lo largo de los programas (como puede verse en la imagen), usualmente aparece en uno o ambos lados del área visible como áreas rectangulares que contienen una barra (llamada a veces thumb) que puede ser arrastrada a lo largo de esta para así mover el cuerpo del documento.
Este rectángulo puede ser ubicado verticalmente, horizontalmente o en ambas, dependiendo del sentido en se expande el contenido fuera de los bordes. Usualmente se incluyen flechas para indicar el sentido de desplazamiento.
También se incluye un rectángulo interno que indica en qué porción o posición del documento nos encontramos desplazados. Este rectángulo es llamado thumb en inglés (pulgar), pero también se encuentra con otros nombres como scroller, knob (en Java), scroll box o scroll thumb en Microsoft, y también se encuentra con el nombre de elevator, quint, puck, wiper o grip.
En español podemos llamarlo simplemente barra. Entonces sería la barra de la barra de desplazamiento.
En ocasiones el tamaño de este rectángulo o barra nos indica el tamaño del documento que estamos desplazando. Mientras más pequeño sea el rectángulo, más documento grande será el documento a desplazar. Esta característica fue agregada en Windows recién en su versión 95.
Si el rectángulo no está presente, significa que la barra no se puede desplazar porque no es necesario. En ocasiones la barra de desplazamiento directamente desaparece.
En algunos sistemas operativos como Windows, pegado a la barra de desplazamiento en el extremo de abajo de la derecha de ciertas ventanas y elementos, es posible encontrar un pequeño botón cuadrado que permite redimensionar la ventana. Esto puede activar o desactivar las barras de desplazamiento cuando sea necesario.
Formas de desplazar una barra de desplazamiento
Los métodos para desplazar la barra de desplazamiento han variado a lo largo de los años e incluso se han mejorado con el surgimiento de ciertas tecnologías, como el touchpad o la pantalla táctil y multitáctil.
Arrastrar el thumb o barra con el cursor
La forma clásica de desplazar la barra de desplazamiento es con el cursor del ratón, moviendo el thumb o rectángulo (barra) de desplazamiento hacia un lado u otro. Se hace clic sostenido sobre este y se desplaza, finalmente soltando el clic en la posición deseada. Existen ratones con un tercer botón que permite desplazar el documento al presionarlos y mover el puntero del ratón.
Uso de la rueda scroll
Algunos ratones cuentan con una rueda que permite desplazarse rápidamente por un documento. Este desplazamiento es controlado por la barra de direcciones. Usualmente el desplazamiento es vertical, pero hay ratones que también incluyen desplazamiento horizontal, incluso direcciones diagonales. La velocidad con la que se desplaza depende de la configuración del ratón.
Uso de las teclas de cursor o de direcciones o de edición
También se pueden emplear las teclas de direcciones o también llamadas de cursor (arrow keys) para desplazarse por un documento. Con estas teclas desplazaremos la ventana o elemento activo en ese momento.
También están las teclas de edición: Inicio (Home), Fin (End), Página Arriba (PgUp), Página abajo (PgDn), que nos permite desplazar rápidamente dentro de un documento. Ver también: Teclas de desplazamiento.
Uso del dedo o lápiz en pantallas táctiles
En el caso de las pantallas táctiles, es posible emplear el dedo o un lápiz para desplazar un documento. La técnica puede ser tanto tocando la barra desplazamiento como arrastrando el documento (como agarrando o presionando el documento con el dedo).
Desplazamiento rápido
También es posible desplazarse rápidamente en un documento haciendo clic en algún lugar de la barra de desplazamiento. Es decir, no es necesario arrastrar el thumb (o rectángulo interno o barra) para desplazarse. Al hacer clic en una parte cualquiera de la barra de desplazamiento, inmediatamente será mostrada la parte correspondiente del documento.
Desplazamiento lento empleando las flechas
Es posible también desplazarse usando las flechas contenidas en la barra de desplazamiento (si es que están disponibles). Se hace clic en la flecha que corresponde y el documento se desplaza lentamente (en ocasiones una única línea) por cada clic que se haga.
En ocasiones aparecen flechas dobles, una al lado de la otra. De esta manera nos permiten ir arriba o abajo rápidamente sin desplazar el cursor hacia el otro extremo de la barra de desplazamientos.
Uso del trackpad o touchpad
También es posible desplazar un documento empleando el dispositivo trackpad o touchpad, generalmente disponibles en computadoras portátiles. Usualmente para desplazar el contenido, el dedo se debe desplazar en el extremo derecho o en el extremo de abajo del touchpad.
En algunos casos es posible emplear algunos gestos especiales en el touchpad para desplazar el documento activo. Por ejemplo, pinchando (usando dos dedos) el touchpad, permite "agarrar" el documento.
Futuras técnicas de desplazamiento en documentos
Se han probado técnicas para desplazar un documento empleando el movimiento de los ojos.
También se ha logrado desplazar en algún sentido un documento empleando el pensamiento y complejas máquinas que escanean el cerebro.
Estas tecnologías de punta se encuentran en desarrollo.
Resumen: Barra de desplazamiento
La barra de desplazamiento es una herramienta en las interfaces gráficas que permite mover el contenido de una ventana o recuadro hacia los lados. Aparece cuando el contenido no cabe en la pantalla.
¿Para qué sirve la barra de desplazamiento?
La barra de desplazamiento se utiliza en las interfaces gráficas para permitir la navegación o desplazamiento de contenidos que exceden la capacidad visible de una ventana o recuadro. Esto es especialmente útil cuando se trabaja con documentos largos o páginas web extensas.
¿Cómo usar la barra de desplazamiento?
Para utilizar la barra de desplazamiento, simplemente tienes que arrastrar el deslizador de la barra hacia arriba o hacia abajo (en el caso de una barra vertical) o hacia la izquierda o hacia la derecha (en el caso de una barra horizontal). También puedes hacer clic en las flechas en los extremos de la barra para desplazarte por el contenido de manera más precisa.
¿Cuál es la diferencia entre una barra de desplazamiento horizontal y una vertical?
La principal diferencia entre una barra de desplazamiento horizontal y una vertical radica en su orientación. Una barra de desplazamiento horizontal se encuentra ubicada en la parte inferior de una ventana y se utiliza para desplazarse de izquierda a derecha, mientras que una barra vertical se encuentra en el costado derecho de una ventana y se usa para desplazarse de arriba hacia abajo.
¿Es posible personalizar la apariencia de la barra de desplazamiento?
Sí, en algunos casos se puede personalizar la apariencia de la barra de desplazamiento para adaptarla al diseño de la interfaz gráfica. Esto puede incluir cambios en el color, estilo, tamaño y otros aspectos visuales de la barra. Sin embargo, no todos los sistemas operativos o aplicaciones permiten esta personalización.
¿Qué ocurre si el contenido no es visible en la ventana pero no hay barra de desplazamiento?
Si el contenido dentro de una ventana o recuadro excede su capacidad visible, pero no hay barra de desplazamiento, eso significa que no tienes una forma directa de acceder al contenido oculto. Esto puede dificultar la visualización o interacción con dicho contenido, por lo que es importante contar con una barra de desplazamiento para facilitar la navegación.
¿Existen alternativas a la barra de desplazamiento tradicional?
Sí, existen diversas alternativas a la barra de desplazamiento tradicional, como el gesto de deslizamiento en dispositivos táctiles, la rueda de desplazamiento de los mouse o trackpad, los botones de flecha en teclados o incluso comandos de teclado específicos. Estas alternativas pueden variar dependiendo del dispositivo y la aplicación utilizada.
| Elementos típicos de las interfaces gráficas de usuario (GUI) | |
Entrada de comandos |
Botón • Menú contextual • Menu (y Submenú) • Menú desplegable • Menú pastel (pie menu) • Menú hamburguesa |
Entada/salida de datos |
Casillero de verificación • Lista • Lista desplegable (combo box) • Botón de opción (radio button) • Cuadro de texto • Grid view (datagrid) • Botón de opción (Radio button) • Barra de desplazamiento (scrollbar) |
Informativos |
Icono • Barra de estado (status bar) • Globo de ayuda (ballon help) • Barra de progreso • Barra de título • Slider • Spinner • Caja de texto (Text box o Cuadro de texto) • HUD (heads-up) • Infobar • Etiqueta (label) • Splash screen • Throbber • Toast • Tooltip |
Contenedores |
Ventana • Acordeón • Ribbon • Disclosure widget (expansor o Combutcon) • Cuadro (frame/fieldset) • Barra de menú (menubar) • Panel • Panel lateral • Pestaña (tab) • Barra de herramientas |
De navegación |
Barra de direcciones • Breadcrumb • Hipervínculo • Vista de árbol (treeview) |
Ventanas especiales |
Acerca de (about box) • Cuadro de diálogo (dialog box) • Cuadro de diálogo de archivos • Inspector window • Modal window • Ventana de paleta |
Relacionados |
Widget |
Autor: Leandro Alegsa
Actualizado: 31-07-2023
¿Cómo citar este artículo?
Alegsa, Leandro. (2023). Definición de Barra de desplazamiento. Recuperado de https://www.alegsa.com.ar/Dic/barra_de_desplazamiento.php
• Ver todas las Imágenes para Barra de desplazamiento |
