Créer une application canevas à partir de zéro, basée sur des données Excel

Créez votre propre application canevas à partir de zéro, basée sur des données Excel, au format table, puis ajoutez les données d'autres sources si vous le souhaitez. En suivant ce didacticiel, vous allez créer une application contenant deux écrans. Sur un seul écran, les utilisateurs peuvent parcourir un groupe d'enregistrements. Sur l'autre écran, les utilisateurs peuvent créer un enregistrement, mettre à jour un ou plusieurs champs d'un enregistrement, ou supprimer un enregistrement entier. Cette approche prend plus de temps que la création d'une application de base depuis Excel, mais elle permet aux concepteurs d'application plus expérimentés de créer une application personnalisée qui répond parfaitement à leurs besoins.

Conditions préalables

Pour suivre exactement les étapes de ce didacticiel, créez d'abord un fichier Excel avec ces exemples de données.

  1. Copiez ces données, puis collez-les dans un fichier Excel.

    StartDay StartTime Bénévole Sauvegarder
    Samedi 10 h-midi Vasquez Kumashiro
    Samedi midi-14 h Ice Singhal
    Samedi 14 h-16 h Myk Mueller
    Dimanche 10 h-midi Li Adams
    Dimanche midi-14 h Singh Morgan
    Dimanche 14 h-16 h Batye Nguyen
  2. Organisez ces données dans un tableau nommé Planification, de sorte que Power Apps puisse analyser les informations.

    Pour plus d'informations, consultez Mettre en forme un tableau dans Excel.

  3. Enregistrez le fichier sous le nom eventsignup.xlsx, fermez-le, puis chargez-le dans un compte de stockage cloud, tel que OneDrive.

Important

Vous pouvez utiliser votre propre fichier Excel et passer en revue ce didacticiel seulement pour les concepts généraux. Cependant, les données du fichier Excel doivent être sous forme de tableau. Pour plus d'informations, consultez Mettre en forme un tableau dans Excel.

Ouvrir une application vide

  1. Connectez-vous à Power Apps.

  2. Sous Créer ma propre application, sélectionnez Application canevas à partir de rien.

    Créer une application canevas vide

  3. Spécifiez un nom pour votre application, sélectionnez Téléphone, puis sélectionnez Créer.

    Vous pouvez concevoir une application à partir de zéro pour les téléphones ou d'autres appareils (comme les tablettes). Cette rubrique se concentre sur la conception d'une application pour les téléphones.

    Spécifier le nom et le format de l'application

    Power Apps Studio crée une application vide pour les téléphones.

  4. Si la boîte de dialogue Bienvenue dans Power Apps Studio s'ouvre, sélectionnez Ignorer.

Se connecter aux données

  1. Au centre de l'écran, sélectionnez Se connecter aux données.

  2. Dans le volet Données, sélectionnez la connexion pour votre compte de stockage cloud si elle s'affiche. Dans le cas contraire, procédez comme suit pour ajouter une connexion :

    1. Sélectionnez Nouvelle connexion, puis la mosaïque de votre compte de stockage cloud, puis Créer.
    2. Si vous y êtes invité, indiquez vos informations d'identification pour ce compte.
  3. Sous Choisir un fichier Excel, tapez ou collez les premières lettres de eventsignup pour filtrer la liste, puis sélectionnez le fichier que vous avez chargé.

  4. Sous Choisir une table, cochez la case Planification, puis sélectionnez Se connecter.

  5. Fermez le volet Données en sélectionnant l'icône de fermeture (X) dans l'angle supérieur droit.

Créer l'écran d'affichage

  1. Dans l'onglet Accueil, sélectionnez la flèche vers le bas en regard de Nouvel écran pour ouvrir la liste des types d'écran, puis sélectionnez Liste.

    Un écran est ajouté avec plusieurs contrôles par défaut, comme une zone de recherche et un contrôle Gallery. La galerie couvre la totalité de l'écran sous la zone de recherche.

  2. En haut du nouvel écran, sélectionnez le contrôle Label et remplacez [Title] par Afficher les enregistrements.

    Modifier la barre de titre

  3. Dans la barre de navigation de gauche, sélectionnez BrowseGallery1.

    Une zone de sélection avec des poignées entoure la galerie.

    Ajouter un écran Liste

  4. Sous l'onglet Propriétés du volet de droite, sélectionnez la flèche vers le bas du menu Disposition.

    Ouvrir le menu Disposition

  5. Sélectionnez Titre, sous-titre et corps.

  6. Dans la barre de formule, remplacez CustomGallerySample par Planification et remplacez les deux instances de SampleText par Bénévole.

  7. Sur le bord droit de la barre de formule, sélectionnez la flèche vers le bas, puis sélectionnez Mettre le texte en forme.

    La formule correspond à cet exemple :

    SortByColumns(
        Search(
            Schedule,
            TextSearchBox1.Text,
            "Volunteer"
        ),
        "Volunteer",
        If(
            SortDescending1,
            SortOrder.Descending,
            SortOrder.Ascending
        )
    )
    
  8. Sous l'onglet Propriétés du volet de droite, sélectionnez Modifier à côté de l'étiquette Champs.

  9. Dans la zone Title2, sélectionnez Bénévole, dans la zone Subtitle2, sélectionnez StartDay, et dans la zone Body1, sélectionnez StartTime.

  10. Fermez le volet Données en sélectionnant l'icône de fermeture (X) dans l'angle supérieur droit.

Les utilisateurs peuvent trier et filtrer la galerie par nom de bénévole selon les fonctions SortByColumns et Search dans cette formule.

  • Si un utilisateur tape au moins une lettre dans la zone de recherche, la galerie affiche uniquement les enregistrements pour lesquels le champ Bénévole contient le texte saisi par l'utilisateur.
  • Si un utilisateur sélectionne le bouton de tri (situé entre le bouton d'actualisation et le signe plus dans la barre de titre), la galerie affiche les enregistrements dans l'ordre croissant ou décroissant (en fonction du nombre de fois où l'utilisateur sélectionne le bouton) par rapport au champ Bénévole.

Pour plus d'informations sur ces fonctions et d'autres fonctions, consultez les informations de référence sur les formules.

Créer l'écran de modification

  1. Dans l'onglet Accueil, sélectionnez la flèche vers le bas en regard de Nouvel écran, puis sélectionnez Formulaire.

  2. Dans la barre de navigation de gauche, sélectionnez EditForm1.

  3. Sous l'onglet Propriétés dans le volet de droite, sélectionnez la flèche vers le bas à côté de Source de données, puis sélectionnez Planification dans la liste qui s'affiche.

  4. Sous la source de données choisie, sélectionnez Modifier les champs.

  5. Dans le volet Champs, sélectionnez Ajouter un champ, cochez la case de chaque champ, puis sélectionnez Ajouter.

  6. Sélectionnez la flèche à côté du nom de chaque champ à réduire, puis faites glisser le champ Bénévole vers le haut afin de le placer au tout début de la liste des champs.

    Réorganiser les champs

  7. Fermez le volet Champs en sélectionnant l'icône de fermeture (X) dans l'angle supérieur droit.

  8. Définissez la propriété Item du formulaire sur cette expression en la tapant ou en la collant dans la barre de formule :

    BrowseGallery1.Selected

  9. En haut de l'écran, sélectionnez le contrôle Label et remplacez [Title] par Modifier les enregistrements.

    Modifier la barre de titre

Supprimer et renommer les écrans

  1. Dans la barre de navigation de gauche, sélectionnez les points de suspension (...) pour Screen1, puis sélectionnez Supprimer.

    Supprimer l'écran

  2. Sélectionnez les points de suspension (...) pour Screen2, sélectionnez Renommer, puis tapez ou collez ViewScreen.

  3. Sélectionnez les points de suspension (...) pour Screen3, sélectionnez Renommer, puis tapez ou collez ChangeScreen.

Configurer les icônes sur l'écran d'affichage

  1. Dans la partie supérieure de ViewScreen, sélectionnez l'icône de flèche circulaire.

    Ajouter un enregistrement

  2. Définissez la propriété OnSelect pour cette icône sur la formule suivante :

    Refresh(Schedule)

    Lorsque l'utilisateur sélectionne cette icône, les données issues du champ Planification sont actualisées à partir du fichier Excel.

    Pour plus d'informations sur ces fonctions et d'autres fonctions, consultez les informations de référence sur les formules.

  3. Dans l'angle supérieur droit de ViewScreen, sélectionnez l'icône plus (+).

    Ajouter un enregistrement

  4. Définissez la propriété OnSelect pour cette icône sur la formule suivante :

    NewForm(EditForm1);Navigate(ChangeScreen,ScreenTransition.None)

    Lorsque l'utilisateur sélectionne cette icône, ChangeScreen apparaît avec tous les champs vides, permettant à l'utilisateur de créer un enregistrement plus facilement.

  5. Sélectionnez la flèche vers la droite pour le premier enregistrement de la galerie.

    Sélectionner la flèche

  6. Définissez la propriété OnSelect de la flèche sur la formule suivante :

    EditForm(EditForm1); Navigate(ChangeScreen, ScreenTransition.None)

    Lorsque l'utilisateur sélectionne cette icône, ChangeScreen apparaît avec chaque champ affichant les données pour l'enregistrement sélectionné, afin que l'utilisateur puisse modifier ou supprimer l'enregistrement plus facilement.

Configurer les icônes sur l'écran de modification

  1. Dans ChangeScreen, sélectionnez l'icône « X » dans l'angle supérieur gauche.

    Icône Annuler

  2. Définissez la propriété OnSelect pour cette icône sur la formule suivante :

    ResetForm(EditForm1);Navigate(ViewScreen, ScreenTransition.None)

    Lorsque l'utilisateur sélectionne cette icône, toutes les modifications effectuées dans cet écran par l'utilisateur sont ignorées, et l'écran d'affichage s'ouvre.

  3. Dans l'angle supérieur droit, sélectionnez l'icône en forme de coche.

    Icône de coche

  4. Définissez la propriété OnSelect de la coche sur la formule suivante :

    SubmitForm(EditForm1); Navigate(ViewScreen, ScreenTransition.None)

    Lorsque l'utilisateur sélectionne cette icône, toutes les modifications effectuées dans cet écran par l'utilisateur sont enregistrées, et l'écran d'affichage s'ouvre.

  5. Dans l'onglet Insertion, sélectionnez Icônes, puis sélectionnez l'icône Corbeille.

  6. Définissez la propriété Color de la nouvelle icône sur White et déplacez la nouvelle icône afin qu'elle s'affiche en regard de l'icône en forme de coche.

    Icône Corbeille

  7. Définissez la propriété Visible pour l'icône Corbeille sur la formule suivante :

    EditForm1.Mode = FormMode.Edit

    Cette icône s'affiche uniquement quand le formulaire est en mode Édition (et pas en mode Création).

  8. Définissez la propriété OnSelect pour l'icône Corbeille sur la formule suivante :

    Remove(Schedule, BrowseGallery1.Selected); Navigate(ViewScreen, ScreenTransition.None)

    Lorsque l'utilisateur sélectionne cette icône, l'enregistrement sélectionné est supprimé de la source de données, et l'écran d'affichage s'ouvre.

Tester l'application

  1. Sélectionnez ViewScreen, puis ouvrez Aperçu en appuyant sur F5 (ou en sélectionnant l'icône Aperçu près de l'angle supérieur droit).

    Ouvrir le mode Aperçu

  2. Tapez ou collez une ou plusieurs lettres dans la zone de recherche pour filtrer la liste sur le nom du bénévole.

  3. Sélectionnez l'icône de tri une ou plusieurs fois pour afficher les données par ordre croissant ou décroissant en fonction du nom du bénévole.

  4. Ajoutez un enregistrement.

  5. Mettez à jour l'enregistrement que vous avez ajouté, puis enregistrez les modifications.

  6. Mettez à jour l'enregistrement que vous avez ajouté, puis annulez les modifications.

  7. Supprimez l'enregistrement que vous avez ajouté.

  8. Fermez le mode Aperçu en appuyant sur Échap (ou en sélectionnant l'icône de fermeture dans l'angle supérieur droit).

Étapes suivantes

  • Appuyer sur Ctrl+S pour enregistrer votre application dans le cloud afin de pouvoir l'exécuter à partir d'autres appareils.
  • Partager l'application afin que d'autres personnes puissent l'exécuter.
  • En savoir plus sur les fonctions comme Patch, que vous pouvez utiliser pour gérer les données sans créer un formulaire standard.
  • Liez cette application à une solution afin que vous puissiez, par exemple, la déployer sur un autre environnement ou la publier sur AppSource.