Les boutons en Icônes
Un bouton en icône se comporte comme un bouton à chanfrein, mais il ne comporte pas de bordure rectangulaire (figure 1). Autrement dit, la totalité du bouton est cliquable, pas seulement l'icône.
Fig. 1 : les préférences système affichent des boutons en icônes
Normalement, les boutons en icônes sont utilisés pour afficher des icônes cliquables dans une barre d'outils ; ils constituent un des trois contrôles standard du corps de la fenêtre qui peuvent être utilisés dans une barre d'outils. Si vous voulez utiliser des boutons en icônes dans votre barre d'outils, évitez de les mélanger avec des contrôles rectangulaires ou en capsule. Ils ne peuvent pas être utilisés dans une barre inférieure.
Un bouton en icône peut avoir un menu pop-up qui lui est attaché.
Les boutons en icônes contiennent des icônes. En plus, ils peuvent afficher un texte que l'utilisateur peut choisir de voir. Ils ne peuvent avoir qu'un seul triangle pointé vers le bas qui indique la présence d'un menu Pop-up.
Les étiquettes des boutons en icônes doivent nomme l'objet (comme Réseau, ou Comptes), ou décrire une action (comme Masquer, ou Afficher). Comme certains utilisateurs peuvent choisir de visualiser les icônes en boutons sans leur étiquette, assurez-vous que la signification de l'icône est claire et sans ambiguité.
Taille des contrôles : les limites d'un bouton en icône ne sont pas visibles, mais elles déteminent la cible visée. Typiquement, l'icône doit comprendre une marge d'environ 10 pixels tout autour de l'icône et de l'étiquette.
Fig. 2 : Dimensions de la cible
Fontes et espacement des étiquettes : utilisez une fonte réduite pour les étiquettes. Le texte doit figurer sous l'icône, comme sur la figure 2.
Taille des icônes : Les meilleures tailles sont entre 24 x 24 pixels et 32 par 32 pixels (cf figure 2).
Espacement des contrôles : Pour des icônes de 24 x 24 (ou plus), laissez 8 pixels entre les bordures des boutons (pas celles des icônes) horizontalement et verticalement.
Pour créer un bouton en icône sous Interface Builder, glissez un bouton à chanfrein dans la fenêtre, ajoutez votre icône, et décochez la case Bordure dans la vitre Attributs de l'Inspecteur. Avec l'Applicatin Kit, utilisez la méthode setBezelStyle:
de NSButtonCell
avec comme argument NSShadowlessSquareBezelStyle
.
Vous pouvez aussi utiliser Interface Builder pour créer des boutons en icônes qui comprennent un menu pop-up. Commencez par glisser un bouton poup-up dans votre fenête, puis dans la vitre des Attributs de l'Inspecteur, changez le type en Pull Down. Puis, dans la même vitre, changez le style à Bevel ou Square (peu importe), et décocher la case Bordered.