Support Power Platform - Apps - Automate - SharePoint - Copilot

Pratique Lab 2 - Créer une application Canvas

Objectifs de laboratoire

Dans ce laboratoire, vous apprendrez à:

  • Créer une application Canvas à partir d'un modèle prédéfini
  • Explorez l'interface Power Apps Studio et les composants clés
  • Créez une application Canvas simple à partir d'un écran vierge
  • Ajoutez des contrôles tels que des galeries, des formulaires, des étiquettes et des boutons
  • Connectez une application Canvas à une table Dataverse en tant que source de données

Scénario

Contoso veut une application mobile-friendly que les employés peuvent utiliser pour :

  • consulter
  • et soumettre des demandes d'installations.

Vous explorerez d'abord une application construite à partir d'un modèle pour comprendre comment fonctionnent les applications de canevas, puis créerez une application de soumission de requête simple à partir de zéro.

Exercice 1 : créer une application à partir d'un fichier

📌
Dans cet exercice, vous allez créer une application Canvas à partir de l'un des modèles intégrés pour voir rapidement comment une application finie est structurée.
  1. Accédez à https://make.powerapps.com et connectez-vous.
  2. Dans l'écran d'accueil, sélectionnez + Créer à partir du volet de navigation gauche.
  3. Dans la section Démarrer à partir des données, sélectionnez Télécharger le fichier
  4. Sélectionner ce fichier :
Room Reservations.xlsx9.3 KB⬇
  1. Assurez-vous que Utiliser la première ligne comme en-tête de colonne est sélectionnée, puis sélectionnez Créer une application.
  2. Pour tester l’application, sélectionnez le bouton Lecture (ou la touche F5)
  3. Pour ajouter un nouvel enregistrement, sélectionnez le bouton + Nouveau.
  1. Entrez un nouvel enregistrement avec les détails suivants:
  2. Sélectionnez le bouton Enregistrer (Vérifier la marque)
  3. Fermer l'aperçu de l'application.
  1. Sélectionnez le bouton Enregistrer.
  2. Sélectionner le bouton Publier
  3. Sélectionner le bouton Publier cette version
  4. Observer le bouton Partager.

Exercice 2: Construire et modifier une application Canvas

📌
Maintenant, vous allez construire une application simple de demande d'installation à partir d'un canevas vierge connecté à une source de données Dataverse.

Tâche 1 : Créer une appliquer et la connecter aux données

  1. Aller sur https://make.powerapps.com
  2. Dans l'écran d'accueil, sélectionnez + Créer à partir du volet de navigation gauche.
  3. Dans la section Démarrer à partir de données, sélectionner Dataverse.
  4. Dans la zone de recherche, entrer le texte Demande
  5. Sélectionner Demande d'installation et cliquer sur Créer une application

Tâche 2 : Personnaliser l'application Demandes d'installation.

L'un des éléments clés des applications de canevas est la possibilité de modifier l'application au besoin. Nous allons modifier l'application pour l'adapter un peu plus à nos besoins.

Dans cette tâche, vous allez:

  • Formater les éléments existants
  • Ajouter un message de bienvenue à l'application
  • Modifier un formulaire existant.
  • Ajouter un nouvel écran pour ajouter de nouvelles pièces.
  • Ajoutez un bouton pour accéder à l'écran des nouvelles pièces.
  • Ajouter un motif d'utilisateur de bienvenue sur le côté droit de l'écran.

La première chose que nous voulons faire est de
personnaliser l'écran principal pour inclure un message de bienvenue qui
inclut le nom des utilisateurs connecté.

  1. Dans l'écran Demande d'installation (l'écran par défaut), sélectionnez l'en-tête Demandes d'installation.
  2. Sélectionnez le menu déroulant + Insérer, puis sélectionnez Étiquette de texte.
  3. Définissez la valeur du champ Étiquette de texte sur "Bienvenue"
  4. Format Texte Valeur champ comme suit:
    • Taille de la police: 16
    • Couleur de la police: White
    • Couleur de fond: Bleu
    • Alignement du texte: à droite
    • Hauteur: Parent.Height
  5. Avec le même élément sélectionné, insérez un autre champ d'étiquette de texte.
  6. Définissez la propriété Texte sur User(). FullName
  7. Formater le champ de valeur du texte comme suit:
    • Taille de la police: 16
    • Alignement : Droite
    • Hauteur: Parent.Height
    • Largeur: 225
    • Couleur de la police: Blanc
    • Couleur de fond: Bleu
  8. Votre nouvel en-tête ressemblera à l'image ci-dessous :

Tâche 3: Construire l'écran de la nouvelle pièce

  1. Dans la barre de commande, sélectionnez le bouton Nouvel écran, puis sélectionnez l'écran En-tête et pied de page.
  2. Dans la vue Arborescence, sélectionnez Screen1, et renommez-la Écran nouvelle pièce.
  3. Sélectionnez le + dans le conteneur d'en-tête de formulaire et sélectionnez Étiquette de texte.
  4. Définissez la propriété Texte sur "Ajouter une nouvelle pièce"
  5. Formater l'étiquette :
    • Font Size: 16
    • Font Color: White
    • Couleur de fond: Bleu
    • Alignement: Droit
    • Hauteur: 52
    • Largeur: 300
  6. Sélectionnez le conteneur d'en-tête et définissez la couleur de fond sur Bleu.
  1. Dans le conteneur principal, sélectionnez + Insérer, puis sélectionnez Formulaire de modification
  2. Dans le champ Rechercher, entrez Pièce et sélectionnez la table Pièces.
  3. Supprimer les champs Numéro de séquence d'importation, Numéro de version de la règle du fuseau horaire ou Enregistrement créé.
  4. Dans le volet Propriétés du formulaire, définissez le mode par défaut sur Nouveau.
  5. Votre formulaire devrait ressembler à l'image ci-dessous:
  6. Sélectionnez le pied de page en bas du formulaire.
  7. Sélectionner + Insertion, puis sélectionner bouton.
    • Définissez la propriété Texte du bouton sur "Envoyer".
    • Définissez la propriété OnSelect du bouton dans la formule suivante :
    SubmitForm(Form2);; Navigate('Écran Demandes d''installations')

Tâche 4: Ajouter la navigation entre les écrans

  1. Retournez à l'écran Demandes d'installation.
  2. Sélectionner la galerie RecordsGallery1
  3. Dans la barre de commande, sélectionnez + Insérer, puis sélectionnez Bouton.
    • Définissez la propriété Texte du bouton sur "Nouvelle pièce".
    • Réglez le bouton OnSélection propriété selon la formule suivante:
      NewForm(Form2);; Navigate('Écran nouvelle pièce')

Tâche 5: Testez votre application

  1. Sélectionnez le bouton Lecture (▶) pour prévisualiser votre application.
  2. Tester les éléments suivants:
    • La galerie affiche vos données d'exemple.
    • Sélection + Nouveau ouvre un formulaire vierge.
    • Vous pouvez remplir une nouvelle demande et cliquer sur Envoyer pour l'enregistrer.
    • La sélection d'un enregistrement dans la galerie affiche ses détails dans le formulaire à droite.
  3. Fermez l'aperçu et enregistrez votre application en tant qu'application de demande d'installation (Fichier > Enregistrer ou Ctrl + S).