Se volete personalizzare le vostre entity su Home Assistant e non trovate l'icona giusta su MaterialDesignIcon siete nel posto giusto!
Questo è un piccolo esempio del risultato:


Ecco in breve i passi da seguire per creare il prorio set di icone da inserire su Home Assistant:

Occorrente:

  • Le icone che vuoi inserire in formato .svg
  • Lo script generate.py che creeremo di seguito

Prima di cominciare!
Copiamo il seguente codice in un editor di testo e salviamolo come "generate.py".

import os

def make_file(directory, name, out):
    out.write('async function getIcon(name) {\n\n')
    for f in os.listdir(directory):
        if not f.endswith('.svg'):
            continue
        with open(os.path.join(directory, f), 'r') as fp:
            name = os.path.splitext(f)[0]
            data = fp.read()
            start = data.find('<path')
            end = data.find('></path')
            out.write('  if (name === "{0}")'.format(name) + ' {\n    return {\n      path: ' + data[start+8:end+0] + ',\n    };\n  }\n\n')
    out.write('\n}\n\nwindow.customIconsets = window.customIconsets || {};\nwindow.customIconsets["svg"] = getIcon;')


with open("svg_icons.js", 'w') as out:
    make_file('.', 'svg', out)

Iniziamo!

  1. Raccogli tutte le icone che vuoi in una cartella.
  2. Vai su IcoMoon.io.
  3. Clicca su "Import icons" e carica tutte le icone raccolte al punto 1.
  4. Cliccate su tutte le icone appena comparse per selezionarle.
  5. Andate su "Generate SVG & More" e subito dopo l'ingranaggio accanto a "Download".
  6. Attivate "Override size" e impostate i pixel su 24, e avviate il download.
  7. Aprite il file "icomoon.zip" appena scaricato e copiate il contenuto della cartella "SVG" dentro la cartella "\config\www" di Home Assistant (la cartella config è quella dove si trova il file configuration.yaml).
  8. Sempre nella stessa cartella copiate il file "generate.py" in allegato.
  9. Se volete, rinominate i file .svg, il nome sarà quello che userete nella configurazione di HA.
  10. Avviate lo script (è necessario che python sia installato sul vostro pc) e vi ritroverete un file chiamato "svg_icons.js".
  11. Su HA, andate su Impostazioni, Plance di Lovelace, Risorse e aggiungete il seguente url /local/SVG/svg_icons.jscome Modulo Javascript e riavviate HA.
  12. A questo punto potrete utilizzare le vostre icone proprio come quelle di MaterialDesignIcon solo che al posto di "mdi:nome-icona" dovrete scrivere "svg:nome-icona".

NB. Se volessi creare più iconset separati basta solo porre alcune modifiche al processo:

  1. Nel codice del file "generate.py" verso la fine sostituire "customIconsets[svg]" con "customIconsets[il codice che vuoi]" per modificare il prefisso "svg:nome-icona" in quello che vuoi.
  2. Raggruppare le icone in una cartella "Nome cartella" e modificare il percorso nel punto 11 in "/local/Nome cartella/svg_icons.js".

UNIAMO LE FORZE!
Ho creato una cartella condivisa su Google Drive.
Chiunque voglia partecipare è ben accetto.

RINGRAZIAMENTI:
thomasloven
SDeSalve
Gianpi

    Wow complimenti, ottimo lavoro!!!

      • Llxs

          Livello 1

        ottimo davvero!!! potresti condividere i tuoi SVG, dallo screen già ne vedo alcuni interessanti?

          ottimo davvero!!! potresti condividere i tuoi SVG, dallo screen già ne vedo alcuni interessanti?

          C'avevo pensato, vorrei poter raccogliere le mie e quelle di chi vuole condividere ma non so se creare qualche cartella in un cloud o altro.

            • KKlagio

                Livello 1

              E' possibile unire gli sforzi e mettere tutte le uniche che tutti generano col metodo descritto, e poi metterle  in condivisione

                Ho creato una cartella su dropbox dove ho messo le mie icone.

                  4 mesi dopo

                  ciao bello ma siccome sono novello 🙂

                  1. Avviate lo script e vi ritroverete un file chiamato "hass-SVG.html"
                    come si fa ? 🙂
                    6 mesi dopo

                    UPDATE!
                    Ho aggiornato la guida dato che dalla v. 110 di HA è cambiato il metodo con cui carica gli iconset personalizzati.

                      un anno dopo

                      stupendo , mi attiveresti per ildrop?

                        giuseppeporcaro Si, mandami il tuo indirizzo e ti aggiungo

                        Caio Sweet ha messo questa discussione in rilievo.
                          9 giorni dopo

                          bel lavoro, veramente....

                            mbriacuni puoi aggiungere anche me? tombarbini@gmail.com. Grazie

                              un mese dopo

                              tbarbini aggiunto

                                grazie

                                  UPDATE:
                                  Ho sostituito la cartella dropbox con una su google drive, così chiunque col proprio account potrà condividere le proprie icone in autonomia 💪

                                    4 mesi dopo

                                    scusate è poco che uso ha , sono rimasto bloccato su avvia lo script......come si fa?

                                    12 giorni dopo

                                    mmmgerry devi aver installato python sul tuo pc

                                      un anno dopo

                                      Ho seguito la procedura, il file che mi genera pyton è "svg_icons" manca .js come nella guida
                                      come procedo?

                                        Ho seguito la procedura, il file che mi genera pyton è "svg_icons" manca .js come nella guida
                                        come procedo?