Lektion 6. Symbole und visuelles Design

Lernziel: Füge Schaltflächen und der Arbeitsumgebung Symbole hinzu, um das Addon professionell aussehen zu lassen.

Teil 1. Unterstützte Symbolformate
FreeCAD unterstützt:

SVG (empfohlen) — skaliert verlustfrei
PNG — Rastergrafik, aber einfach zu verwenden

Symbole sollten einfach, kontrastreich und selbst in kleiner Größe (16×16 oder 24×24 Pixel) erkennbar sein.

Teil 2. Ordnerstruktur für Symbole
Erstelle innerhalb des Addon-Ordners einen Unterordner:

BoxBuilderAddon/  
└── Resources/  
    └── icons/  
        ├── box_builder.svg  ← Symbol für die Arbeitsumgebung  
        └── create_box.svg   ← Symbol für den Befehl

Der Pfad Resources/icons/ ist eine Standardkonvention im FreeCAD-Ökosystem.

Teil 3. Woher Symbole beziehen?

Option 1: Integrierte FreeCAD-Symbole verwenden
FreeCAD enthält Hunderte von Symbolen. Beispiel:

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

Es ist jedoch besser, eigene Symbole zu erstellen, um Abhängigkeiten von internen Pfaden zu vermeiden.

Option 2: Ein einfaches Symbol manuell erstellen

Beispiel: 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>

Speichere diesen Code als create_box.svg im Ordner Resources/icons/.
Du kannst die SVG-Datei in einem Browser öffnen, um das Ergebnis zu sehen.

Teil 4. Symbole im Code verknüpfen

Schritt 1. Aktualisiere box_builder_workbench.py

Füge am Anfang der Datei (nach den Importen) hinzu:

import os

Finde dann die Klasse BoxBuilderCommand und aktualisiere die Methode GetResources:

class BoxBuilderCommand:
    def GetResources(self):
        # Pfad zum Symbol
        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  # ← Symbol verknüpfen
        }

Schritt 2. Symbol für die Arbeitsumgebung hinzufügen

Füge in der Klasse BoxBuilderWorkbench die Eigenschaft Icon hinzu:

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

    def __init__(self):
        # Pfad zum Symbol der Arbeitsumgebung
        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"

Falls du box_builder.svg noch nicht erstellt hast – kopiere einfach create_box.svg und benenne sie um.

Teil 5. Überprüfung

Stelle sicher, dass die Ordnerstruktur korrekt ist:

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

Starte FreeCAD neu.
Wähle die „Box Builder“-Arbeitsumgebung aus.

Du solltest Folgendes sehen:

Ein Symbol neben dem Namen der Arbeitsumgebung (in der Liste)
Ein Symbol auf der Symbolleisten-Schaltfläche

Tipps für Symbole

Verwende Schwarz auf transparentem Hintergrund – FreeCAD passt es automatisch an das Theme (hell/dunkel) an.
Die SVG-Größe spielt keine Rolle – Hauptsache, es ist eine Vektorgrafik.
Für PNG: transparenter Hintergrund und Größe von 64×64 oder 128×128 verwenden.
Verwende keine Farben – Symbole in FreeCAD sind üblicherweise monochrom.

Praktische Aufgabe

Erstelle das Symbol box_builder.svg (du kannst create_box.svg kopieren).
Suche online nach einem freien SVG-Box-Symbol (z. B. auf Flaticon oder Material Icons) und passe es an.
Versuche, PNG statt SVG zu verwenden – achte auf transparenten Hintergrund.

Woher fertige Symbole beziehen?

Flaticon ↗ – als SVG herunterladen
Material Icons ↗ – einfach und übersichtlich
Material Design Icons ↗ – Hunderte von Symbolen im .svg-Format
Feather Icons ↗
FreeCAD-Quellen ↗

Was kommt als Nächstes?
In Lektion 7 werden wir:

Lernen, wie man ein Addon über den offiziellen Addon Manager veröffentlicht
Eine package.xml-Datei erstellen
Ein GitHub-Repository vorbereiten
Es anderen Benutzern ermöglichen, dein Addon einfach zu installieren

Lektion 6. Symbole und visuelles Design

Schreibe einen Kommentar Antwort abbrechen