web-dev-qa-db-fra.com

Taille des icônes OS X

Quelle taille doit avoir une icône d'application et une icône de barre de menus pour OS X?

Je peux gérer des écrans de petite résolution, mais qu'en est-il de Retina - une icône affichée dans la barre de menus (par exemple 20 x 20) sera-t-elle plus petite ou floue sur un nouveau MacBook Pro avec écran Retina? Je pense que l'icône de l'application sera mise à l'échelle, donc si je prépare deux fois plus grand que d'habitude, ça devrait aller sur Retina.

J'ai trouvé un excellent guide pour le développement iOS avec des spécifications de tailles mais je ne trouve pas de spécifications de taille similaires pour OS X.

objective-cxcodemacoscocoaretina-display
26
maseth

Les icônes NSStatusBar (c'est-à-dire les icônes de la barre de menus) sont différentes des icônes d'application classiques. Je n'ai pas pu trouver de guide d'icône officiel NSStatusBar, mais je dois croire que le guide d'icône de la barre d'outils pour les boutons est assez proche. Ça suggère:

  • Créez des icônes qui ne mesurent pas plus de 19 x 19 pixels.
  • Rendez le contour net et net.
  • Utilisez une perspective directe.
  • Utilisez du noir (ajoutez de la transparence uniquement si nécessaire pour suggérer la dimensionnalité).
  • Utilisez l'anti-aliasing.
  • Utilisez le format PDF.
  • Assurez-vous que l'image est visuellement centrée dans le contrôle (notez que visuellement centrée peut ne pas être la même que mathématiquement centrée).

Lors des tests, j'ai trouvé:

  1. NSStatusBar semble mieux avec quelque chose de 18 pixels de haut ou moins. Le systemStatusBar a une épaisseur de 22 .
  2. Alors qu'il répertorie PDF, j'ai utilisé png sans problème.
  3. Si vous souhaitez que votre icône soit blanche sur bleu lorsqu'elle est sélectionnée, vous devez fournir l'autre image en tant que version blanche distincte de votre icône.

Échantillon de code:

myStatusItem = [[NSStatusBar systemStatusBar]statusItemWithLength:NSSquareStatusItemLength];
NSImage *statusImage = [NSImage imageNamed:@"Status.png"];
[myStatusItem setImage:statusImage];
NSImage *altStatusImage = [NSImage imageNamed:@"StatusHighlighted"];
[myStatusItem setAlternateImage:altStatusImage];
[myStatusItem setHighlightMode:YES];
[myStatusItem setMenu:self.myStatusMenu];
39
DenVog

http://developer.Apple.com/library/mac/#documentation/userexperience/conceptual/applehiguidelines/Intro/Intro.html#//Apple_ref/doc/uid/TP30000894-TP6

Et: http://developer.Apple.com/library/mac/#documentation/userexperience/conceptual/applehiguidelines/IconsImages/IconsImages.html

enter image description here

6
Blazer

Pour que votre élément de menu prenne en charge Retina s'affiche, Mode sombre et différent états (par exemple, pressé)

  1. Créez deux images PNG de taille 16x16 Et 32x32 Ou, si vous voulez moins de marge, 18x18 Et 36x36 Pixels
  2. Créez un nouvel élément d'image dans Xcode avec Render As Réglé sur Template Image Et ajoutez vos images pour 1x Et 2x
  3. Initialisez votre NSImage à partir de l'élément d'image sans changer sa taille: NSImage(named: "Example")
5
John

Suivez ces étapes et vous obtiendrez une icône de barre d'état parfaitement nette pour la rétine

  1. Ouvrez un fichier png de votre icône dans Photoshop, il doit être plus grand que 88 px x 88 px
  2. aller au menu, Image, Taille de l'image
  3. définir la résolution à 350
  4. définir la taille à 88 px x 88 px (pixels)
  5. enregistrer l'image au format png l'ajouter xcode
4
NSGodMode