Exercice : créer et ajuster une IU pour une nouvelle application canevas

  • 10 minutes

J’espère que vous vous êtes entraîné pendant que nous utilisions notre application Cafetières Contoso. Sinon, rassurez-vous. Dans cet exercice, nous allons créer une application pour tester toutes les nouvelles compétences que nous avons acquises dans ce module d’apprentissage.

Accédez à la page d’accueil Power Apps et créez une tablette vide à partir de l’application canevas, puis procédez comme suit :

  1. Insérez un contrôle Rectangle et redimensionnez-le pour couvrir le haut de votre écran en définissant la propriété Height sur 80.

  2. Insérez un contrôle Image et redimensionnez-le afin de l’adapter à votre rectangle en haut de votre écran à gauche.

  3. Redéfinissez la propriété Image sur :

    User().Image

  4. Insérez un contrôle Libellé de texte et positionnez-le à droite de l’image dans l’en-tête.

  5. Redéfinissez la propriété Text sur :

    "Welcome, " & User().FullName

  6. Redimensionnez le contrôle Libellé de texte afin de l’adapter au texte sans plusieurs lignes.

  7. Insérez un contrôle Saisie de texte dans votre application. Placez-le quelque part sous le rectangle d’en-tête.

  8. Insérez un contrôle Icône de réinitialisation dans votre application. Positionnez-le à droite du contrôle Saisie de texte.

  9. Redéfinissez la propriété OnSelect du contrôle Icône de réinitialisation sur :

    Reset(TextInput1)

    Remarque

    La fonction Reset redéfinit le contrôle Saisie de texte sur l’entrée saisie comme valeur par défaut, dans ce cas « Saisie de texte ».

  10. Appliquez un thème à votre application en sélectionnant Application ou Screen1 dans l’Arborescence, puis une option dans le menu déroulant Thème de la barre de commandes. Votre application devrait maintenant ressembler à l’application ci-dessous. (Nous avons choisi Dark Blue [Bleu foncé] comme thème.)

    Capture d’écran du thème de l’application.

  11. À présent, mettez votre application en mode Aperçu. Tapez du texte dans le contrôle Saisie de texte, puis cliquez sur l’icône Réinitialiser. Votre texte devrait être revenu à « Saisie de texte ».

  12. Ensuite, essayez d’afficher votre application comme n’importe qui le ferait sur un Samsung Galaxy Tab A7.

  13. Ensuite, essayez de visualiser l’application comme sur un iPhone 14 et de changer l’orientation.

Félicitations pour vos nouvelles compétences !