Da SVG a disegnabili vettoriali: Il Modo Migliore per Personalizzare Android Icone

Garret Cole
Garret Cole

Seguire

Ott 21, 2016 · 2 min leggere

Uno dei più popolari modi di gestione delle icone personalizzate in ambito Android, il progetto di sviluppo è quello di utilizzare vettoriale drawables. Si tratta di file XML che descrivono il percorso in cui un drawable può essere reso in fase di esecuzione all’interno dell’app Android. Per ottenere il vettore disegnabile, è possibile convertire un file SVG in questo formato. Recentemente, questo è stato reso più facile con gli ultimi aggiornamenti di Android Studio. Tuttavia, se sei come alcuni di noi che sono abituati alla vecchia pipeline, puoi convertire SVG in drawable vettoriali con questo pratico strumento.

L’ovvio vantaggio dell’utilizzo di drawable vettoriali è l’impronta dimensionale del tuo APK. La differenza nella dimensione di un’app con vettori rispetto alle immagini è piuttosto significativa. Invece di avere diverse immagini pacchettizzate per ogni risoluzione DPI supportata dall’app, hai un singolo file di testo moderatamente piccolo con il percorso dell’immagine come contenuto.

Quando si utilizzano immagini normali come PNG per le icone, è semplice determinare la risoluzione nativa ispezionando l’immagine per le sue dimensioni rispetto al suo bucket DPI. È ancora più semplice con i drawable vettoriali, ma ci sono due diverse altezze e larghezze dichiarate all’interno dell’XML. Hai viewportWidth e width. Il viewportWidth è in realtà la dimensione che la risorsa verrà disegnata all’interno di tale viewport. Quando disegna il percorso all’interno, si vincola alla dimensione di quella finestra. L’altra “larghezza” è la larghezza effettiva che lo sviluppatore tratterà come dimensione DPI nativa quando viene gonfiata in una vista.

<vector android:height="24dp" android:viewportHeight="22.0"android:width="24dp" android:viewportWidth="15.0"

Una volta che hai il tuo vettore disegnabile, puoi espandere le variazioni del suo aspetto creando un altro XML per ogni variazione a cui vuoi avere accesso nelle tue risorse Android. Mentre questo può essere fatto anche per le immagini raw, è un po ‘ più facile lavorare con quando si desidera utilizzare una maschera di bit o modificare lo stato del colore di un’icona senza dover sostituire una sfilza di risorse.

Luminance è un grande set di icone per coloro che vorrebbero sperimentare con le icone. Tutte le icone sono liberi di utilizzare e disponibili in formato SVG.

Ancora una volta, per riassumere questa pipeline con cui giocare:

  1. Scarica Luminance e scegli un’icona che vuoi usare in formato SVG.
  2. Rilascia l’SVG in Android SVG in VectorDrawable e convertilo in un XML disegnabile vettoriale Android.
  3. Inserisci l’XML nella tua directory res/drawable.
  4. Usa nel tuo ImageView, ImageButtons o in qualsiasi altro luogo desideri utilizzare una risorsa disegnabile!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.