web-dev-qa-db-fra.com

Xcode 6 permet aux ressources d'image VECTOR ... comment les utiliser?

Je bidouillais avec les actifs Xcode 6 vs images lorsque j’ai remarqué quelque chose très intéressant : nous pouvons maintenant spécifier des images vectorielles (voir la sous-fenêtre Utilitaires après en sélectionnant Images.xcassets).

J'ai essayé une petite application (contenant un gros UIImageView) avec une image .SVG (ne fonctionnait pas), puis un .EPS (ne fonctionnait pas non plus) et j'ai finalement essayé un .PDF. Cela a fonctionné! Bien, même si j'ai vu l'image, elle est apparue pixellisée et non vectorisée.

Il semble donc que Apple prépare le terrain pour les icônes/images vectorielles. Plus de versions zillions des icônes d'applications, plus d'images "@ 2x". Mais est-ce que quelqu'un peut déverrouiller cette fonctionnalité?

72
Jean Le Moignan

Voici quelques unes de mes pensées après quelques expériences sur des actifs vectoriels:

1. Compile le support technique

Après plusieurs essais, je pense qu’il ne s’agit que d’une aide à la compilation. Xcode génère toutes les images 1x, 2x et 3x au moment de la compilation. Ce qui signifie que cela fonctionne avec les anciennes versions iOS. En même temps, cela signifie que dans la version finale, il est toujours au format PNG, et vous ne pouvez pas obtenir d’image sans perte plus longue à partir du fichier vectoriel.

2. Pourquoi PDF au lieu de SVG ou d'autres formats

Pour les formats SVG et autres, l’image vectorielle n’a pas d’information de taille réelle, tandis que PDF a des informations de taille. Je pense que Xcode 6 utilise les informations de taille dans PDF en tant que taille d'affichage réelle, puis génère 2x fichiers 3x à partir de l'image vectorielle.

Size info in PDF

3. La taille du fichier PDF n'a pas d'importance

Au début, notre préoccupation est que PDF sera beaucoup plus gros que les PNG. Nous avons essayé http://smallpdf.com/ de le compresser et cela fonctionne plutôt bien. Mais si le fichier PDF d'origine n'est pas inclus dans la construction, comme je l'ai dit précédemment, la taille du fichier PDF n'a pas d'importance.

Continuera à éditer ce post si je trouve autre chose.

EDIT 14-09-25

@ mredig a mentionné que pour iOS, il générait des bitmaps lors de la compilation, mais pour OSX, il incluait l'image vectorielle sous une forme évolutive.

via: http://martiancraft.com/blog/2014/09/vector-images-xcode6/

58
Allen Hsu

Voici comment expérimenter des images vectorielles dans le catalogue d’actifs dans Xcode 6:

  1. Créez un nouveau jeu d'images.

  2. Sélectionnez un emplacement d'image vide dans votre jeu d'images et faites basculer la fenêtre contextuelle de l'inspecteur d'attributs sur Vecteurs. Vous avez maintenant un seul emplacement d'image universel.

  3. Faites glisser un vecteur PDF) dans cet emplacement.

Désormais, chaque fois que cette image est utilisée, elle est redimensionnée en fonction de son contexte (par exemple, une vue d'image de taille fixe) sans pixellisation, comme illustré dans cette capture d'écran:

enter image description here

[~ # ~] modifier [~ # ~] Malgré cette réponse, la plus grande PDF dessin était rasterizing. Mais maintenant, voyez https://stackoverflow.com/a/45623000/341994 : dans Xcode 9, le vecteur PDF est mis à l'échelle correctement, sans pixellisation.

[~ # ~] éditer [~ # ~] Sous Xcode 11, cette formule fonctionne: Dans le catalogue d'actifs, vous devez définir le menu déroulant Échelles. menu to Individual Scales et placez l’image vectorielle dans l’emplacement 1x. Cochez Conserver les données vectorielles. Terminé.

25
matt

vous pouvez utiliser cet outil en ligne pour convertir vos images de svg en pdf

http://www.fileformat.info/convert/image/svg2pdf.htm

1- télécharger une image

2- sélectionnez largeur: 24px, hauteur: 24px

3- copier dans votre projet xcode

4- aller à Images.xcassets

5- clic droit et créer un nouveau jeu d'images

6- A partir du panneau de droite, sélectionnez (inspecteur d'attributs)

7- changer les types en vecteur

8- glissez et déposez votre image pdf ici

9- l'utiliser dans votre projet

22
Fareed Alnamrouti

un conseil - créez PDF @ 2x résolution et nom de fichier avec @ 2x ([email protected])), vous obtiendrez des images parfaitement nettes et contrastées, spéciales pour iPad 2 et mini. - enter image description here

7
Roman Bambura

Je crée simplement une police personnalisée avec, par exemple, des icônes ou même des logotypes d'application, et je l'utilise de cette manière pour l'insérer dans mon application. Je peux ensuite ajuster très facilement les tailles de police pour les appareils et les résolutions d'écran.

3

Si vous cherchez une réponse à la question: "Comment puis-je utiliser des graphiques vectoriels dans mon application iOS et les redimensionner à la perfection?" , alors je peux fortement recommander UIImage+PDF de https://github.com/mindbrix/UIImage-PDF

Je trouve cela fonctionne absolument avec brio. Au lieu d'avoir toutes les images au format PNG de trois résolutions différentes, j'ai maintenant un tout petit fichier PDF pour chaque image. Je peux les afficher comme suit:

// Objective C:
self.icon.image = [UIImage imageWithPDFNamed:@"icon.pdf" fitSize:self.icon.frame.size];

// Swift:
icon.setImage(UIImage(PDFNamed: "icon.pdf", fitSize: icon.frame.size))

En plus de fitSize:, il y a aussi atWidth:, atHeight et atSize:.

J'utilise UIImage+PDF pour toutes les images pouvant être vectorisées et n'utilisez que des images PNG fixes pour les images photo.

J'exécute également mes PDF via quelque chose comme http://smallpdf.com/compress-pdf , afin de leur garantir la plus petite taille de fichier.

Erik

3
Erik van der Neut

Dans les cas où vous construisez des icônes d'application, PDF ne fonctionnera pas. Vous voudrez peut-être jeter un coup d'œil sur un projet. Je viens de construire un projet appelé Speculid . Il peut créer des fichiers PNG, PDF, etc ... à partir d'images sources, y compris de fichiers SVG. Vos commentaires seraient grandement appréciés.

1
leogdion