Xcode: come caricare una sola immagine vettoriale al posto delle versioni 1x, 2x e 3x

512_set-squareDal 2010, con l’introduzione dell’iPhone 4, siamo stati abituati a caricare nelle nostre app 2 versioni di ogni asset grafico

  • la versione con risoluzione standard (1x)
  • la versione con risoluzione doppia (2x)

Col tempo la situazione è peggiorata, infatti da iPhone 6 Plus si è aggiunta una terza densità di pixel, ovvero il 3x.

Questo significa che per ogni app che supporta iOS 10 e iOS 9, dovete includere 3 versioni di ogni immagine.

Nulla di particolarmente complicato, sopratutto grazie alla comoda interfaccia offerta dall’Asset Catalog di Xcode, tuttavia pur sempre del prezioso tempo che stiamo perdendo in un task ripetitivo.

 

Formato vettoriale

Xcode ci offre una soluzione molto semplice a questo problema. Infatti basta caricare l’immagine in una sola versione (1x) e in formato vettoriale (PDF). In questo modo sarà Xcode a generare le varie versioni (1x, 2x, 3x) bitmap in modo del tutto automatico e invisibile a voi.

E’ importante tenere a mente che benché stiamo caricando in Xcode un asset grafico in versione vettoriale, sul telefono del nostro utente verrà comunque usata una versione bitmap di quell’immagine. L’unica differenza è che sarà Xcode a generare le bitmap e non noi.

512_vector

Istruzioni

Per caricare un’immagine in formato vettoriale prima di tutto dobbiamo ottenere l’immagine in formato PDF vettoriale.

L’opzione è offerta, ad esempio, dall’ottimo software Graphic (ma probabilmente anche dal vostro editor grafico preferito).

Ovviamente prendere un’immagine bitmap e trasformarla in PDF non è una soluzione! L’immagine deve essere stata disegnata in vettoriale.

screen-shot-2016-10-16-at-17-08-40

Potete scaricare l’immagine vettoriale di prova in versione PDF da qui

A questo punto dal vostro progetto Xcode selezionate Assets.xcassetsscreen-shot-2016-10-16-at-17-11-23

Ora dovete trascinare l’immagine in formato PDF dentro la seconda colonna come mostrato nell’immagine successiva screen-shot-2016-10-16-at-17-13-49

Infine assicuratevi che l’immagine che avete appena aggiunto sia selezionata, aprite l’Attribute Inspector sulla destra e selezionate Scales: Single Scale come mostrato qui di seguito.

 

screen-shot-2016-10-16-at-17-15-40

E’ tutto.

Da questo momento sarà compito di Xcode generare le versioni 1x, 2X, 3X della vostra immagine.

 

Luca Angeletti

Trainer • Developer • Writer

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *