Utiliser le format SVG avec XCode 12

Avec la WWDC 2020 et Xcode 12, une information est passée un peu inaperçue dans la communauté de développeurs iOS: il est maintenant possible d'importer des SVG sur Xcode 🥳

On a tous ce souvenir de développeurs Android se moquant de Xcode et de l'impossibilité d'importer des SVG, ou encore de l'utilisation de PDF pour gérer les assets d'images. Tout ça n'est plus que de l'histoire ancienne 🥳 !

Comment importer un SVG dans Xcode ?

⚠️  Les SVG sont disponibles à partir d'iOS 13

La manipulation est très simple, comme pour un asset normal :

1. Ouvrez votre dossier d'Assets et glissez-y votre SVG

2. Ensuite dans le menu sur la droite, dans "Scale", sélectionnez "Single Scale"

Et voilà, le tour est joué 😉 !

On voit qu'il n'y a plus de x2 et x3,  mais bien qu'une seule et unique image, notre SVG. Vous pouvez ensuite l'utiliser dans votre code comme vous faites d'habitude avec une image normale.

Pourquoi utiliser des SVG ?

• Des assets plus faciles à maintenir 🤝 : Tant côté design, que côté développement, il n'y a plus qu'un seul fichier par image à prendre en compte.
• Des assets moins lourds 🤌 : Par exemple, pour l'icône utilisée dans cet article, en l'important en png, le dossier d'assets a un poids de 37 Ko contre 20 Ko en SVG.

On espère que ce petit hack vous aidera à alleger le process graphique et UI dans vos projets mobile.

Soutenez notre travail ❤️

🔥 Suivez nous sur Instagram, Facebook, LinkedIn ou abonnez-vous à notre newsletter en devenant membre de notre blog :)