Scrollbar

Zone affichant un texte entourée d'une barre de défilement verticale et d'une horizontale ; une flèche est à l'extrêmité de chaque barre.

Une barre de défilement, souvent appelée ascenseur, est un composant d'interface graphique rattaché à une zone d'affichage rectangulaire. La barre de défilement permet de faire défiler le contenu de la zone avec la souris lorsque la hauteur ou largeur de la zone est insuffisante pour afficher l'intégralité de son contenu. La barre peut être verticale pour un défilement de haut en bas ou horizontale pour un défilement de gauche à droite. Les barres se trouvent généralement sur le bord des fenêtres et des zones de texte multilignes.

Apparence

Une barre de défilement est constituée d'un rectangle contenant une barre coulissante et des flèches. Les barres de défilement sont disposées sur le côté de la zone d'affichage à faire défiler, généralement à droite ou en dessous. La barre coulissante a généralement une longueur proportionnelle au contenu affiché ; on parle d'« ascenseur proportionnel ». Plusieurs anciennes interfaces graphiques (Mac OS<9, Windows 3.x) représentaient la barre coulissante par un simple carré qui ne donnait aucune indication du pourcentage de contenu affiché.

Les flèches sont disposées soit à chaque bout de la barre de défilement, soit à l'un des bouts, soit sur la barre coulissante elle-même. Le fait de rassembler la paire de flèches sur le même bout permet de passer d'une flèche à l'autre avec un mouvement de souris minimal. Une disposition alternative consiste à avoir une paire de flèches aux extrémités en bas à droite, là où les barres horizontales et verticales se rejoignent, et une seule flèche à l'autre extrémité.

Lorsque toute la hauteur ou toute la largeur du contenu est affichée, la barre de défilement est désactivée. Plusieurs conventions existent pour indiquer cet état.

	La barre coulissante occupe toute la longueur de la barre de défilement, et il n'est donc plus possible de la faire coulisser. On remarque sur cet exemple que les flèches sont grisées pour indiquer leur désactivation.
	La barre coulissante n'est plus affichée et les flèches sont grisées pour indiquer leur désactivation.
	La barre de défilement est intégralement retirée, et la place libérée est donnée à la zone d'affichage. Cette solution a l'avantage d'augmenter la surface d'affichage utile. Toutefois, lorsque la taille du contenu ou de la zone d'affichage varient, l'apparition et la disparition des barres de défilement peuvent être déconcertantes.

Interaction

La plupart des barres disposent de trois modes d'interaction.

• Le glisser-déposer de la barre coulissante fait défiler en même temps le contenu de la zone d'affichage, pour autant que les capacités de traitement de l'ordinateur le permettent. Durant le glissement, il n'est pas nécessaire de conserver le pointeur sur la barre, toutefois certains systèmes (comme Windows) annulent le défilement si l'on s'éloigne un peu trop de la barre. Le même effet est souvent accessible avec les touches directionnelles du clavier.
• Le pointer-et-cliquer à côté de la barre coulissante fait défiler l'affichage d'une longueur d'affichage visible. Pour le défilement vertical, le même effet et souvent accessibles avec les touches de défilement Page Up et Page Down du clavier.
• Le pointer-et-cliquer sur une des flèches de la barre cause un premier mouvement de défilement lorsque le bouton de la souris est pressé, ensuite le défilement est poursuivi tant que le bouton reste enfoncé et qu'il reste du contenu à faire défiler.

Souris à deux boutons et une molette

Molette de souris

Le défilement est une interaction simple et courante. Depuis les années 2000, de nombreuses souris sont équipées d'une molette dont la rotation cause un défilement vertical de la zone pointée.

• Portail de l’informatique