Créer un bouton ‘slider’ sur Excel

Les boutons de type ‘slider’, ou ‘toggle switch’, sont ces boutons que l’on fait glisser vers la gauche ou la droite pour activer ou désactiver une option. Ils sont devenus très courants avec les smartphones, et sont maintenant aussi utilisés sur PC, notamment dans certains menus Windows 10. Ci-dessous deux exemples sur Windows 10 justement et sur Android 6.0 Marshmallow.

Exemples boutons slider toggle switch windows 10 android 6

Et si on essayait de les reproduire dans Excel. Pour rendre un tableau de bord interactif, c’est plus sympa qu’un simple bouton.


 

Pourquoi utiliser un 'slider' ?

Nous le disions en introduction, ce type de bouton sert généralement à activer ou désactiver un paramètre. Il peut aussi être utile pour régler une option qui n’a que deux choix possibles.
On peut donc imaginer beaucoup de cas où un tel bouton peut servir sur un reporting ou un autre fichier :

  • Affichage des montants en € ou k€
  • Tracé ou non d’une moyenne sur un graphique
  • Activation d’une hypothèse sur un fichier de simulation
  • Comparaison avec le budget ou le réel N-1
  • ...

Bref, il y a beaucoup de possibilités. Reprenez vos fichiers, je suis sûr que vous allez trouver plein d’applications possibles.
Et puis, on l’a vu en introduction, un ‘slider’ c’est plus original. Ça change complètement du bouton basique et le moindre reporting prend une autre allure.

Créer ce genre de boutons n’est pas très complexe. Ça demande un peu de temps pour le régler correctement et un peu de code VBA mais une fois fait, on peut le réutiliser facilement. Détaillons ensemble les étapes.

 

Dessiner le slider

Commençons par dessiner le bouton. On va le faire en deux parties : la barre de fond sur laquelle va glisser le bouton puis le bouton lui-même.
Pour la barre, on insère un rectangle à coins arrondis dans les formes du menu Insertion.

Insertion rectangle coins arrondis

Une fois dessiné, on le modifie pour arrondir au maximum les angles à l’aide du bouton jaune sur la forme.

Reglage angle rectangle coins arrondis

On dessine ensuite un cercle que l’on vient positionner par-dessus la forme précédente.
On fait en sorte que le cercle ‘s’insère’ parfaitement sur cette barre en réglant sa taille dans le menu Outils de dessin / Format.
Ici, le cercle a un diamètre de 1,4 cm pour une barre de 1,5 cm de haut.

Reglage hauteur cercle bouton

Pour faciliter les manipulations à venir, on attribue un nom à chaque forme. Ici pour faire simple, on les a appelées ‘Barre’ et ‘Bouton’ comme nommées jusqu’ici.
On a également ajouté le texte ‘OFF’ au bouton. Il est à gauche donc en position ‘désactivé’. Le paramétrage VBA inclura la modification du texte en ‘ON’ lorsqu’il se trouve à droite.
De même, les couleurs seront paramétrées dans le code. Pour être plus visuel, le slider sera affiché en vert lorsqu’il est activé, en rouge sinon. Laissons donc les couleurs telles qu’elles.

Attribution nom bouton forme dessin
 

Paramétrer le slider

Le slider sera paramétré en VBA mais avant de nous lancer dans le code, il nous faut d’abord une cellule ‘contrôle’ qui va nous permettre de déterminer dans quelle position se trouve le slider.
Pour cela, on utilise la cellule A1, on lui attribue le nom ControleSlider, pour l’identifier plus facilement. Consultez cet article pour savoir comment définir un nom dans un classeur.
Et on lui attribue la valeur 0, en position off. Cette valeur sera modifiée en 1 en position on.

Attribution nom cellule controle

Nous allons donc rédiger une procédure VBA pour opérer 4 modifications :

  • Changer le texte
  • Changer les couleurs
  • Déplacer le bouton
  • Changer la valeur de la cellule contrôle

 

Procédure VBA et explications

Dans un module, on place la procédure suivante :

Sub Slider_Change()

If Range("ControleSlider").Value = 0 Then

Sheets(1).Shapes("Barre").Fill.ForeColor.RGB = RGB(197, 225, 180)
With Sheets(1).Shapes("Bouton")
.Fill.ForeColor.RGB = RGB(84, 131, 53)
.IncrementLeft 69.75
.TextFrame2.TextRange.Text = "ON"
End With
Range("ControleSlider").Value = 1

Else

Sheets(1).Shapes("Barre").Fill.ForeColor.RGB = RGB(236, 170, 170)
With Sheets(1).Shapes("Bouton")
.Fill.ForeColor.RGB = RGB(192, 0, 0)
.IncrementLeft -69.75
.TextFrame2.TextRange.Text = "OFF"
End With
Range("ControleSlider").Value = 0

End If

End Sub

 

La première condition If Range("ControleSlider").Value = 0 Then permet de vérifier la valeur de départ de la cellule contrôle.

  • Si elle est à zéro, le slider est off, on va donc l’activer.
  • Sinon, le slider est on, on le désactive.

Les actions sont ensuite similaires, seules changent les valeurs en fonction du cas dans lequel on se trouve. Regardons le 1er cas, lorsque nous activons le slider.

  • Sheets(1).Shapes("Barre").Fill.ForeColor.RGB = RGB(197, 225, 180) : modifie la couleur de remplissage de la barre
  • With Sheets(1).Shapes("Bouton") … End With : cette section et les 3 lignes à l’intérieur agissent sur le bouton
  • .Fill.ForeColor.RGB = RGB(84, 131, 53) : modifie la couleur de remplissage du bouton
  • .IncrementLeft 69.75 : déplace le bouton vers la droite
  • .TextFrame2.TextRange.Text = "ON" : modifie le texte du bouton
  • Range("ControleSlider").Value = 1 : met à jour la valeur de la cellule contrôle pour prendre en compte le nouvel état du slider

On affecte ensuite cette procédure à la barre et au bouton. Ainsi, peu importe sur quelle forme on clique, la procédure est exécutée.

Affectation macro forme
 

Adapter la procédure

Pour les couleurs, j’ai opté pour le vert et le rouge. Pour les modifier, il suffit de choisir une couleur manuellement et de vérifier son ‘code’ via le menu Autres couleurs de remplissage.
Les valeurs Rouge, Vert, Bleu doivent être placées dans le même ordre dans le code RGB.

Parametres couleur rouge vert bleu

L’incrémentation, ou le déplacement du bouton, dépend de la taille de la barre en arrière-plan. C’est difficile à déterminer, chaque cas est différent.
Pour être sûr d’avoir la bonne valeur, le plus simple est de passer par l’enregistrement d’une macro. Cliquez sur ce lien pour savoir comment faire.
On lance l’enregistrement et on déplace manuellement le bouton jusqu’à la droite. On stoppe l’enregistrement et on récupère la valeur...

Deplacement manuel forme enregistrement macro

Enfin pas exactement. Excel a décomposé le moindre mouvement, il faut donc faire la somme de toutes les valeurs après IncrementLeft pour obtenir le décalage complet.
Ça reste bien plus rapide que de faire plusieurs essais.

Macro enregistree deplacement forme

Pour le texte ou la cellule contrôle, il suffit de modifier la valeur dans le code.
Attention, il faut aussi changer la condition d’entrée sur la cellule contrôle en conséquence.

Modification valeurs cellule controle
 

Résultat final et intégration aux calculs

Voilà à quoi ressemble le slider dans les deux positions.

Resultat final slider position on off

Pour le faire interagir avec le reste de la feuille de calcul, on peut utiliser la valeur de la cellule contrôle.
De la même manière qu’on le ferait avec une liste déroulante de type Formulaire de contrôle, comme nous l’avions vu dans ce précédent article.
Nous avions également utilisé une méthode similaire pour intégrer une liste déroulante classique, établie avec une validation de données, consultez notre article.
 

Si vous voulez réutiliser ce slider, téléchargez le fichier. Vous y retrouverez également le code, avec les explications sur chaque ligne.

logo telecharger fichier

Dites-nous en commentaires ce que vous pensez du résultat final. Il me semble que c’est un bon moyen de commencer à transformer un simple fichier Excel en une application.

 

Abonnez-vous à la newsletter

Illustration couverture ebook 100 trucs et astuces pour Excel-ler au travail

Et recevez gratuitement l'ebook 100 trucs et astuces pour Excel-ler au travail (5€ sur Amazon)

Votre adresse mail ne sera pas communiquée et vous pourrez vous désabonner à tout moment.

Taggé .Mettre en favori le Permaliens.

Laisser un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.