Barre de défilement des fenêtres GTK3, GTK2, Qt, et Firefox

Sous Linux l’aspect des fenêtres dépend de votre thème graphique, GTK ou Qt, de votre gestionnaire de fenêtres, ou encore, dans le cas du navigateur web Firefox, de la configuration «cachée» du programme.

J’ai fait les configurations suivantes sur Ubuntu Openbox 20.04 et Xubuntu 22.04. Le résultat obtenu a été le même dans les deux installations.

Dans le cas de GTK, nous avons couramment, en 2023, les versions GTK2 et GTK3 pouvant être utilisées.

Quand à QT, pour le configurer nous avons le paquet qt5ct dans les dépôts, qui fournit un programme de configuration en mode graphique (une fois installé, on peut le trouver et le lancer depuis le menu des applications sous «Préférences»).

Par ailleurs lorsque vous le configurerez, s’il affiche un message à propos de export QT_QPA_PLATFORMTHEME n’étant pas configuré dans la variable d’environnement, pour le configurer pour tous les utilisateurs, ajoutez-le juste au fichier environment qui se trouve sous le répertoire etc à la racine du système (en mode administrateur).

Vous pouvez utiliser la commande sudo nano /etc/environment, et copier cette ligne dans le fichier environment:

export QT_QPA_PLATFORMTHEME=qt5ct

ou encore pour le configurer juste pour un utilisateur, ajoutez-le dans votre fichier ~/.profile, comme indiqué ici : https://github.com/desktop-app/qt5ct.

Configuration des barres de défilement de Firefox

Je commence par le plus compliqué.

Par défaut, c’est à peine si on voit la barre de défilement à droite de la fenêtre quand on visite une page web assez longue.

Firefox avant de le reconfigurer

Barre de défilement par défaut

Nous pouvons forcer la barre de scroll à rester affichée. Les réglages proposés changeront l’aspect des barres latérales autant que des barres horizontales sur des pages web plus larges que vos fenêtres de navigation.

Pour faire cela, rendez-vous dans les paramètres : cliquez en haut à droite sous les onglets de navigation du navigateur web sur les 3 petites barres horizontales (nommées Menu hamburger, ou encore Menu tiroir) qui permettent d’afficher les menus, cliquez ensuite sur Paramètres et depuis la section Général descendez jusqu’à Navigation. Sélectionnez «Toujours afficher les barres de défilement»

Firefox paramètres navigation

Et voilà, l’ascenseur reste à sa place, il ne se cache plus !

Barre de défilement Firefox non masquée

Maintenant, la barre est visible mais elle semble toujours un peu trop étroite pour les yeux de certains internautes, et le bouton de navigation également. Voici comment les modifier:

Ouvrons un nouvel onglet dans Firefox et dans la barre d’adresse, juste sous les onglets, on saisit «about:config» et on valide la question qui demande si on veut vraiment faire ça («Accepter le risque et poursuivre»).

Firefox « about:config »

Maintenant, dans le champ qui fait face à l’icône “loupe” nous cherchons la ligne suivante:

widget.non-native-theme.scrollbar.size.override

là, nous cliquons sur l’icône “crayon” 📝  et nous changeons le chiffre “0” pour une taille en pixels personnalisée, par exemple, “15”, puis cliquez sur le bouton “coche” ☑️ qui a remplacé le bouton “croyon” 📝. La taille s’ajustera tout de suite, vous pouvez ainsi faire des essais successifs, selon votre vue et selon la résolution de votre écran.

Maintenant, la barre de défilement est plus large, mais le bouton de défilement n’a pas suivi. Nous cherchons, maintenant, dans le même champ supérieur de la fenêtre «about:config» la ligne suivante:

widget.non-native-theme.scrollbar.style

(Remplacez juste la partie «size.override» par «style» dans la ligne).
Et cette fois, nous choisirons l’une des options suivantes, référencées, curieusement, sur une page qui nous parle… De Windows 11 (et sous Linux aussi, ça marche !) :

0 – Système par défaut

1 – Style MacOS

2 – Style GTK

3 – Style Google Android

4 – Style Windows 10

5 – StyleWindows 11

Différents styles de barres de défilement

Image AskVG.com [EN] – https://www.askvg.com/tip-restore-full-classic-scrollbars-in-mozilla-firefox-on-windows-11

Sous Linux, le style par défaut est plutôt celui que l’on voit en 1 ou en 2. Vous pouvez maintenant remplacer le 0  en face de widget.non-native-theme.scrollbar.style par l’un des chiffres correspondants à l’image ci-dessus de la même manière, en cliquant sur le crayon pour permettre l’édition, puis sur la coche pour sauvegarder. Selon l’ordinateur, votre vue, la résolution de votre écran, et selon votre environnement de bureau, le résultat obtenu pourra être différent.

Dans mon PC de travail, c’est le choix 4 qui va le mieux, dans mon PC fixe c’est trop large. De même, l’apparence d’un choix de largeur de barre associé à un choix de style donnera un rendu différent selon que vous ayez ou non paramétré Firefox pour Toujours afficher les barres de défilement.

N’hésitez pas à essayer plusieurs choix.

Enfin, si vous êtes gaucher, utilisez une souris pour gaucher, vous pourriez apprécier d’avoir cette scrollbar à gauche, comme indiqué sur ce tutoriel : https://www.pcastuces.com/pratique/astuces/5564.htm.

De la même manière que précédemment dans la fenêtre “about:config”

Dans le champ Rechercher, saisissez layout.scrollbar, éditez l’option, et fixez sa valeur à 3 avant de valider.

Configuration des barres de défilement des fenêtres GTK

pour rappel, l’acronyme GTK vient de Gimp Toolkit.

Pour configurer les fenêtres des environnements GTK2 et GTK3 nous procèderons ainsi:

1. Éditer le fichier caché ~/.gtkrc-2.0 ou ~/.gtkrc-2.0.mine
2. Éditer le fichier caché ~/.config/gtk3/gtk.css

pour le fichier caché .gtkrc-2.0 (ou *.mine), sous ce qui s’y trouve déjà, ajoutez:

style « myscrollbar »
{
GtkScrollbar::slider-width=15
}
class « GtkScrollbar » style « myscrollbar »

Vous pouvez choisir une valeur différente, bien entendu.

Dans le fichier gtk.css, que vous devrez peut-être créer, (il n’existe pas forcément) vous indiquerez:

.scrollbar.vertical slider,
scrollbar.vertical slider {
min-width: 15px;
}
scrollbar.horizontal slider {
min-height: 15px;
}

vous pouvez choisir des valeurs différentes de celles-ci, et même des valeurs différentes pour la barre verticale, et la barre horizontale, à votre guise.

Configuration des barres de défilement des fenêtres QT

Cela se prononce “cute”, comme en anglais pour “mignon” (:kioût)

Lorsque vous employez un environnement basé sur Gnome (Mate, Xfce, Gnome aussi bien sûr, parmi d’autres) vous pouvez utiliser Qt5ct pour personnaliser les fenêtres de vos applications venant du monde QT.

Si votre système utilise encore Qt4, vous aurez besoin de qtconfig-qt4. Avec Qt5ct, voici ce que vous pouvez faire pour modifier l’apparence de vos applications:

Dans le dernier onglet à droite, Style des feuilles, cochez les deux premiers choix, scrollbar-simple.qss et fusion-fixes.qss puis cliquez en bas à droite sur le bouton Appliquer.

Dernier onglet à droite Qt5ct Style des feuilles

Ensuite, rendez-vous dans le premier onglet de gauche, Apparence et sous le bouton face à l’option Style, choisissez fusion. Vous pouvez essayer les autres styles disponibles, par exemple, Breeze apparaîtra, si vous avez le paquet Breeze installé.

Qt5ct premier onglet à gauche Apparence

Voici ce que ça donne avec un pdf affiché dans Okular

Apparence Okular après configuration Qt5