Leçon 6. Icônes et présentation visuelle

📘 Cours : Création d’add-ons pour FreeCAD

Objectif de la leçon : ajouter des icônes aux boutons et à l’environnement de travail pour que l’add-on ait un aspect professionnel.

---

🖼 Partie 1. Formats d’icônes pris en charge

FreeCAD prend en charge :

• SVG (recommandé) — s’adapte sans perte de qualité
• PNG — matriciel, mais facile à utiliser

💡 Les icônes doivent être simples, contrastées et reconnaissables même en petite taille (16×16 ou 24×24 pixels).

---

📁 Partie 2. Structure du dossier d’icônes

Créez un sous-dossier à l’intérieur du dossier de l’add-on :

BoxBuilderAddon/
├── Resources/
│   └── icons/
│       ├── box_builder.svg   ← icône de l'environnement de travail
│       └── create_box.svg    ← icône de la commande
├── InitGui.py
└── box_builder_workbench.py

💡 Le chemin Resources/icons/ est une convention standard dans l’écosystème FreeCAD.

---

🎨 Partie 3. Où trouver des icônes ?

Option 1 : Utiliser les icônes intégrées de FreeCAD

FreeCAD est livré avec des centaines d’icônes. Par exemple :

• :/icons/Part_Box.svg
• :/icons/Document-new.svg

Mais il est préférable de créer les vôtres — pour ne pas dépendre des chemins internes.

Opción 2 : Créer une icône simple manuellement

Exemple : create_box.svg

<!-- create_box.svg -->
<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
  <rect x="10" y="10" width="44" height="44" fill="none" stroke="black" stroke-width="4"/>
  <line x1="10" y1="10" x2="20" y2="0" stroke="black" stroke-width="4"/>
  <line x1="54" y1="10" x2="64" y2="0" stroke="black" stroke-width="4"/>
  <line x1="54" y1="54" x2="64" y2="44" stroke="black" stroke-width="4"/>
  <line x1="20" y1="0" x2="64" y2="0" stroke="black" stroke-width="4"/>
  <line x1="64" y1="0" x2="64" y2="44" stroke="black" stroke-width="4"/>
</svg>

Enregistrez ce code dans le fichier create_box.svg à l’intérieur de Resources/icons/.

💡 Vous pouvez ouvrir le SVG dans un navigateur pour voir le résultat.

---

🛠 Partie 4. Connexion des icônes dans le code

Étape 1. Mettre à jour box_builder_workbench.py

Ajoutez au début du fichier (après les importations) :

import os

Ensuite, trouvez la classe BoxBuilderCommand et mettez à jour la méthode GetResources :

class BoxBuilderCommand:
    def GetResources(self):
        # Chemin vers l'icône
        icon_path = os.path.join(
            os.path.dirname(__file__),
            "Resources", "icons", "create_box.svg"
        )
        return {
            "MenuText": "Box Builder",
            "ToolTip": "Create a box with custom dimensions",
            "Pixmap": icon_path  # ← connectons l'icône
        }
    # ... le reste sans changement

Étape 2. Ajouter une icône pour l’environnement de travail

Dans la classe BoxBuilderWorkbench, ajoutez la propriété Icon :

class BoxBuilderWorkbench(FreeCADGui.Workbench):
    MenuText = "Box Builder"
    ToolTip = "Create custom boxes with GUI"

    # Chemin vers l'icône de l'environnement de travail
    def __init__(self):
        self.Icon = os.path.join(
            os.path.dirname(__file__),
            "Resources", "icons", "box_builder.svg"
        )

    def Initialize(self):
        self.list = ["BoxBuilderCommand"]
        self.appendToolbar("Box Tools", self.list)
        self.appendMenu("Box Builder", self.list)

    def GetClassName(self):
        return "Gui::PythonWorkbench"

⚠️ Si vous n’avez pas créé box_builder.svg — copiez simplement create_box.svg et renommez-le.

---

🧪 Étape 5. Vérification du fonctionnement

1. Assurez-vous que la structure des dossiers est correcte :

   BoxBuilderAddon/Resources/icons/create_box.svg
   BoxBuilderAddon/Resources/icons/box_builder.svg

2. Redémarrez FreeCAD
3. Sélectionnez l’environnement de travail Box Builder

✅ Vous devriez voir :

• Une icône à côté du nom de l’environnement de travail (dans la liste)
• Une icône sur le bouton de la barre d’outils

---

💡 Conseils pour les icônes

• Utilisez du noir sur fond transparent — FreeCAD l’adaptera automatiquement au thème (clair/sombre)
• La taille du SVG n’est pas importante — l’essentiel est qu’il soit vectoriel
• Pour le PNG, utilisez un fond transparent et une taille de 64×64 ou 128×128
• N’utilisez pas de couleurs — les icônes dans FreeCAD sont généralement monochromes

---

🧪 Exercice pratique

1. Créez l’icône box_builder.svg (vous pouvez copier create_box.svg)
2. Trouvez sur internet une icône de boîte SVG gratuite (par exemple, sur Flaticon ou Material Icons) et adaptez-la
3. Essayez d’utiliser le PNG au lieu du SVG — assurez-vous que le fond est transparent

---

🌐 Où trouver des icônes prêtes à l’emploi ?

• Material Design Icons → télécharger en SVG
• Feather Icons → simples et épurées
• Sources FreeCAD → des centaines d’icônes au format .svg

---

▶️ Et ensuite ?

Dans la Leçon 7, nous allons :

• Apprendre à publier un add-on via le gestionnaire d’add-ons officiel
• Créer un fichier package.xml
• Préparer un dépôt sur GitHub
• Faire en sorte que d’autres utilisateurs puissent facilement installer votre add-on