Les contrôles du cadre de la fenêtre

Ce que dit Apple :

Comme on l'a dit dans l'apparence des fenêtres, le cadre comprend la barre de titre, la barre d'outils, et la barre inférieure, alors que le corps de la fenêtre se trouve entre la barre d'outils et la barre inférieure (s'il y en a une). Un petit sous-ensemble de contrôles de Mac OS X est consacré aux zones du cadre, parce qu'ils ont été spécialement conçus pour s'harmoniser avec la surface du cadre. Ces contrôles ne doivent pas être utilisés dans le corps de la fenêtre. Inversement, tous les autres contrôles disponibles dans Mac OS X peuvent être utilisés dans le corps de la fenêtre, et la plupart ne doivent pas être utilisés dans le cadre.

Parmi les contrôles destinés au corps de la fenêtre, il y en a trois qui peuvent être utilisés aussi dans le cadre :
• Le boutons en icônes (y compris ceux qui contiennent un menu pop-up).
• Les menus Action.
• Les champs de recherche.

Cette section décrit les contrôles conçus exclusivement pour le cadre des fenêtres. Si votre fenêtre contient une barre d'outils ou une barre inférieure, utilisez les contrôles appropriés à chaque zone du cadre, y compris les boutons en icônes, les menus Action et les champs de recherche si c'est nécessaire.

1- Déterminer l'état d'un contrôle du cadre en fonction de l'aspect de la fenêtre.

Les contrôles du cadre peuvent changer d'aspect selon l'état actif ou non de la fenêtre, et l'état validé ou non du contrôle. L'aspect du contrôle peut aussi indiquer si le contrôle supporte le clic-à-travers.

Pour comprendre la signification de ces différents aspects, il est important de considérer le fond (bezel) du contrôle indépendamment de l'icône (glyph) du contrôle. Le fond du contrôle indique l'état (actif ou non) de la fenêtre, alors que l'icône indique si le contrôle est fonctionnel. Le tableau 1 Indique les combinaisons possibles des états de le fenêtre et du contrôle.

Tableau 1 : Aspect des contrôles du cadre en fonction de l'état de la fenêtre et du contrôle
	Fenêtre active, contrôle valide	Fenêtre active, contrôle invalide	Fenêtre inactive, contrôle valide	Fenetre inactive, contrôle invalide
Aspect du fond (bezel) du contrôle	Actif	Actif	Inactif	Inactif
Aspect de l'icône (glyph) du contrôle	Validé	Invalidé	Validé (1)	Invalidé

(1) Dans une fenêtre inactive, l'icône dans un contrôle qui ne supporte pas le clic-à-travers a un aspect invalidé que le contrôle soit validé ou non.

Dans une fenêtre inactive, le fond d'un contrôle en capsule qui supporte le clic-à-travers passe à un aspect actif quand vous déplacez le pointeur dessus.

Vous pouvez fournir une paire d'icônes pour un contrôle du cadre de la fenêtre. Faites-le si vous voulez afficher une icône dans l'état validé, et une icône différente dans l'état invalidé. Autrement, les modifications d'aspect sont automatiques.

2- Les contrôles rectangulaires de la barre d'outils.

Les contrôles rectangulaires de la barre d'outils peuvent aussi être utilisés dans la barre inférieure, alors que les contrôles en capsule sont exclusivement réservés à la barre d'outils. Le contrôle rectangulaire est très versatile, et peut se comporter comme un bouton poussoir, comme un bouton à bascule, comme un contrôle segmenté, ou comme un menu pop-up. La figure 1 montre quelques aspects d'un contrôle rectangulaire dans le carnet d'adresses.

Fig. 1 : variations sur le contrôle rectangulaire de la barre d'outils

3- Utilisation des contrôles rectangulaires.

Dans une barre d'outils, utilisez des contrôles rectangulaires pour accéder à des commandes utilisées fréquemment, ou à des objets. Par exemple, le Finder utilise une combinaison de boutons rectangulaires et de contrôles segmentés pour permettre aux utilisateurs de voir un item avec Quick Look, choisir un style de présentation, afficher le chemin d'un item, naviguer entre les items présentés, et agir sur eux.

Fig. 2 : Contrôles rectangulaires dans la barre d'outils du Finder.

Dans la barre inférieure, utilisez des contrôles de style rectangulaire quand ils affectent directement le contenu ou l'organisation du corps de la fenêtre. En général, ces contrôles de la barre inférieure sont importants, mais ils sont utilisés moins fréquemment que ceux de la narre d'outils. Par exemple (figure 3), la barre inférieure d'iCal a des contrôles segmentés qui permettent aux utilisateurs de rajouter des calendriers et de modifier les items de la barre latérale et un bouton qui montre (ou cache) la liste des choses à faire.

Fig. 3 : Contrôles rectangulaires de barre d'outils dans la barre inférieure, sous iCal.

4- Contenu et étiquetage des contrôles rectangulaires.

Un bouton rectangulaire de barre d'outils peut contenir soit du texte, soit des icônes. Il peut aussi contenir un triangle avec la pointe en bas qui indique un menu pop-up. Un contrôle segmenté peut aussi contenir, mais exclusivement, soit du texte, soit des icônes.

Si vous affichez une icônes dans un contrôle rectangulaire de barre d'outils, assurez-vous que la signification de l'image est claire et sans ambiguité. Sous Mac OS X 10.5 et supérieur, Interface Builder facilite l'ajout dans un contrôle d'images proposées par le système, comme le signe Plus, un symbole de comptes, ou le symbole de verrouillage. Certains de ces symboles sont visibles dans la figure 2 ci-dessus. Si vous avez besoin de concevoir votre propre image, voyez les règles de conception des contrôles rectangulaires.

Si vous voulez afficher un texte dans un contrôle rectangulaire, ce doit être un nom (ou une phrase nominale) qui décrit l'objet, le réglage, ou l'état, ou bien un verbe (ou une phrase verbale) qui décrit une action. Par exemple, les noms utilisés comme contrôles dans la barre d'outils d'iCal (figure 4) indiquent clairement la fonction des contrôles. Utilisez les règles de capitalisation de titre propres au texte.

Si vous utilisez un contrôle rectangulaire de barre d'outils qui se comporte comme une case à cocher ou un bouton à bascule dans la barre d'outils ou la barre inférieure, vous pouvez profiter de l'éclairage automatique, qui affiche l'état valide du bouton. Mais en faisant cela, vérifiez bien que le contrôle indique l'état correct dans la bonne situation. Vous pouvez aussi fournir deux étiquettes descriptives à afficher en dessous du contrôle, l'une pour l'état ON (ou appuyé) du bouton, et l'autre pour l'état OFF (non appuyé). Et pour finir, décrivez les deux états dans des balises d'aide.

Par exemple, iCal présente des contrôles en bascule dans sa barre inférieure. Les utilisateurs choisissent ces contrôles pour afficher ou cacher les vues correspondantes Quand une de ces vues est affichée, le bouton à bascule correspondant est éclairé. Si la vue est cachée, l'éclairage disparaît (voir la figure 4).

Fig. 4 : deux contrôles à bascule (mini-calendrier, et notifications) dans la barre inférieure d'iCal.

Il est important de fournir un étiquette descriptive pour chaque contrôle de style rectangulaire que vous mettez dans la barre d'outils, pour que les utilisateurs puissent personnaliser leur barre d'outils en affichant à la fois les images et le texte. Les utilisateurs voient cette étiquette quand ils choisissent "Icône et Texte" ou "Texte seulement" dans les options d'affichage du dialogue de personnalisation de la barre d'outils.

Dans la barre inférieure, les contrôles rectangulaires n'ont pas besoin d'étiquettes descriptives.

5- Spécifications des contrôles rectangulaires de la barre d'outils.

Taille des contrôles : Les contrôles de style rectangulaires sont disponibles en taille normale, réduite, ou mini. Dans une barre d'outil, affichez-les par défaut en taille normale, mais assurez vous de proposer une taille réduite pour permettre aux utilisateurs de personnaliser leur barre d'outils.

Dans la barre inférieure, vous pouvez utiliser la taille normale ou la taille réduite selon les dimensions de la barre inférieure.

Espacement des étiquettes et fontes : les étiquettes pour les contrôles de style rectangulaire doivent être dans la fonte système appropriée à la taille du contrôle (c'est proposé automatiquement par Interface Builder).
• taille normale : fonte système.
• taille réduite : fonte système réduite.
• taille mini : fonte système mini.

Espacement des contrôles : laissez 8 pixels entre les contrôles de style rectangulaire des barres d'outils. Cela se fait automatiquement, et l'espacement peut changer en fonction de la longueur de l'étiquette. .

6- Implantation des contrôles rectangulaires.

Les contrôles de style rectangulaires sont disponibles sous Interface Builder. Dans la bibliothèque d'Interface Builder, ces contrôles s'appellent Round Textured Buttons. Pour en créer un avec les interfaces de programmation de l'Application Kit, utilisez les méthodes setBezelStyle: et NSButtonCell avec comme argument NSTexturedRoundedBezelStyle.

Le ton bleu que vous voyez derrière l'image du calendrier dans le contrôle segmenté d'iCal est un effet que le Kit d'Application fournit dans certaines circonstances. Cet effet indique un état ON sur un contrôle segmenté convenablement configuré, qui se comporte comme un ensemble de boîtes à cocher, ou un bouton à bascule. Bien qu'il soit possible que cet aspect change dans de futures livraisons de Mac OS X, vous pourrez continuer à profiter de ce comportement si vous configurez ces deux contrôles comme il est indiquez ci-dessous :

Pour fournir un contrôle segmenté qui affiche un aspect ON (comme dans iCal), utilisez un objet NSSegmentedControl avec pour style NSSegmentStyleTexturedRounded, et pour mode NSSegmentSwitchTrackingSelectAny. Si vous utilisez Interface Builder, placez un objet Contrôle segmenté dans votre barre d'outils ou dans votre barre inférieure : dans la vitre Attributs de l'Inspecteur, definissez le style à Textured Rounded, et le mode à Select Any. N'oubliez pas de fournir une image pour le contrôle (dans Interface Builder, sélectionnez une image à partir de la combo box dans la vitre Attributs de l'inspecteur).

Pour proposer un bouton à bascule qui affiche un aspect ON, utilisez un objet NSButton avec pour style NSTexturedRoundedBezelStyle, auquel vous avez associé une image. Assurez-vous que le masque showsStateBy du bouton contienne NSContentsCellMask. Cela signifie que le kit d'application utilise une image et un texte alternatifs quand l'état du bouton est NSOnState. Cependant, pour obtenir la lueur d'état ON, ne fournissez pas d'image alternative. Si vous utilisez Interface Builder, mettez un objet Rounded Textured Button dans votre barre d'outils ou dans la barre inférieure ; dans la vitre Attributs de l'inspecteur, mettez le mode à Toggle (bascule), fournissez une image, et ne proposez pas d'image alternative.

Mes commentaires :

Les contrôles rectangulaires devraient à mon humble avis suffire largement dans les barres d'outils et les barres inférieures. L'ajout des contrôles en capsule ne fait que compliquer les choses sans rien améliorer.

Faites bien la distinction entre l'étiquetage des contrôles (étiquette descriptive), qui permet d'afficher dans la barre d'outils l'icône seule, ou l'icône avec le texte, ou le texte seul, et la balise d'aide, qui s'affiche en jaune quand l'utilisateur maintient sa souris sur un contrôle.

Le dernier paragraphe (si vous avez eu le courage de le parcourir) vous montre que la programmation de Mac OS X n'est pas une sinécure. Vous disposez de deux outils complémentaires :
• Interface Builder, qui permet de définir graphiquement l'interface, mais encore faut-il remplir correctement les bonnes cases des vitres de l'inspecteur consacrées à chacun des objets. Ce n'est pas simple du tout !
• L'application Kit, qui permet de faire la même chose en mode programmation. Mais il faut alors dominer un ensemble de noms d'objets et d'attributs de ces objets, dont vous pouvez avoir une petite idée en lisant dans la page les mots en code affichés dans une fonte différente et plus petite (plutôt longs et compliqués).

Quand je vous disais que la programmation du Mac n'est pas facile !