Szimbólumok

Az összes szimbólumot különböző helyeken használhatja a vizualizáció. Ez lehetővé teszi, hogy változóként vagy szövegként definiálja őket.

A szimbólumok megjelenítéséhez a vizualizáción a következőképpen kell deklarálni őket: [icon:SYMBOLPATH] közvetlenül a szövegben. A szimbólumútvonalat a jobb egérgombbal vagy CTRL+C segítségével másolhatja ki a szimbólumkönyvtárból. Ha lehető, csak a Material Symbols szimbólumokat válassza, hogy a vizualizáció stílusa egységes maradjon.

Szimbólumkönyvtár

Az összes elérhető szimbólumot a Vizualizáció ▸ Szimbólumok kontextmenüből lehet megkeresni és keresni. Lehetőség van saját szimbólumkészletet is importálni a könyvtárba. Az eljárást később részletezzük.

Megjegyzések: A név, amely a szimbólumlistán jelenik meg, nem azonos a szimbólumútvonallevéllel. Ha az útvonalban nincs megadva szimbólumkészlet, akkor automatikusan a Glyphicons készletet használja.

A szűrő a szimbólumkönyvtárban keres a megadott címkéken is. Ha ezt a viselkedést nem kívánja, akkor a szűrőt egy = karakterrel kezdheti, hogy csak a nevekben keressen.

Material Symbols szimbólumkészlet (Alapértelmezett)

Ez az szimbólumkészlet teljesen dinamikus, és a szimbólumok stílusa automatikusan beállítódik a vizualizáció designja szerint. Továbbá automatikusan használja a kitöltött szimbólumot, ha a szimbólum aktívnak kell lennie. Nem minden szimbólumnak van azonban kitöltött változata.

A szimbólumok automatikusan kerekednek, ha a gomb sugarának értéke nagyobb vagy egyenlő 16 pixel. Ha a sugár értéke egyenlő 0px, akkor a éles szimbólumokat használja. Az szerkesztőben azonban mindig a normál szimbólumokat használja.

Megjegyzés: Ajánlott a "Material Symbols" szimbólumkészletet használni, hogy a vizualizáció egységes legyen.

Material Animated szimbólumkészlet

Van néhány kiválasztott Material Symbols szimbóluma, amelyeket animáltak, hogy értékeket jelenítsenek meg. Ezeknek a szimbólumoknak csak egy animációja van az szimbólummal a struktúrával. A kiválasztás után további változók lesznek elérhetőek.

Philips Hue szimbólumkészlet

A Philips Hue szimbólumokat szabadon használhatja, ha a Hue interfészt alkalmazza. Továbbá van egy további Hue-szimbólumkészlet a Home Assistant HASS közösségtől. További információkat talál a fejezet végén.

Időjárási szimbólumkészlet

Ez a szimbólumkészlet az időjárás-szimbólumokat mutatja a vizualizáción. Ezek számos interfésszel integrálva vannak. Lásd a következő fejezetet Időjárási ikonok.

Legacy (elavult) szimbólumkészlet

A Legacy szimbólumkészlet tartalmazza az összes régi vizualizációs szimbólumot. Az új felület megjelenítési stílusa ugyanaz marad. A szimbólumokat már nem szabad használni, mivel a megjelenítés nem optimalizált az új felületre.

Több régi szimbólum továbbra is animált:

  • legacy/door
  • legacy/door_2
  • legacy/lock
  • legacy/shutter
  • legacy/shutter_blinds
  • legacy/window
  • legacy/window_tilt

Rejtett szimbólumok

Van néhány rejtett szimbóluma is a vizualizációnak. Ezekről a következő fejezetekben részletezünk.

A szimbólumok meghívásához csak egy URL-préfix szükséges.

Saját szimbólumkészletek

Lehetőség van saját szimbólumkészletet importálni a projektbe. Minden szimbólumkészletet ZIP-fájlként kell előkészíteni. Néző példaadatok letölthetők innen:

Pro Tip: Sikeres import után exportálhatja a szimbólumkészletet .antobj formátumban, hogy egyszerűsítse az importot. Ehhez kattintson jobbra egy szimbólumkészletre és válassza ki Export.

A következő szabályok határozzák meg az szimbólumkészlet szerkezetét és követelményeit. Olvassa el őket gondosan, és tartsa be őket pontosan.

Szabályok

  • Préfix
    • Csak _, a–z és 0–9 tartalmazhat.
    • A nagybetűk automatikusan kisbetűvé alakulnak.
    • Részvett nevek, mint sys, src vagy doc érvénytelenek.
    • Betűvel (a–z) kell kezdődnie. Csak számok nem engedélyezettek.
    • A végső aláhúzásokat (_) eltávolítják.
    • Legalább 3 karakter hosszúnak kell lennie.
    • A többszörös aláhúzásokat (__) egyedire redukálják.
  • Szimbólumnév
    • Automatikusan kisbetűvé alakulnak.
    • Engedélyezett karakterek: -, _, a–z és 0–9.
    • A hosszú nevek és préfixeket kerülni kell.
    • Egy préfix egyedinek kell lennie, és csak egyszer használható.
    • Ha egy szimbólumnak ugyanaz a név és ugyanaz a préfix, mint egy rendszerszimbólumnak, akkor ezt lehet pótolni.
  • Fájlkorlátozások
    • Maximális fájlméret a tisztítás után: 10 kB. Nagyobb fájlok elutasítanak.
    • Az SVG-fájlok tisztítnak kell lennie:
      • A sorvégjelek automatikusan eltávolítanak.
      • A következő elemek törlődnek: <title>, <desc>, <script>, <image>, <style>, <foreignObject>.
      • A következő attribútumok törlődnek: style, fill, stroke, color, stop-color, flood-color, lighting-color.
      • A beágyazott szkriptumokat, képeket, CSS-t vagy külső erőforrásokat tartalmazó ikonok elutasítanak.
      • Ha a stílusok színeket vagy stílusblokkokat tartalmaznak, az import is elutasíthatja.
  • SVG-fejléc követelmények
    • Tartalmazni kell: viewBox, width és height. Hiányzó értékeket, ha lehető, automatikusan pótolják.
    • Tartalmazni kell a névtér: xmlns="http://www.w3.org/2000/svg". Ha hiányzik vagy hibás, automatikusan pótolják.
    • A szimbólumnév pontosan meg kell feleljen a méreteknek, különben az ikont elutasítják.
    • Az méretek négyzeteseknek kell lennie (Szélesség = Magasság). Alapértelmezett: 24px.
    • A ellentmondó stílusokat vagy illeszkedő méreteket kerülni kell.
  • Általános
    • Rosszul készített ikonok erősen lassíthatják a megjelenítést, vagy hibásan is működhetnek.
    • Figyeljen a szimbólumok szerzői jogaira!
    • Összes vektor három tizedesre kerekedik.

Szerkezet

  • A iconset.ini fájl kötelező a szimbólumkészlet felismeréséhez.
    • Ez lehet a ZIP-fájl gyökérkönyvtárában vagy egy alkönyvtárban.
    • Kisbetűsnek kell lennie (iconset.ini).
    • A szimbólumfájlok nevei nem érzékenyek a nagy- és kisbetűkre.
  • Az import nem keresi automatikusan az SVG-fájlokat.
    • Az ikonkönyvtárat explicit meg kell adni a iconset.ini-ban (figyeljen a nagy- és kisbetűkre).
    • A ZIP-fájl sablonjában egy icons/ nevű könyvtárat definiáltak.
  • Alkönyvtárak
    • A definált könyvtárban (icons/) található alkönyvtárak kategóriákat jelentenek.
    • A szimbólumnévnek egyedinek kell lennie az összes kategória között.
    • Névszabályok a szimbólumkönyvtárban:
      • Minimum: Csak méret és fájlkiterjesztés (pl. 24.svg).
      • Változatok, mint filled24.svg vagy round_filled_24.svg érvényesek.
      • A több számot tartalmazó fájlnév (pl. 24_48.svg) érvénytelen.
      • Stílusváltozatokat felismernek:
        • Kitöltött: Tartalmazni kell a filled vagy fill kifejezést.
        • Kerekített: Tartalmazni kell a round kifejezést.
        • Éles: Tartalmazni kell a sharp kifejezést.
        • A kerekített és éles nem kombinálható egymással.
      • Ha több szabály is teljesül, akkor az utolsó felismert fájlt használja (a kiválasztás véletlenszerűnek tűnhet).
  • További szabályok
    • Nem keresik a fészelt alalkönyvtárakat (ezeket bővítményekhez vagy eredeti fájlokhoz használhatja).
    • A .svg kiterjesztés nélküli fájlokat figyelmen kívül hagyják.
    • Egy szimbólumkönyvtárban lehet egy tags.txt nevű fájl, hogy további címkéket adjon a kereséshez.
      • A címkéket ,, ; vagy sorvégjelek segítségével elválasztva.

Speciális szimbólumkészletek

Van néhány speciális szimbólumkészlet is, amelyeket a saját szimbólumkészletekkel együtt importálhat, azonban nem kell az előbbi szabályok szerint konfigurálni őket.

Hass Hue ikonok

Az egyik a Gibhub oldalról hass-hue-icons. Ez egy további Hue-szimbólumkészlet a Home Assistant HASS közösségtől, és csak nem-kereskedelmi projektekhez használható, mivel ez a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International licenc alatt áll. Ezért a szimbólumkészlet nem kerül beépítésre az Antcas Controlba. A szimbólumokat azonban bármikor importálhatja a projektbe, mint új szimbólumkészlet a hass-hue-icons-main.zip ZIP-fájl segítségével. Figyeljen a projekt licencfeltételeire a Github weboldalon.

Forrás: https://github.com/arallsopp/hass-hue-icons.

Material Design ikonok a Pictogrammers-től

Egy másik a Pictogrammers-től. Ehhez a mdi-###.json fájlt kell ZIP-fájlba csomagolni és importálni. A fájlt a böngésző fejlesztői konzoljában lehet megtalálni és letölteni. Próbálkoznak az outline-szimbólumok kombinálásával a kitöltött szimbólumokkal. A könyvtár majdnem azonos a Material Symbols-szel. Azonban számos közösségi bővítmény van. Ha más szimbólumkészleteket szeretne integrálni a könyvtárba, kérjük, keresse meg minket.

Forrás: https://pictogrammers.com/library/mdi/

Aloldalak