Les info-bulles dans EEP

Bienvenue dans cet article. Aujourd'hui nous allons détailler la fonctionnalité des info-bulles applicables à certaines classes d'objets.

Les info-bulles sont bien pratiques pour afficher des informations à des endroits pertinents et ciblés dans un réseau. Elles sont souvent utilisées comme repères ou annotations lors de la construction de grands projets.

L'affichage des info-bulles s'effectue en mode 3D et peuvent même être formatées avec du texte en gras, italique et en couleur.

Introduction

Pour commencer, "qu'est-ce-qu'une info-bulle ?". Une info-bulle est une bulle dans laquelle est affiché un texte sur une ou plusieurs lignes. Quelques exemples en images ci-dessous :

Image info-bulle arbre érable dans EEP
Info-bulle par défaut
Image info-bulle buissons dans EEP
Info-bulle fond bleu et texte couleur blanche
Image info-bulle tonneaux dans EEP
Info-bulle fond par défaut et texte couleur verte
Image info-bulle véhicule dans EEP
Info-bulle personnalisée

Présentation des info-bulles

Pour afficher la fenêtre des info-bulles, cliquez sur le bouton Info-bulle dans les propriétés des objets. Exemple avec un contact :

Image bouton info-bulle dans EEP

Après avoir cliqué sur ce bouton, la fenêtre suivante va s'afficher :

Image interface info-bulle dans EEP

Cette fenêtre est composée d'une large zone de saisie, deux boutons pour choisir une couleur de premier plan et d'arrière-plan, une case à cocher pour afficher ou non la bulle et un bouton pour valider le tout.

Les couleurs par défaut sont le noir pour le texte et le blanc pour l'arrière-plan. Vous pouvez changer à volonté ces couleurs à l'aide des deux boutons dédiés.

Dans le deuxième exemple au début de cet article, un fond bleu et un texte de couleur blanche ont été choisis pour afficher l'info-bulle.

Nous allons maintenant améliorer l'affichage des info-bulles en personnalisant l'apparence pour la police de caractère, ajouter plusieurs couleurs dans une même bulle et paramétrer l'alignement.

Personnalisation des info-bulles

La personnalisation des info-bulles passe par l'utilisation de 'balises', un peu comme le langage html.

Tout d'abord, qu'est-ce-qu'une balise ? pour faire simple une balise commence toujours par le signe <. Après ce signe, une ou plusieurs lettres peuvent être utilisées un peu comme un code pour modifier la mise en forme du texte ou encore sa couleur. Chaque code correspond à une commande précise listée ci-dessous :

  1. ‹j› = Alignement à gauche,
  2. ‹r› = Alignement à droite,
  3. ‹c› = Centré,
  4. ‹br› = Nouvelle ligne (br = break en anglais),
  5. ‹fgrgb=0,0,0› = Couleur du texte,
  6. ‹bgrgb=0,0,0› = Couleur de l'arrière plan (uniquement à l'emplacement du texte et non pas dans la totalité de la bulle),
  7. ‹b›........‹/b› = Caractères en gras (b = bold en anglais),
  8. ‹i›........‹/i› = Caractères en italique (i = italic en anglais).

Nous allons commencer simplement avec la première balise <j> pour aligner le texte à gauche. Par exemple on pourrait écrire :

Image interface info-bulle alignement à gauche dans EEP

Et le résultat en 3D :

Image info-bulle alignement à gauche 3D dans EEP

Maintenant le même texte mais cette fois-ci centré :

Image info-bulle centrée 2D dans EEP

Et le résultat en 3D :

Image info-bulle centrée 3D dans EEP

Nous allons garder le même texte et introduire un retour à la ligne avec la balise ‹br›, br = break en anglais :

Image info-bulle centrée 2D dans EEP

Et le résultat en 3D :

Image info-bulle centrée 3D dans EEP

Quelques petites précisions : différentes balises peuvent être employées simultanément. Dans cet exemple, une première balise ‹br› a été placée entre la 1ère et la 2ème phrase du premier paragraphe. Ensuite, deux autres balises ‹br› placées après le premier paragraphe provoquent un saut de ligne pour afficher le 2ème paragraphe.

Nous allons garder le même texte et introduire la notion des couleurs avec les deux balises ‹fgrgb=0,0,0› et ‹bgrgb=0,0,0›.

L'abbréviation fgrgb à gauche du signe égal pour la balise ‹fgrgb=0,0,0› veut dire en anglais foregroundredgreenblue. On peut traduire foreground par premier plan et redgreenblue par RVB les trois couleurs primaires rouge - vert - bleu. Cette balise va donc modifier la couleur du texte au premier plan.

L'abbréviation bgrgb à gauche du signe égal pour la balise ‹bgrgb=0,0,0› veut dire en anglais backgroundredgreenblue. On peut traduire background par arrière-plan et redgreenblue par RVB les trois couleurs primaires rouge - vert - bleu. Cette balise va donc modifier la couleur d'arrière-plan du texte.

Les trois chiffres après le signe égal exprime la valeur décimale pour chacune des trois couleurs. Les valeurs admises sont comprises entre 0 et 255. Le mélange des trois permet d'obtenir des couleurs différentes. Par exemple :

  • 0,0,0 = noir,
  • 255,255,255 = blanc,
  • 255,0,0 = rouge,
  • 255,255,0 = jaune,
  • 255,76,185 = rose,
  • etc...

Voici l'adresse d'un excellent site où vous pouvez définir une couleur personnalisée en faisant glisser les 3 curseurs des couleurs primaires afin d'obtenir les valeurs décimales correspondantes à intégrer ensuite dans les propriétés fgrbg ou bgrgb.

Nous allons reprendre l'exemple de notre phrase et appliquer deux couleurs différentes à l'arrière-plan des paragraphes :

Image info-bulle arrière-plan coloré dans EEP

Et le résultat en 3D :

Image info-bulle arrière-plan coloré 3D dans EEP

L'utilisation répétée de la balise bgrgb permet d'obtenir différentes couleurs appliquées à l'arrière-plan du texte et non pas dans la totalité de la bulle. Nous verrons par la suite comment appliquer une couleur d'arrière-plan globale.

Le même principe s'applique également pour la couleur du premier-plan :

Image info-bulle texte en couleur 2D dans EEP

Et le résultat en 3D :

Image info-bulle texte en couleur 3D dans EEP

L'utilisation répétée de la balise fgrgb permet d'obtenir différentes couleurs appliquées à la couleur du texte.

Ici, on peut se poser la question : "pourquoi définir une couleur pour le texte alors que le bouton Couleur premier plan est là pour ça ?"

Réponse : et bien pas tout à fait ! la balise fgrgb utilisée pour la couleur du texte sera toujours prioritaire si vous l'utilisez par rapport au bouton Couleur premier plan, car vous avez la possibilité d’appliquer plusieurs couleurs au texte dans une même bulle.

A l’inverse, la couleur d’arrière-plan définie via le bouton Couleur arrière-plan affecte la totalité de la bulle. Mais si la balise bgrgb est utilisée conjointement, la couleur d’arrière-plan du texte sera différente par rapport à la couleur d’arrière-plan de la bulle.

Exemple en image ci-dessous :

Image info-bulle texte en couleur 3D dans EEP

Quelques petites observations à relever dans cet exemple. La couleur d'arrière-plan a été choisie via le bouton Couleur arrière-plan en bas de la fenêtre. Cette couleur ne s'applique pas à l'arrière-plan des phrases car la couleur de celles-ci a été définie par la balise bgrgb. La troisième phrase hérite la couleur d'arrière-plan de la 2ème phrase car aucune nouvelle balise bgrgb n'a été utilisée pour cette troisième phrase. Si aucune balise bgrgb n'avait été ajoutée, l'arrière-plan des phrases serait lui aussi de couleur verte.

Ce qui est vrai pour l'arrière-plan l'est aussi pour le premier plan. Malgré la couleur turquoise sélectionnée via le bouton Couleur premier plan, le texte des trois phrases possède sa propre couleur car la balise fgrgb a été utilisée. La couleur turquoise est simplement ignorée.

Il nous reste maintenant à étudier les deux dernières balises utilisées pour mettre en gras et/ou en italique le texte. Jusqu’ici nous avions une seule balise ’ouvrante’. Désormais nous avons une balise ’ouvrante’ au début et une balise ’fermante’ à la fin avec un /.

Tout texte écrit entre les deux balises ‹b›........‹/b› sera mis en gras. Exemple en image ci-dessous :

Image info-bulle texte en couleur 3D dans EEP

Dans cet exemple, les deux phrases sont comprises entre les deux balises ‹b›........‹/b›. La couleur du texte correspond à la couleur choisie via le bouton Couleur premier plan. En effet, le texte ne contient aucune balise fgrgb.

Le même principe s'applique si vous voulez afficher du texte en italique, il suffit de le placer entre les deux balises ‹i›........‹/i› comme dans l’exemple ci-dessous :

Image info-bulle texte en couleur 3D dans EEP

Dans ce dernier exemple, seule la deuxième phrase est en italique car elle placée entre les deux balises ‹i›........‹/i›.

Note : Différentes couleurs d'arrières-plans peuvent être utilisées en fonction des types d'objets. Par exemple pour l'immobilier : du bleu, les signaux : du vert, les aiguillages : du jaune, etc... Cette méthode utilisée conjointement avec l'affichage de certaines propriétés utiles dans le texte, s'avère bien pratique pour visualiser les informations des objets comme les ID des aiguillages lors de la construction d'un réseau ou tout simplement un repère, une coordonnée...

Possibilités étendues

Individuellement pour chaque info-bulle, vous avez le choix de l’afficher en cochant la case Afficher la bulle. Dans le cas contraire, décochez la case si vous ne souhaitez pas la voir apparaître.

Vous pouvez également utiliser la commande du menu Affichage → Afficher les info-bulles pour afficher ou masquer les info-bulles. Cette commande agit sur la totalité des info-bulles contenues dans un projet.

Et si tout cela ne suffisait pas, 6 fonctions Lua apportent encore plus d’interactivité en ajoutant la possibilité de modifier dynamiquement les info-bulles lorsque votre réseau est en cours d’exploitation !

Ces 6 fonctions concernent la signalisation, les aiguillages, les structures et éléments de paysage. Dans la suite de cet article, nous allons nous limiter à la simple description de ces fonctions. Elles feront l'objet d'un autre article détaillé pour la mise en œuvre dans un réseau. Pour le moment, gardez en mémoire qu'une fonction Lua ne peut être appelée qu'à partir d'un point de contact ou d'une autre fonction Lua.

Pour la signalisation
Fonction EEPShowInfoSignal()

Affiche ou masque l'infobulle du signal spécifié par son numéro ID (numéro d'identification). Dans un premier temps, il nous faut récupérer le n° ID du signal (encadré en rouge) qui se trouve dans l'en-tête de la fenêtre des propriétés du signal en question. L'image ci-dessous nous montre le résultat :

Image info-bulle texte signal fonction lua dans EEP

Une fois le n° ID récupéré, il suffit de le renseigner dans le premier paramètre de la fonction. Le deuxième paramètre prend respectivement la valeur true ou false pour afficher ou masquer l'infobulle.

Voici le code de cette fonction pour afficher l'info-bulle du signal n° 1 :

-- Affiche l'info-bulle du signal n° 1
EEPShowInfoSignal(1, true)

Et le code pour la masquer :

-- Masque l'info-bulle du signal n° 1
EEPShowInfoSignal(1, false)

En langage informatique, les mots clés true et false sont des constantes directement intégrées aux langages de programmation. La constante true peut se traduire par vrai et inversement, false peut se traduire par faux.

Vous trouverez à la fin de cet article un petit projet à télécharger avec deux fonctions lua pour masquer ou afficher l'info-bulle d'un signal.

Fonction EEPChangeInfoSignal()

Assigne un nouveau texte dans l'infobulle d'un signal spécifié par son numéro ID. Dans un premier temps, il nous faut récupérer le n° ID du signal. La fonction précédente nous a montré comment procéder. Ensuite une fois le N° ID récupéré, le deuxième paramètre est tout simplement le nouveau texte à afficher dans l'info-bulle.

Voici le code de cette fonction pour assigner un nouveau texte dans l'info-bulle du signal n° 1 :

-- Assigne un nouveau texte dans l'info-bulle
EEPChangeInfoSignal(1, "Je suis le nouveau texte")

Et le résultat en image :

Image info-bulle Lua aiguillage dans EEP
Pour les aiguillages
Fonction EEPShowInfoSwitch()

Affiche ou masque l'infobulle d'un aiguillage spécifié par son numéro ID. Dans un premier temps, il nous faut récupérer le n° ID de l'aiguillage qui se trouve dans la fenêtre des propriétés de l'aiguillage en question.

L'image ci-dessous nous montre le résultat :

Image info-bulle Lua aiguillage dans EEP

L'ID d'un aiguillage ne se trouve pas dans l'en-tête de la fenêtre des propriétés de la voie mais dans le cadre Affichage commutateur d'aiguillage (entouré en bleu dans l'image). L'ID entouré en rouge et hachuré correspond à celui de la voie !

Une fois le n° ID récupéré, il suffit de l'écrire dans le premier paramètre de la fonction. Le deuxième paramètre prend la valeur true ou false respectivement pour afficher ou masquer l'infobulle.

Voici le code de cette fonction pour afficher l'info-bulle de l'aiguillage n° 2 :

-- Affiche l´info-bulle de l´aiguillage n° 2
EEPShowInfoSwitch(2, true)

Et le code pour la masquer :

-- Masque l´info-bulle de l´aiguillage n° 2
EEPShowInfoSwitch(2, false)
Fonction EEPChangeInfoSwitch()

Assigne un nouveau texte dans l'infobulle d'un aiguillage spécifié par son numéro ID. Une fois le N° ID récupéré, le deuxième paramètre est tout simplement le nouveau texte à afficher dans l'info-bulle.

Voici le code de cette fonction pour assigner un nouveau texte dans l'info-bulle de l'aiguillage n° 2 :

-- Assigne un nouveau texte dans l'info-bulle
EEPChangeInfoSwitch(2, "Je suis le nouveau texte !")
Pour les structures ou le paysage
Fonction EEPShowInfoStructure()

Affiche ou masque l'infobulle d'un élément de paysage ou d'une structure immobilière spécifié par le nom lua de l'objet. Dans un premier temps, il nous faut récupérer ce nom qui se trouve dans la fenêtre des propriétés de l'objet en question. L'image ci-dessous nous montre où le chercher :

Image info-bulle texte structure immobilière fonction lua dans EEP

Le nom lua d'un objet commence toujours par le signe # suivi d'un numéro quelque soit à la classe à laquelle il appartient. Après le numéro figure le nom du modèle. Bien entendu, EEP n'impose pas de saisir le nom complet ! Seuls le signe # et le numéro sont nécessaires.

Une fois le nom lua récupéré, il suffit de l'écrire dans le premier paramètre de la fonction entre guillemets car il s'agit d'une chaine de caractères. Le deuxième paramètre prend la valeur true ou false respectivement pour afficher ou masquer l'infobulle.

Voici le code de cette fonction pour afficher l'info-bulle du panneau avec le nom lua #9 :

-- Affiche l´info-bulle du panneau n° 9
EEPShowInfoStructure("#9", true)

Et le code pour la masquer :

-- Masque l´info-bulle du panneau n° 9
EEPShowInfoStructure("#9", false)
Fonction EEPChangeInfoStructure()

Assigne un nouveau texte dans l'infobulle d'un élément de paysage ou d'une structure immobilière spécifié par le nom lua de l'objet. Une fois le nom lua récupéré, le deuxième paramètre est tout simplement le nouveau texte à afficher dans l'info-bulle.

Voici le code de cette fonction pour assigner un nouveau texte dans l'info-bulle du panneau n° 9 :

-- Assigne un nouveau texte dans l'info-bulle
EEPChangeInfoStructure("#9", "Je suis le nouveau texte")

Conclusion

Utiliser les info-bulles apporte une aide bienvenue pendant la construction de grands réseaux. Vous pouvez aussi les utiliser dans des petits projets à partager dans un but pédagogique car cela permet de fournir des indications pour les autres utilisateurs.

Soyez tout de même attentif de ne pas trop en abuser car cela pourrait nuire à la lisibilité si vous avez beaucoup d'objets concentrés dans un périmètre restreint.

Vous trouverez ci-dessous le fichier projet avec les exemples de l'article et deux fonctions lua pour masquer et afficher l'info-bulle d'un signal.

Les info-bulles

Projet de démonstration avec les exemples des info-bulles de l'article.

Merci d'avoir lu cet article. Si vous avez des questions ou des suggestions, n’hésitez pas à nous en faire part en bas de cette page en commentaires.

Amusez-vous à lire un autre article. A bientôt !

0 0 votes
Évaluation de l'article
S’abonner
Notification pour
guest
0 Commentaires
Commentaires en ligne
Afficher tous les commentaires
Retour en haut