Exercice : personnaliser la barre de commandes

  • 9 minutes

Dans cet exercice, vous allez ajouter un bouton de barre de commandes au formulaire de table Help Request. Ce bouton sera visible pour les demandes d’aide actives et en cas de clic dessus, une tâche sera créée pour la demande d’aide.

Important

Utilisez un environnement de test avec Microsoft Dataverse approvisionné et les exemples d’applications activés. Si vous ne disposez pas d’un environnement de test, vous pouvez vous inscrire pour bénéficier de l’offre Communauté ici.

Tâche : préparer votre environnement

Dans cette tâche, vous allez créer une solution, une table Help Request, puis une application pilotée par modèle. Si vous préférez ignorer cette tâche et utiliser une solution initiale, passez à la tâche Importer une solution.

  1. Accédez à Power Apps Maker Portal et veillez à vous trouver dans l’environnement approprié où les exemples d’applications sont activés.

    Capture d’écran illustrant le nom de l’environnement.

  2. Cliquez sur Solutions.

  3. Cliquez sur + Nouvelle solution.

  4. Saisissez Command Bar dans le champ Nom d’affichage et CDS default publisher dans le champ Éditeur, puis cliquez sur Créer.

    Capture d’écran illustrant les propriétés de la nouvelle solution.

  5. Ouvrez la solution Command Bar que vous avez créée.

  6. Cliquez sur + Nouveau, puis sélectionnez Table > Table.

  7. Saisissez Help Request dans le champ Nom d’affichage et Help Requests dans le champ Nom au pluriel, puis développez Optionsavancées.

    Capture d’écran illustrant la boîte de dialogue Nouvelle table.

  8. Accédez à la section Make this table an option when, cochez la case Creating a new activity, puis cliquez sur Enregistrer.

    Capture d’écran illustrant la case Creating a new activity cochée sous Make this table an option when.

  9. Développez la table Help Request que vous avez créée et cliquez sur Colonnes.

    Capture d’écran illustrant le bouton Colonnes de la table.

  10. Ouvrez la colonne Raison du statut.

    Capture d’écran illustrant la colonne Raison du statut.

  11. Cliquez sur + Nouveau choix.

    Capture d’écran illustrant le bouton + Nouveau choix.

  12. Saisissez Résolu pour Libellé, puis cliquez sur Enregistrer.

    Capture d’écran illustrant un nouveau choix ajouté aux choix de la colonne Raison de statut.

  13. Cliquez sur Formulaires et ouvrez le formulaire Principal.

    Capture d’écran illustrant les formulaires de la table.

  14. Glissez-déplacez la colonne Raison du statut dans l’en-tête du formulaire.

    Capture d’écran illustrant la colonne Raison du statut ajoutée à l’en-tête du formulaire.

  15. Cliquez sur Enregistrer et publier, puis attendez que le formulaire soit publié.

  16. Cliquez sur le bouton Précédent.

  17. Cliquez sur Applications.

  18. Cliquez sur + Nouveau, puis sélectionnez Application pilotée par modèle.

    Capture d’écran illustrant le bouton + Nouveau permettant de créer une application pilotée par modèle.

  19. Saisissez Application Help Request pour Nom, puis cliquez sur Créer.

  20. Cliquez sur le bouton Navigation…, puis sélectionnez Nouveau groupe.

    Capture d’écran illustrant le groupe de navigation.

  21. Accédez au volet Propriétés.

  22. Redéfinissez la propriété Title sur Demandes et la propriété ID sur help_requests_group.

    Capture d’écran illustrant les propriétés du groupe de navigation.

  23. Cliquez sur Demandes…, puis sélectionnez Nouvelle page.

  24. Sélectionnez Table Dataverse pour Type de contenu, puis cliquez sur Suivant.

  25. Sélectionnez Help Request pour Table, puis cliquez sur Ajouter.

    Capture d’écran illustrant les propriétés de la sous-zone de navigation.

  26. Sélectionnez la vue Help Requests que vous venez d’ajouter et accédez à l’onglet Paramètres.

  27. Redéfinissez l’ID sur help_requests_subarea.

    Capture d’écran illustrant la valeur ID dans la vue Help Requests.

  28. Cliquez sur Enregistrer, puis attendez que l’application soit enregistrée.

  29. Cliquez sur Publier, puis attendez que l’application soit publiée.

  30. Cliquez sur le bouton Précédent.

    Capture d’écran illustrant le bouton Précédent.

  31. Cliquez sur Publier toutes les personnalisations, puis attendez la fin de la publication.

Tâche : importer une solution

Dans cette tâche, vous allez importer la solution initiale dans votre environnement. Vous devez effectuer cette tâche seulement si vous n’avez pas effectué la tâche Préparer votre environnement. Si vous avez effectué la tâche Préparer votre environnement, passez à la tâche Ajouter un bouton de commande.

  1. Téléchargez le fichier de solution CommandBar_1_0_0_1.zip situé dans GitHub et enregistrez-le localement sur votre ordinateur.

  2. Accédez à Power Apps Maker Portal et veillez à vous trouver dans l’environnement approprié où les exemples d’applications sont activés.

  3. Cliquez sur Solutions.

  4. Cliquez sur Importer la solution.

  5. Cliquez sur Parcourir.

  6. Choisissez le fichier que vous avez téléchargé, puis cliquez sur Ouvrir.

  7. Cliquez sur Suivant.

  8. Cliquez sur Importer, puis attendez la fin de l’importation de la solution.

    Capture d’écran illustrant la boîte de dialogue Importer une solution.

  9. Une notification devrait s’afficher à la fin de l’importation. Cliquez sur Publier toutes les personnalisations, puis attendez la fin de la publication.

Tâche : ajouter un bouton de commande

Dans cette tâche, vous allez ajouter un nouveau bouton de commande au formulaire principal de table Help Request.

  1. Ouvrez la solution Command Bar que vous avez créée/importée.

  2. Cliquez sur Applications, puis ouvrez l’Application Help Request.

    Capture d’écran illustrant l’option Application Help Request.

  3. Cliquez sur le bouton des points de suspension … en regard de Vue Help Requests, puis sélectionnez Modifier la barre de commandes > Modifier.

    Capture d’écran illustrant l’option Modifier la barre de commandes.

  4. Sélectionnez Formulaire principal, puis cliquez sur Modifier.

  5. Cliquez sur + Nouveau, puis sélectionnez Commande.

    Capture d’écran illustrant le bouton + Nouveau permettant d’ajouter une commande.

  6. Sélectionnez Power Fx, puis cliquez sur Continuer.

  7. Saisissez Suivi pour la propriété Label, puis sélectionnez Utiliser l’icône, Espace réservé et Afficher à la condition de la formule pour la propriété Visibility.

    Capture d’écran illustrant les propriétés de la commande.

  8. Saisissez Suivi pour les propriétés Tooltip tile, Tooltip description et Accessibility text.

  9. Accédez à la barre de formule, sélectionnez Visibility et collez cette formule. Cette formule Power Fx affiche le bouton si la demande d’aide est active et le masque si elle est résolue.

    If(Self.Selected.Item.'Status Reason' =  'Status Reason (Help Requests)'.Active, true, false)

    Capture d’écran illustrant la formule de commande Visible du bouton de barre de commandes.

  10. Cliquez sur Enregistrer et publier.

  11. Attendez la fin de la publication.

  12. Cliquez sur Lire.

    Capture d’écran illustrant le bouton Lire.

  13. Cliquez sur + Nouveau.

  14. Saisissez Test de visibilité comme Nom, puis cliquez sur Enregistrer.

    Capture d’écran illustrant l’enregistrement Nouvelle demande d’aide.

  15. Le bouton de commande Suivi devrait devenir visible. Redéfinissez le champ Raison du statut sur Résolu.

    Capture d’écran illustrant la valeur Raison du statut.

  16. Cliquez sur Enregistrer.

  17. Le bouton de commande Suivi ne devrait plus être visible.

    Capture d’écran illustrant la barre de commandes sans le bouton Suivi.

  18. Redéfinissez le champ Raison du statut sur Actif.

  19. Cliquez sur Enregistrer.

  20. Le bouton de commande Suivi devrait redevenir visible.

  21. Fermez l’onglet ou la fenêtre de navigateur de l’application.

  22. Vous devriez maintenant être de retour dans l’éditeur de barres de commandes. Ne quittez pas cette page.

Tâche : ajouter une action de bouton

Dans cette tâche, vous allez ajouter une formule Power Fx créant une tâche à exécuter dans une semaine en cas de clic sur le bouton de commande.

  1. Cliquez sur Ouvrir la bibliothèque de composants.

    Capture d’écran illustrant le bouton Ouvrir la bibliothèque de composants.

  2. Cliquez sur l’onglet Données et sur + Ajouter des données, recherchez « tâches », puis sélectionnez la table Tâches.

    Capture d’écran illustrant la boîte de dialogue + Ajouter des données.

  3. Cliquez sur Enregistrer.

  4. Cliquez sur Publier.

  5. Cliquez sur Publier cette version.

  6. Fermez l’onglet ou la fenêtre de navigateur de la bibliothèque de composants.

  7. Cliquez sur Reprendre.

    Capture d’écran illustrant la fenêtre contextuelle Reprendre la modification de la barre de commandes.

  8. Cliquez sur le bouton de commande Suivi que vous avez ajouté.

  9. Accédez à la barre de formule et sélectionnez OnSelect.

    Capture d’écran illustrant la sélection de la commande OnSelect pour le bouton Suivi.

  10. Collez cette formule dans la barre de formule. Cette formule crée une tâche pour la demande d’aide en cours, fixe la date d’échéance à une semaine à partir du clic sur le bouton et affiche une notification.

    Patch(Tasks, {Subject: Self.Selected.Item.Name, Regarding: Self.Selected.Item, 'Due Date': DateAdd(Now(),7) }); Notify("Created new task")

    Capture d’écran illustrant la formule de commande OnSelect.

  11. Cliquez sur Enregistrer et publier.

  12. Patientez jusqu’à ce que les modifications soient publiées.

  13. Cliquez sur Lire.

  14. Ouvrez l’enregistrement de demande d’aide Test de visibilité.

  15. Cliquez sur le bouton Suivi.

    Capture d’écran illustrant le bouton de commande Suivi.

  16. La notification devrait s’afficher. Cliquez sur le chevron Associé, puis sélectionnez Activités.

    Capture d’écran illustrant l’option Activités du menu Associé.

  17. La tâche créée devrait s’afficher. Assurez-vous que la Date d’échéance est définie sur 7 jours à compter de la date actuelle.

    Capture d’écran illustrant l’enregistrement de tâche créé.