Boîte à outils de wireframe Windows Phone

Ruban

Conception > Diagramme > Boîte à outils

Raccourcis Clavier

Ctrl+Maj+3

Téléphone Windows

Génère un cadre avec une zone d'écran pour l'appareil Windows 8 Phone. Une prompt s'affiche dans laquelle vous pouvez spécifier l'orientation portrait ou paysage.

Les éléments créés dans la zone de l'écran ne peuvent pas être redimensionnés ou déplacés pour se trouver en dehors des bordures de l'écran. Les éléments créés en dehors du cadre peuvent être déplacés vers et hors du cadre et peuvent être aussi grands que le permettent la vue ou les propriétés de l'élément.

Bloc de texte

Génère un élément qui représente le texte dominant tel que les titres et les étiquettes. Le nom de l'élément correspond au texte affiché.

Double-cliquez sur l'élément pour ouvrir la dialogue « Propriétés » sur la page « Wireframe ». Elle affiche un ensemble par défaut de six niveaux de styles de titres. Cliquez sur le nom d'un style pour remplir le panneau « Propriétés » à droite de le dialogue , puis cliquez sur la flèche vers le bas pour chaque propriété et sélectionnez les paramètres appropriés pour le style. Si vous préférez, vous pouvez également modifier le nom du style dans la propriété « Nom ».

Si nécessaire, vous pouvez ajouter d'autres styles à la liste. Cliquez sur le nom du groupe de styles et sur le bouton Ajouter. Dans l' prompt « Entrer un nom pour l'élément », saisissez un nom pour le style et cliquez sur le bouton OK . Le nouveau style est ajouté à la fin de la liste ; si vous souhaitez le déplacer plus haut dans la liste, cliquez dessus et sur l'icône . Là encore, vous définissez le style à l'aide du panneau « Propriétés ».

Si vous souhaitez supprimer des styles de la liste, cliquez sur le nom du style et sur le bouton Supprimer.

Lorsque vous avez défini les styles qui peuvent être utilisés pour ce texte, cliquez sur la page 'Général' de la dialogue ' Propriétés ' et, dans la Valeur Étiquetée ' Type d'en-tête', cliquez sur la flèche déroulante et sélectionnez le style à appliquer au texte de cette zone de texte spécifique.

Zone de texte

Génère un champ de texte simple avec une bordure, dans lequel vous pouvez saisir le texte de votre choix. Le nom de l'élément est le texte affiché et n'est pas renvoyé à la ligne.

Bouton

Génère une icône rectangulaire représentant un bouton d'écran, avec le nom de l'élément comme texte du bouton.

Valeur Étiquetés :

• State : cliquez sur la flèche déroulante et sélectionnez le bouton État pour représenter :
  - Normal - le bouton non sélectionné
  - Focalisé - le bouton lorsque le curseur passe dessus
  - Sélectionné - le bouton lorsqu'il est cliqué
  - Désactivé - le bouton est grisé lorsqu'il n'est pas disponible

Case à cocher

Génère un élément représentant une case à cocher étiquetée, le nom de l'élément étant l'étiquette.

Valeur Étiquetés :

• Activé : cliquez sur la flèche déroulante et sélectionnez Vrai pour afficher la case à cocher activée pour la sélection, ou Faux pour afficher la case à cocher désactivée et indisponible
• State : cliquez sur la flèche déroulante et sélectionnez « Décoché » pour afficher la case à cocher vide et non sélectionnée, ou « Coché » pour afficher la case à cocher sélectionnée avec une coche à l'intérieur

Bouton de lien hypertexte

Génère un élément de texte avec le nom de l'élément comme texte souligné affiché, représentant un lien hypertexte sur l'écran.

Double-cliquez sur l'élément pour ouvrir la dialogue « Propriétés » sur la page « Wireframe », qui répertorie les trois états d'hyperlien normaux « Lien », « Visité » et « Survol ». Cliquez sur le nom d'un état pour remplir le panneau « Propriétés » à droite de le dialogue , puis cliquez sur la flèche vers le bas pour chaque propriété et sélectionnez les paramètres appropriés pour le style à appliquer à cet état. Si vous préférez, vous pouvez également modifier le nom de l'état dans la propriété « Nom ».

Si nécessaire, vous pouvez ajouter d'autres états à la liste. Cliquez sur le nom du groupe d'états et sur le bouton Ajouter. Dans l' prompt « Entrer un nom pour l'élément », saisissez un nom pour l'état et cliquez sur le bouton OK . Le nouvel état est ajouté à la fin de la liste ; si vous souhaitez le déplacer plus haut dans la liste, cliquez dessus et sur l'icône . Là encore, vous définissez le style à l'aide du panneau « Propriétés ».

Si vous souhaitez supprimer des États de la liste, cliquez sur le nom de l’État et sur le bouton Supprimer.

Lorsque vous avez défini les états que peut avoir l'hyperlien, cliquez sur la page 'Général' de la dialogue ' Propriétés ' et, dans la zone ' State ' Valeur Étiquetée , cliquez sur la flèche déroulante et sélectionnez l'état dans lequel cet hyperlien doit être représenté.

Image

Génère un object rectangulaire contenant un « X » pour indiquer l'emplacement d'une image sur l'écran. Aucune propriété n'est à définir.

Bouton radio

Génère un élément représentant un bouton radio étiqueté, le nom de l'élément étant l'étiquette.

Valeur Étiquetés :

• Activé : cliquez sur la flèche déroulante et sélectionnez Vrai pour afficher le bouton radio activé pour la sélection, ou Faux pour afficher le bouton radio désactivé et indisponible
• State : cliquez sur la flèche déroulante et sélectionnez « Non sélectionné » pour afficher le bouton radio vide, ou « Sélectionné » pour afficher le bouton radio avec un cercle rempli à l'intérieur

Collection de tuiles

Ajoute une tuile avec un motif aléatoire, pour représenter une tuile de collection Windows .

Valeur Étiquetés :

• En-tête : saisissez une string de texte appropriée comme titre de la mosaïque ; le texte s'affiche lorsque « Afficher en arrière » est défini sur Vrai et si le « Type de mosaïque » le supporte
• Afficher l'arrière : cliquez sur la flèche déroulante et sélectionnez Vrai pour afficher l'arrière de la tuile au lieu de l'avant ; pour certains types de tuiles, l'arrière ne s'affiche pas quel que soit ce paramètre
• Texte : une Valeur Étiquetée dans laquelle vous saisissez le texte à afficher au dos de la tuile ; le format et la police du texte affiché dépendent du 'Tile Type '
• Type de tuile : cliquez sur la flèche déroulante et sélectionnez le type de tuile de collection ; cela n'affectera que l'affichage du verso de la tuile, le recto restera toujours le même (consultez la page Web Descriptions Type Gabarit tuiles Windows pour plus d'informations sur les types de tuiles)

Mosaïque d'image

Ajoute une tuile qui s'affiche initialement sous la forme d'une boîte avec un « X » au centre, mais qui est destinée à afficher une image que vous sélectionnez.

Valeur Étiquetés :

• Image : cliquez sur l'icône et sélectionnez l'image à afficher pour cette mosaïque, dans la dialogue « Gestionnaire d'images »
• Texte : saisissez le texte qui sera affiché en blanc en bas de l'image, en fonction du « Type de mosaïque »
• Type de mosaïque : cliquez sur la flèche déroulante et sélectionnez le type de mosaïque d'image à afficher ; il s'agira soit d'une image uniquement, soit d'une image avec du texte (consultez la page Web Descriptions Type de Gabarit Windows pour plus d'informations sur les types de mosaïques)

Tuile Peek

Ajoute une tuile similaire à une tuile d'image, sauf qu'elle peut afficher l'arrière de la tuile pour afficher plus d'informations.

Valeur Étiquetés :

• En-tête : saisissez une string de texte appropriée comme titre de la mosaïque ; le texte s'affiche lorsque « Afficher en arrière » est défini sur Vrai et si le « Type de mosaïque » le supporte
• Image : cliquez sur l'icône et sélectionnez l'image à afficher au recto de cette tuile, à partir de la fenêtre Gestionnaire d'images
• Afficher l'arrière : cliquez sur la flèche déroulante et sélectionnez Vrai pour afficher l'arrière de la tuile au lieu de l'avant
• Texte : une Valeur Étiquetée dans laquelle vous saisissez le texte à afficher au dos de la tuile ; le format et la police du texte affiché dépendent du 'Tile Type '
• Type de tuile : cliquez sur la flèche déroulante et sélectionnez le type de tuile Peek à afficher (consultez la page Web Gabarit Type de tuiles Windows pour plus d'informations sur les types de tuiles)

Mosaïque de texte

Ajoute une mosaïque qui affiche uniquement du texte. Selon le type de mosaïque, vous pouvez afficher une string de texte dans la moitié supérieure du panneau et deux éléments de texte dans le coin inférieur droit du panneau.

Valeur Étiquetés :

• Bloc de texte : saisissez une string de texte en deux parties à afficher en bas à droite de la tuile, comprenant une string plus longue qui sera affichée dans une petite police, suivie d'une string plus courte qui sera affichée dans une grande police, les deux chaînes étant séparées par un point-virgule ; la string courte n'affichera que deux caractères dans une tuile carrée, ou jusqu'à 5 caractères dans une tuile large, tandis que la string plus longue peut contenir beaucoup plus de caractères, par exemple : Messages ;16
• Texte : saisissez du texte supplémentaire à afficher en haut de la tuile (en fonction du type de tuile), comme une description ou une définition de l' object identifié dans le texte inférieur
• Type de tuile : cliquez sur la flèche déroulante et sélectionnez le type de tuile de texte à afficher (consultez la page Web Descriptions Type Gabarit tuiles Windows pour plus d'informations sur les types de tuiles)

Barre d'applications

Génère un élément qui représente la « barre d'applications Windows », qui s'affiche en bas de l'écran du téléphone pour fournir des commandes supplémentaires. Cela peut inclure jusqu'à un maximum de cinq icônes et six chaînes. Lorsque vous faites glisser l'icône sur le diagramme , vous êtes invité à sélectionner l'orientation « Portrait » ou « Paysage » pour correspondre à l'orientation de l'écran.

Double-cliquez sur l'élément pour afficher la dialogue « Propriétés » sur la page « Wireframe », affichant le nom de l'élément en haut comme nœud racine.

Cliquez sur le nom de l'élément et, dans le panneau « Propriétés » de droite, cliquez sur la flèche déroulante dans le champ valeur de la propriété « Mode » et sélectionnez :

• « Mini » : pour représenter la barre d'applications sous la forme d'une fine barre avec uniquement l'icône de menu déroulant ( ) en haut à droite, sans autres icônes ni texte
• « Par défaut » : pour représenter la barre d'applications sous la forme d'une barre fine, sauf si elle contient des éléments, auquel cas elle affichera simplement l'icône dans un cercle, sans texte ni nom d'icône
• « Étendu » : pour afficher la barre d'applications contenant chaque icône dans un cercle, le nom de l'élément sous le cercle et jusqu'à six chaînes de texte représentant des options de menu supplémentaires

• « Nom » : affiche le nom de l'élément, que vous pouvez modifier si nécessaire ; si la barre d'applications est rendue en mode « Étendu », le nom d'un élément de symbole ou de police sera affiché sous l'icône, tandis que pour un élément de texte, il sera affiché sous et à gauche des icônes dans une liste verticale
• « Type » : cliquez sur la flèche déroulante et sélectionnez dans la liste des types d'éléments ; le type que vous sélectionnez déterminera les autres prompts de propriétés affichées :
  - 'SymbolIcon' : affiche l'élément sous forme d'icône de symbole
  - 'FontIcon' : affiche l'élément sous forme de glyphe, en utilisant une police
  - 'BitmapIcon' : dessine une image sélectionnée comme icône
  - « Texte » : (s'applique uniquement en mode « Étendu ») affiche l'élément
  nom en tant que membre d'une liste verticale ci-dessous et à gauche
  des icônes ; un maximum de six éléments peuvent être répertoriés à la fois
  - « Séparateur » : trace une ligne verticale entre les icônes, ce qui compte
  comme l’un des cinq emplacements disponibles pour les icônes sur la barre d’applications ;
  Les éléments de séparation n'affichent pas les noms

• « Symbole » : (s'affiche si le « Type » est défini sur « SymbolIcon ») cliquez sur la flèche déroulante et sélectionnez le symbole dans la liste
• « FontFamily » : (s'affiche si le « Type » est défini sur « FontIcon ») saisissez le nom de la police avec laquelle dessiner, par exemple « Segoe UI Symbol »
• « Glyphe » : (s'affiche si le « Type » est défini sur « FontIcon ») saisissez la valeur hexadécimale du glyphe à dessiner. Par exemple, pour le symbole ©, vous pouvez définir « FontFamily » sur « Arial » et saisir le code hexadécimal « 00A9 » ; les codes de police dans Windows peuvent être trouvés via « Panneau de configuration | Polices | Rechercher un caractère »
• « Bitmap » : (s'affiche si le « Type » est défini sur « BitmapIcon ») cliquez sur la flèche déroulante et sélectionnez un bitmap (comme indiqué dans le gestionnaire d'images)

Sélecteur de date

Génère un élément qui représente trois blocs indiquant le jour et la date d'aujourd'hui, le mois et l'année, dérivés de la date du système.

Valeur Étiquetés :

• Date - si nécessaire, cliquez sur la flèche déroulante et sélectionnez une date différente dans le calendrier ; si la date affichée n'est pas celle d'aujourd'hui, vous pouvez la réinitialiser à la date d'aujourd'hui en cliquant sur le bouton Aujourd'hui
• Format de date - cliquez sur la flèche déroulante et sélectionnez le format de date à afficher :
  - j/m/a
  - l/j/a
  - a/m/j

Boîte de mot de passe

Génère un élément qui représente un champ de mot de passe à l'écran.

Valeur Étiquetés :

• Mot de passe : une string de texte qui représente un mot de passe
• Caractère du mot de passe : un caractère qui remplace chaque caractère de la string « Mot de passe » lorsque le mot de passe est masqué (lorsque « Révéler le bouton » ou « Afficher le texte » est défini sur Faux)
• Bouton Révéler : s'il est défini sur True (valeur par défaut), dessine un bouton qui affiche la string de texte « Mot de passe » ; s'il est défini sur False, le bouton n'est pas affiché et la string de mot de passe est représentée par une string composée du « Caractère de mot de passe »
• Afficher le texte : lorsque « Révéler le bouton » est défini sur Vrai, définir « Afficher le texte » sur Vrai affichera la string de texte « Mot de passe » ; sinon, une string s'affiche composée uniquement du « Caractère du mot de passe »

Barre de progression

Génère un élément représentant une barre d'état « processus en cours », affichant un certain nombre d'étapes « points ».

Anneau de progrès

Génère un élément représentant le cercle de points « traitement en cours » Windows .

Barre de recherche

Génère un élément représentant un champ de recherche Windows , avec l'icône de démarrage de la recherche en forme de « loupe » à la fin.

Valeur Étiquetés :

• Texte d'espace réservé - par défaut, le mot « Rechercher » ; si nécessaire, remplacez-le par une string de texte alternative

Curseur

Génère un élément représentant un commutateur de commande à glissière, avec le curseur à 50 % de sa largeur.

Valeur Étiquetés :

• Quantité de remplissage - remplacez le champ par une valeur entre 1 et 100, pour définir le pourcentage de l'icône affichée en noir derrière le curseur

Sélecteur de temps

Génère un élément qui représente deux blocs indiquant l'heure en heures et en minutes, au format 12 heures ou 24 heures.

Valeur Étiquetés :

• Affichage 24 heures - cliquez sur la flèche déroulante et sélectionnez Vrai pour afficher l'heure au format 24 heures ou Faux (valeur par défaut) pour afficher l'heure au format 12 heures

• Heure - affiche l'heure en trois sections - heures, minutes et AM/PM ; cliquez sur et remplacez chaque section par la valeur requise pour l'heure

Interrupteur à bascule

Génère un élément représentant un interrupteur à bascule coulissant avec l'interrupteur à gauche, représentant l'état « arrêt ».

Valeur Étiquetés :

• State - cliquez sur la flèche déroulante et sélectionnez « Activé » pour représenter l'état activé avec le commutateur à droite de l'icône, ou « Désactivé » pour déplacer le commutateur vers la gauche de l'icône afin de représenter l'état désactivé