Comment créer une mise en page complexe pour les applications Apple Watch?

La taille de l'écran de la montre Apple Watch étant petite, des objets tels que des étiquettes, des images ou des curseurs dans une application sont placés l'un en dessous de l'autre. Bien que cette limitation signifie que vous ne pouvez pas placer les objets à l'emplacement exact souhaité, il est toujours possible de créer une présentation complexe pour votre application Watch. Lisez la suite pour savoir comment.

Avant de commencer ce didacticiel, veillez à créer un nouveau projet Xcode et à y ajouter la cible Apple Watch. Vous pouvez trouver les instructions pour cette tâche ici.

Pour créer une mise en page complexe pour une application, nous allons utiliser un objet groupe. Un objet de groupe peut contenir d'autres objets et vous pouvez les placer verticalement ou horizontalement.

1. Ouvrez le Interface.storyboard fichier dans la cible de l'application WatchKit. dans le Bibliothèque d'objets, rechercher Groupeet faites glisser l’objet dans le storyboard vierge.

Initialement, le nouveau groupe sera vide. Avant d’ajouter d’autres éléments au groupe, examinons les attributs disponibles dans le Utilitaires panneau.

2. Un attribut notable pour le groupe est sa disposition. Par défaut, il est défini sur Horizontal, ce qui signifie que les objets du groupe seront placés les uns à côté des autres. Vous pouvez le changer pour Verticale si tu veux.

3. Maintenant, il est temps d'ajouter des objets au groupe. Dans cet exemple, j'ai ajouté deux étiquettes au groupe et les ai placées verticalement. Vous pouvez constater que les deux éléments sont à l’intérieur du groupe en regardant le Sommaire du document.

4. Un problème courant lorsque vous utilisez la disposition Horizontale dans un groupe est qu’il peut y avoir un espace vide dans ce groupe car aucun objet n’occupe cet espace. La solution à cela consiste à sélectionner l'objet, à rechercher l'attribut Width dans la section Taille, à le modifier en Relatif à Conteneur et à définir la taille souhaitée.

le la taille du conteneur (groupe) est toujours 1, donc une valeur de 0.5 la largeur de l'objet sélectionné sera égale à la moitié de celle du groupe. Dans cet exemple, j'ai deux étiquettes. Par conséquent, une largeur de 0,5 pour chaque étiquette leur permettra de couvrir tout le groupe.

En fonction du nombre d'éléments contenus dans un groupe, vous pouvez définir une taille différente.

5. Il est possible de créer groupes imbriqués comme l'exemple ci-dessous. Lorsque vous souhaitez imbriquer un groupe, faites-le glisser sous le groupe souhaité dans le plan du document. Comme vous pouvez le constater, il est possible de créer une mise en page complexe pour l'application même avec les limites du SDK. Toutefois, l'écran de la montre étant petit, il n'est pas recommandé de créer une présentation trop complexe, car les utilisateurs pourraient trouver votre application difficile à utiliser.