Lab 6 – Formulaires

• 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

• Créer de nouveaux écrans
• 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

• Doit avoir terminé le laboratoire 5 : Données externes

1. Accédez au portail Power Apps Makerhttps://make.powerapps.com
2. Assurez-vous que vous êtes dans l' environnement Dev One .
3. Sélectionnez l' onglet Applications dans le menu de navigation de gauche.
4. Sélectionnez l' application Demande de réservation , sélectionnez les Commandes ( ... ) et sélectionnez Modifier > Modifier dans un nouvel onglet .

1. Dans le menu de création d’applications, sélectionnez Arborescence.
2. Dans la barre d'action de Power Apps Studio, sélectionnez Nouvel écran.

   

3. Sélectionnez Vide .
4. Renommer l'écran en EditScreen.
5. Dans la barre d'action de Power Apps Studio, sélectionnez Nouvel écran .
6. Sélectionnez En-tête et pied de page .
7. Renommer l'écran en DetailScreen.

1. Dans l'arborescence, développez BookingRequestList dans MainScreen.
2. Sélectionnez NextArrow dans BookingRequestList .
3. Définissez la propriété OnSelect de NextArrow dans la barre de formule sur :ClearCollect(colRequests; ThisItem);;Navigate(DetailScreen; ScreenTransition.Cover)
4. Sélectionnez EditScreen .
5. Dans le menu de création de l'application, sélectionnez Insérer (+) .
6. Développer Icônes.
7. Sélectionnez Flèche précédente.
8. Définissez la propriété OnSelect de l'icône sur :Back() ou Navigate(MainScreen;ScreenTransition.CoverRight)
9. Renommez l'icône en BackIconEdit.
10. Dans la vue Arborescence , sélectionnez l'icône et sélectionnez Commandes ( ... ) et sélectionnez Copier .
11. Développer l'écran de détails .
12. Développer ScreenContainer1 .
13. Sélectionnez HeaderContainer1 et sélectionnez les commandes ( ... ) et sélectionnez Coller .
14. Renommez l'icône en BackIconDetail.

1. Dans le menu de création d’applications, sélectionnez Arborescence .
2. Développez DetailScreen.
3. Développez ScreenContainer1.
4. Sélectionnez MainContainer1.
5. Dans le menu de création de l'application, sélectionnez Insérer (+) .
6. Développez Entrée.
7. Sélectionnez Formulaire d’affichage.

   

8. Dans les propriétés du FormViewer, sélectionnez Booking Request(s) pour la source de données.
9. Sélectionnez X sélectionnés à côté de Champs.

   

10. Ajoutez ou supprimez les champs afin qu'ils soient disposés dans l'ordre suivant :
    1. Nom de l'animal
    2. Nom du propriétaire
    3. Courriel du propriétaire
    4. Date de début
    5. Date de fin
    6. Décision
    7. Coût

       

11. Fermez le volet Champs .
12. Définissez la propriété Item du contrôle de visualisation de formulaire dans la barre de formule sur :

BookingRequestList.Selected

1. Dans le menu de création d’applications, sélectionnez Arborescence.
2. Développez DetailScreen.
3. Développez ScreenContainer1.
4. Sélectionnez FooterContainer1.
5. Sélectionnez + dans le conteneur Pied de page.

   

6. Sélectionner l'étiquette de texte
7. Définissez la propriété Texte de l'étiquette sur :

BookingRequestList.Selected.'Pet Name'`

1. Dans le menu de création d’applications, sélectionnez Arborescence .
2. Développez l'écran DetailScreen.
3. Développez ScreenContainer1.
4. Sélectionnez FooterContainer1.
5. Dans le menu de création de l'application, sélectionnez Insérer (+) .
6. Sélectionner Bouton.
7. Dans le menu de création d’applications, sélectionnez Arborescence.
8. Renommez le bouton en Deletebtn.
9. Définissez la propriété Text du bouton sur :"Delete"
10. Définissez la propriété OnSelect du bouton sur : (Booking Requests peut ne pas avoir de s final) :

Remove('Booking Requests'; BookingRequestList.Selected);; Back()

1. Dans le menu de création d’applications, sélectionnez Arborescence.
2. Sélectionnez EditScreen.
3. Dans le menu de création de l'application, sélectionnez Insérer (+).
4. Sélectionnez Formulaire.
5. Dans les propriétés du formulaire, sélectionnez Booking Request pour la source de données.
6. Sélectionnez 2 sélectionnés à côté de Champs .
7. Supprimez Créé le en sélectionnant les points de suspension ( ... ) à côté du champ et en sélectionnant Supprimer .
8. Sélectionnez + Ajouter un champ et vérifier que les champs suivants sont bien présents :
   1. Pet Name
   2. Owner Name
   3. Owner Email
   4. Start Date
   5. End Date
   6. Cost
9. Sélectionnez Ajouter.
10. Fermez le volet Champs .
11. Définissez la propriété Item du contrôle de formulaire sur :BookingRequestList.Selected
12. Dans le menu de création d’applications, sélectionnez Arborescence.
13. Renommez le formulaire en BookingRequestForm.
14. Définissez les propriétés du formulaire comme suit :
    1. X=0
    2. Y=125
    3. Hauteur=500
    4. Largeur=Parent.Width
    5. Colonnes (dans volet Propriétés) =1
    6. Disposition (dans volet Propriétés) = Horizontal

    

1. Dans le menu de création d’applications, sélectionnez Arborescence .
2. Sélectionnez Modifier l'écran.
3. Dans le menu de création de l'application, sélectionnez Insérer (+) .
4. Sélectionner Bouton.
5. Faites glisser le bouton sous le formulaire.
6. Dans le menu de création d’applications, sélectionnez Arborescence .
7. Renommez le bouton en Submitbtn.
8. Définissez la propriété Text du bouton sur :"Submit"
9. Définissez la propriété OnSelect du bouton sur :SubmitForm(BookingRequestForm)
10. Sélectionnez BookingRequestForm.
11. Définissez la propriété OnSuccess du formulaire sur :

1. Dans le menu de création d’applications, sélectionnez Arborescence .
2. Développez DetailScreen.
3. Développez ScreenContainer .
4. Sélectionnez HeaderContainer .
5. Dans le menu de création de l'application, sélectionnez Insérer (+) .
6. Développer les icônes.
7. Sélectionnez Modifier (Edit).
8. Dans le menu de création d’applications, sélectionnez Arborescence .
9. Renommez l'icône en EditIcon.
10. Définissez la propriété OnSelect de l'icône sur :Navigate(EditScreen; ScreenTransition.Cover)

1. Dans le menu de création d’applications, sélectionnez Arborescence .
2. Sélectionnez MainScreen.
3. Dans le menu de création de l'application, sélectionnez Insérer (+).
4. Développer les icônes.
5. Sélectionnez Ajouter.
6. Dans le menu de création d’applications, sélectionnez Arborescence .
7. Renommez l'icône en NewIcon.
8. Définissez les propriétés de l’icône comme suit :
   1. X=0
   2. Y=0
   3. Hauteur=80
   4. Largeur=80
   5. Couleur=Color.White
9. Définissez la propriété OnSelect de l'icône sur :NewForm(BookingRequestForm);;Navigate(EditScreen; ScreenTransition.Cover)
10. Sélectionnez Enregistrer en haut à droite de Power Apps Studio.
11. Sélectionnez le bouton <- Retour en haut à gauche de la barre de commandes et sélectionnez Quitter pour quitter l'application.

• Ajouter un icône Corbeille sur la galerie et ne l’afficher que si Decision est Undecided
  • ThisItem.Decision='Decision (Booking Requests)'.Undecided
• Une couleur par décision (rouge, vert, bleu)
  • Switch(ThisItem.Decision;'Decision (Booking Requests)'.Accepted;Color.Green;'Decision (Booking Requests)'.Declined;Color.Red;Color.Blue)