Dans ce laboratoire, vous utiliserez des formulaires pour créer et modifier des enregistrements dans une source de données.
Ce que vous apprendrez
Comment ajouter des écrans Comment naviguer entre les écrans Comment utiliser un formulaire pour créer un enregistrement dans une source de données Comment utiliser un formulaire pour modifier un enregistrement dans une source de données Comment supprimer un enregistrement d'une source de données Comment lier un formulaire à une galerie Étapes de laboratoire
Accéder à un écran lorsqu'un enregistrement est sélectionné dans une galerie Naviguer entre les écrans Afficher un enregistrement avec un formulaire Supprimer un enregistrement Modifier un enregistrement avec un formulaire Créer un nouvel enregistrement avec un formulaire Conditions préalables
Doit avoir terminé le laboratoire 5 : Données externes Étapes détaillées
Exercice 1 – Ajouter des écrans et une navigation
Tâche 1.1 – Modifier l'application
Accédez au portail Power Apps Makerhttps://make.powerapps.com Assurez-vous que vous êtes dans l' environnement Dev One . Sélectionnez l' onglet Applications dans le menu de navigation de gauche. Sélectionnez l' application Demande de réservation , sélectionnez les Commandes ( ... ) et sélectionnez Modifier > Modifier dans un nouvel onglet . Tâche 1.2 - Ajouter des écrans
Dans le menu de création d’applications, sélectionnez Arborescence. Dans la barre d'action de Power Apps Studio, sélectionnez Nouvel écran.
Renommer l'écran en EditScreen. Dans la barre d'action de Power Apps Studio, sélectionnez Nouvel écran . Sélectionnez En-tête et pied de page . Renommer l'écran en DetailScreen. Tâche 1.3 - Ajouter la navigation
Dans l'arborescence, développez BookingRequestList dans MainScreen. Sélectionnez NextArrow dans BookingRequestList . Définissez la propriété OnSelect de NextArrow dans la barre de formule sur :
Collect(colRequests; ThisItem);;Navigate(DetailScreen; ScreenTransition.Cover) Sélectionnez EditScreen . Dans le menu de création de l'application, sélectionnez Insérer (+) . Sélectionnez Flèche retour. Définissez la propriété OnSelect de l'icône sur :
Back() Dans l'arborescence , sélectionnez l' icône et sélectionnez Copier . Développez ScreenContainer. Sélectionnez HeaderContainer et Coller . Exercice 2 – Écran de détails
Tâche 2.1 – Ajouter un formulaire d’affichage
Dans le menu de création d’applications, sélectionnez Arborescence . Développez DetailSfcreen. Développez ScreenContainer1. Sélectionnez MainContainer1. Dans le menu de création de l'application, sélectionnez Insérer (+) . Sélectionnez Formulaire de modification.
Dans les propriétés du FormViewer, sélectionnez Booking Request pour la source de données. Sélectionnez X sélectionnés à côté de Champs.
Si présent, supprimez Créé le en sélectionnant les points de suspension ( ... ) à côté du champ et en sélectionnant Supprimer. Sélectionnez + Ajouter un champ et sélectionnez les champs suivants si nécessaire : Faites glisser les champs dans l'ordre suivant : Définissez la propriété Item du contrôle du visualiseur de formulaire dans la barre de formule sur : BookingRequestList.Selected
Tâche 2.2 - Ajouter une étiquette
Dans le menu de création d’applications, sélectionnez Arborescence. Développez ScreenContainer1. Sélectionnez FooterContainer1. Sélectionnez + dans le conteneur Pied de page.
Sélectionner l'étiquette de texte Définissez la propriété Texte de l'étiquette sur : BookingRequestList.Selected.'Pet Name'
Tâche 2.3 – Ajouter un bouton de suppression
Dans le menu de création d’applications, sélectionnez Arborescence . Développez l'écran DetailScreen. Développez ScreenContainer1. Sélectionnez FooterContainer1. Dans le menu de création de l'application, sélectionnez Insérer (+) . Dans le menu de création d’applications, sélectionnez Arborescence. Renommez le bouton en Deletebtn. Définissez la propriété Text du bouton sur :
"Delete" Définissez la propriété OnSelect du bouton sur : (Booking Requests peut ne pas avoir de s final) : Remove('Booking Request'; BookingRequestList.Selected);; Back()
Exercice 3 – Écran Modifier
Tâche 3.1 – Ajouter un formulaire d’édition
Dans le menu de création d’applications, sélectionnez Arborescence. Dans le menu de création de l'application, sélectionnez Insérer (+). Sélectionnez Formulaire de modification. Dans les propriétés du formulaire, sélectionnez Booking Request pour la source de données. Sélectionnez 2 sélectionnés à côté de Champs . Supprimez Créé le en sélectionnant les points de suspension ( ... ) à côté du champ et en sélectionnant Supprimer . Sélectionnez + Ajouter un champ et vérifier que les champs suivants sont bien présents : Définissez la propriété Item du contrôle de formulaire sur :
BookingRequestList.Selected Dans le menu de création d’applications, sélectionnez Arborescence . Renommez le formulaire en BookingRequestForm. Définissez les propriétés du formulaire comme suit : Colonnes (dans volet Propriétés) =1 Disposition (dans volet Propriétés) = Horizontal Tâche 3.2 – Ajouter un bouton de soumission
Dans le menu de création d’applications, sélectionnez Arborescence . Sélectionnez Modifier l'écran. Dans le menu de création de l'application, sélectionnez Insérer (+) . Faites glisser le bouton sous le formulaire. Dans le menu de création d’applications, sélectionnez Arborescence . Renommez le bouton en Submitbtn. Définissez la propriété Text du bouton sur :
"Submit" Définissez la propriété OnSelect du bouton sur :
SubmitForm(BookingRequestForm) Sélectionnez BookingRequestForm . Définissez la propriété OnSuccess du formulaire sur : Navigate(MainScreen; ScreenTransition.UnCover)
Tâche 3.3 – Ajouter une navigation à l’écran d’édition
Dans le menu de création d’applications, sélectionnez Arborescence . Développez ScreenContainer . Sélectionnez HeaderContainer . Dans le menu de création de l'application, sélectionnez Insérer (+) . Dans le menu de création d’applications, sélectionnez Arborescence . Renommez l'icône en EditIcon. Définissez la propriété OnSelect de l'icône sur :
Navigate(EditScreen; ScreenTransition.Cover) Tâche 3.4 – Nouvel enregistrement
Dans le menu de création d’applications, sélectionnez Arborescence .