Pack d'interfaccia
Nightcity Controlli — casella, interruttore e cursore
19 controlli d’interfaccia notte al neon: casella, radio, interruttore, cursore e contatore, con stati acceso, spento, parziale e disattivato resi dalla forma.

Su questo pack
Controlli da 26px con geometria quadrata dall'inizio alla fine — in questo stile non c'è alcuna curva, quindi l'aiutante tondo disegna un quadrato smussato. Lo stato spuntato si riempie con l'accento invece di schiarire il tracciato, perché un tracciato più chiaro si legge come focus e non come acceso.
Il set copre ciò di cui una schermata impostazioni ha davvero bisogno: una casella, un radio, un interruttore, un cursore con manopola separata e una coppia contatore per valori discreti. Ogni controllo con stati fornisce ogni stato come file proprio su base 26×26: l’interruttore è 52×26 e la guida del cursore larga 208 px, così da estenderla in nine-slice a qualsiasi lunghezza. Il cursore arriva anche vuoto, pieno e verticale, perché una colonna del volume non è una riga ruotata.
Acceso e spento sono disegnati come forme diverse, non come colori diversi. Una casella non spuntata è un incavo vuoto; una spuntata è una superficie piena con una spunta ritagliata dentro. Conta perché la schermata delle impostazioni è proprio dove è più probabile che un giocatore stia usando una modalità per daltonici, uno shader in scala di grigi o un post-processing molto tinto — e uno stato leggibile solo dalla tonalità sparisce sotto tutti e tre.
Il cursore arriva come guida e manopola invece che come sprite unico. Animare un cursore monopezzo significa ridisegnarlo a ogni valore; con due pezzi estendi il riempimento e sposti la manopola, che è ciò che ogni toolkit d’interfaccia si aspetta già. La manopola porta una tacca centrale perché rotazione e posizione restino leggibili in piccolo, e una variante premuta aggiunge un anello d’accento per lo stato di trascinamento.
Disattivato è uno sprite a sé per ogni controllo con stati, non una tinta applicata a runtime. Un’impostazione non disponibile e una spenta sono cose diverse — una dice "spento", l’altra "non puoi toccarlo" — e una schermata che le mostra uguali manda il giocatore a cercare un bug che non esiste. La casella fornisce anche uno stato parziale per la riga "seleziona tutto" sopra un elenco misto, cioè esattamente il caso che una casella a due stati riporta male.
Tutto è incluso come SVG modificabile e come PNG piatto trasparente a 1x, 2x e 4x, disegnato con gli stessi sei toni blu mezzanotte del resto della famiglia Nightcity.
Download
Link diretto · senza registrazione · senza pagina d'attesaSet completo — 8 sorgenti SVG, esportazioni PNG a 1x/2x/4x, licenza e readme
Come si usa
- Scambia l'intera texture tra i file acceso e spento invece di tingere un solo sprite; i due stati differiscono nella forma, quindi una tinta da sola non li riproduce.
- Il binario del cursore accetta il nine-slice con 9 px di terminale per lato — stira il centro e le estremità arrotondate restano intatte a qualsiasi larghezza.
- In Unity, collega i due file alle grafiche Background e Checkmark del componente Toggle, oppure scambia lo sprite in un handler onValueChanged se preferisci una sola immagine.
- Centra la manopola sul bordo del riempimento: è larga 22 px, quindi spostala di metà dal bordo destro del riempimento perché stia sul valore e non dopo di esso.
Licenza
Creative Commons Attribuzione 4.0 — Gratis per uso commerciale. Attribuzione obbligatoria. Termini completi · Cosa significa in pratica
"Nightcity Controlli — casella, interruttore e cursore" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/nightcity-ui-controls


