W trybie edycji dashboardu, po zaznaczeniu kontrolki typu Grafika, w prawym panelu bocznym pojawiają się zaawansowane opcje konfiguracji elementu. Panel ten pozwala kontrolować sposób kadrowania obrazu, jego zachowanie przestrzenne, kolorystykę oraz pełną typografię podpisów.

Zarządzanie właściwościami odbywa się za pomocą trzech dedykowanych zakładek wybieranych ikonami z menu pionowego po prawej stronie panelu.

📑 1. Zakładka: Opcje i styl (Ikona linii)

Pierwsza zakładka odpowiada za geometrię, skalowanie oraz dopasowanie przesłanego pliku graficznego do fizycznych granic kafelka osadzonego na dashboardzie.

🖼️ Sekcja: Dopasowanie grafiki

Lista rozwijalna pozwala zdefiniować jeden z dwóch trybów renderowania obrazu:

• Dopasuj – obraz jest skalowany proporcjonalnie w taki sposób, aby cała jego zawartość bezwzględnie mieściła się wewnątrz krawędzi kafelka. Zapobiega to ucinaniu jakichkolwiek fragmentów grafiki. Jeśli proporcje pliku różnią się od proporcji kafelka, po bokach lub na górze/dole mogą pojawić się puste marginesy (uzupełniane kolorem tła).

• Wypełnij – grafika zostaje przeskalowana tak, aby całkowicie i szczelnie wypełniła całą dostępną przestrzeń kafelka, eliminując powstawanie marginesów. Jeśli proporcje kafelka i pliku są różne, nadmiarowe fragmenty obrazu zostaną automatycznie wykadrowane (przycięte) na krawędziach.

🎨 2. Zakładka: Kolory (Ikona palety)

Druga zakładka umożliwia modyfikację środowiska kolorystycznego w obrębie konturu widgetu.

🎨 Dostępne parametry kolorystyczne:

• Kolor tytułu (Tekst) – otwiera systemowy próbnik barw i pozwala określić kolor czcionki nagłówka oraz tekstu pomocniczego przypisanego do tej grafiki.

• Kolor tła (Tło) – określa barwę podkładu pod warstwą graficzną. Opcja ta jest kluczowa w dwóch przypadkach:

  1. Przy stosowaniu trybu skalowania „Dopasuj” (pozwala estetycznie zamaskować puste marginesy wokół obrazu).

  2. Przy wykorzystywaniu plików z przezroczystym kanałem alfa, np. formatów .png lub .svg (pozwala idealnie stopić tło grafiki z motywem dashboardu).

⚙️ 3. Zakładka: Dodatkowe opcje (Ikona suwaków/ustawień)

Trzecia zakładka odpowiada za wyświetlanie warstwy tekstowej oraz szczegółowe formatowanie krojów pism.

⚙️ Parametry zaawansowane i edycja stylu:

• Widoczność tytułu i opisu grafiki – przełącznik „Pokazuj tytuł i opis” globalnie włącza lub wyłącza warstwę tekstową nad obrazem. Po wyłączeniu widget staje się czystym nośnikiem wizualnym.

• Opcje i styl tytułu – przełącznik „Domyślne z ustawień dashboardu” kontroluje priorytet stylów:

  • Gdy opcja jest włączona, krój, rozmiar oraz formatowanie czcionki dopasowują się automatycznie do ogólnego motywu graficznego wybranego dla całego dashboardu.

  • Gdy opcja zostanie wyłączona, system odblokowuje poniższe parametry do indywidualnej stylizacji:

    • Czcionka – lista rozwijalna pozwalająca zmienić rodzinę czcionki (np. domyślna czcionka systemowa Roboto).

    • Rozmiar czcionki – selektor numeryczny określający wielkość tekstu wyrażoną w punktach (np. 14).

    • Styl formatowania – przyciski szybkiego wyboru pozwalające nadać cechy tekstu: B (Pogrubienie – Bold) oraz I (Kursywa – Italic).

    • Wyrównanie tekstu – zestaw czterech przycisków definiujących pozycjonowanie tekstu w osi poziomej kafelka: do lewej, do środka (centrowanie), do prawej oraz wyrównanie obustronne (wyjustowanie).