Lekcja 6. Ikony i projektowanie wizualne

Samouczek: Tworzenie dodatków do FreeCAD

Cel lekcji: Dodaj ikony do przycisków i stołu roboczego, aby dodatek wyglądał profesjonalnie.

In Questo Articolo

🖼️ Część 1. Obsługiwane formaty ikon

🖼️ Część 1. Obsługiwane formaty ikon

FreeCAD obsługuje:

SVG (zalecane) — skaluje się bez utraty jakości
PNG — rastrowe, ale łatwe w użyciu

💡 Ikony powinny być proste, kontrastowe i rozpoznawalne nawet w małym rozmiarze (16×16 lub 24×24 pikseli).

📁 Część 2. Struktura folderów z ikonami

Wewnątrz folderu dodatku utwórz podfolder:

BoxBuilderAddon/
└── Resources/
    └── icons/
        ├── box_builder.svg     <-- ikona stołu roboczego
        └── create_box.svg      <-- ikona polecenia

💡 Ścieżka Resources/icons/ jest standardową konwencją w ekosystemie FreeCAD.

🎨 Część 3. Skąd wziąć ikony?

Opcja 1: Użyj wbudowanych ikon FreeCAD

FreeCAD zawiera setki ikon. Na przykład:

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

Ale lepiej jest tworzyć własne, aby uniknąć zależności od wewnętrznych ścieżek.

Opcja 2: Utwórz prostą ikonę ręcznie

Przykład: 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>

Zapisz ten kod jako create_box.svg wewnątrz Resources/icons/.

💡 Możesz otworzyć plik SVG w przeglądarce, aby zobaczyć rezultat.

🛠️ Część 4. Podłączanie ikon w kodzie

Krok 1. Zaktualizuj `box_builder_workbench.py`

Dodaj na początku pliku (po importach):

import os

Następnie znajdź klasę BoxBuilderCommand i zaktualizuj metodę GetResources:

class BoxBuilderCommand:
    def GetResources(self):
        # Ścieżka do ikony
        icon_path = os.path.join(
            os.path.dirname(__file__),
            "Resources", "icons", "create_box.svg"
        )
        return {
            "MenuText": "Box Builder",
            "ToolTip": "Utwórz pudełko o niestandardowych wymiarach",
            "Pixmap": icon_path  # <-- podłącz ikonę
            # ... reszta bez zmian
        }```

#### **Krok 2. Dodaj ikonę dla stołu roboczego**

W klasie `BoxBuilderWorkbench` dodaj właściwość `Icon` wewnątrz metody `__init__`:

python
class BoxBuilderWorkbench(FreeCADGui.Workbench):
MenuText = „Box Builder”
ToolTip = „Twórz niestandardowe pudełka za pomocą GUI”

# Ścieżka do ikony stołu roboczego
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("Narzędzia Pudełka", self.list)
    self.appendMenu("Box Builder", self.list)

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

„`

❗️ Jeśli nie utworzyłeś box_builder.svg — po prostu skopiuj create_box.svg i zmień jego nazwę.

🧪 Część 5. Weryfikacja

Upewnij się, że struktura folderów jest poprawna:
- BoxBuilderAddon/Resources/icons/create_box.svg
- BoxBuilderAddon/Resources/icons/box_builder.svg
Uruchom ponownie FreeCAD.
Wybierz stół roboczy Box Builder.

✅ Powinieneś zobaczyć:

Ikonę obok nazwy stołu roboczego (na liście).
Ikonę na przycisku paska narzędzi.

💡 Wskazówki dotyczące ikon

Używaj czarnego koloru na przezroczystym tle — FreeCAD dostosuje go do motywu (jasnego/ciemnego).
Rozmiar SVG nie ma znaczenia — najważniejsze, że jest to wektor.
Dla PNG użyj przezroczystego tła i rozmiaru 64×64 lub 128×128.
Nie używaj kolorów — ikony w FreeCAD są zwykle monochromatyczne.

✍️ Zadanie praktyczne

Utwórz ikonę box_builder.svg (możesz skopiować create_box.svg).
Znajdź darmową ikonę pudełka SVG online (np. na Flaticon lub Material Icons) i dostosuj ją.
Spróbuj użyć PNG zamiast SVG — upewnij się, że tło jest przezroczyste.

🌍 Gdzie znaleźć gotowe ikony?

Material Design Icons → pobierz jako SVG
Feather Icons → proste i czyste
Źródła FreeCAD → setki ikon w formacie .svg

▶️ Co dalej?

W Lekcji 7 będziemy:

Uczyć się, jak opublikować dodatek za pośrednictwem oficjalnego Menedżera dodatków.
Tworzyć plik package.xml.
Przygotowywać repozytorium GitHub.
Ułatwiać innym użytkownikom instalację Twojego dodatku.