Créer une carte de liste d’achats

Dans ce didacticiel, vous allez créer une carte qui affiche une liste d’achats et vous permet d’ajouter des articles. Vous utiliserez le concepteur de cartes, les variables et Power Fx.

À la fin du didacticiel, votre carte de liste d’achats devrait ressembler à l’exemple suivant :

Conditions préalables

• Un compte Power Apps

Créer une carte

1. Connectez-vous à Power Apps, et sélectionnez vos environnements.

2. Dans le volet de gauche, sélectionnez Cartes. Si l’élément ne se trouve pas dans le volet latéral, sélectionnez …Plus, puis sélectionnez l’élément souhaité.

3. Sélectionnez + Créer une carte.

4. Sous Nom de la carte, saisissez SimpleShoppingCard, puis sélectionnez Créer.

5. Sélectionnez le texte Tapez le titre de votre carte ici. Dans le volet des propriétés de l’étiquette de texte, définissez Texte sur Liste d’achats.

6. Sélectionnez le texte Ajoutez et supprimez un élément pour personnaliser votre nouvelle carte. Dans le volet des propriétés de l’étiquette de texte, définissez Texte sur Utilisez la zone ci-dessous pour ajouter des articles à la liste.

Ajouter une variable

La liste d’achats contiendra des articles individuels dans des lignes de texte distincts. Elle ressemble à un tableau avec une seule colonne, avec un article dans chaque ligne. Cela suggère que vous devrez créer une variable de table pour stocker votre liste.

1. Dans le volet de gauche, sélectionnez Variables.

2. Sélectionnez + Nouvelle variable.

3. Dans la fenêtre Nouvelle variable, entrez MyGroceryList sous Nom. Définissez Type sur Table.

4. Sélectionnez les accolades à droite de Valeur par défaut et entrez "" entre les accolades. Cela indique que notre table contient des valeurs de texte dans une colonne appelée implicitement Valeur

5. Cliquez sur Enregistrer.

   

Ajouter une liste à la carte

1. Dans le volet de gauche, sélectionnez Insérer.

2. Dans le volet d’outils, sélectionnez Afficher pour développer la catégorie, puis sélectionnez Étiquette de texte.

3. Dans le volet des propriétés de l’étiquette de texte, sélectionnez l’onglet Avancé.

4. Définissez Répéter pour chaque MyGroceryList.

   

   La définition de la propriété Répéter pour chaque d’une Étiquette de texte repète l’étiquette de texte pour chaque élément de la table spécifiée. Dans cet exemple, la table, MyGroceryList, est la variable que vous avez créée. En d’autres termes, une Étiquette de texte distincte est créée dans la carte pour chaque article de la liste de courses.

5. Sélectionnez l’onglet Propriétés. Définissez Texte sur ThisItem.Value.

   L’attribution de la variable définie par le système ThisItem.Value à l’étiquette de texte affiche la valeur de l’élément actuel dans le tableau MyGroceryList comme texte de l’étiquette. Tableau est un autre terme pour une variable de table. Vous pouvez entrer le nom de la variable dans la barre de formule ou le volet des propriétés.

   

Ajouter une zone de saisie

La liste que vous avez créée est vide, donc dans la dernière étape, vous donnerez à l’utilisateur la possibilité d’ajouter des éléments.

1. Dans le volet de gauche, sélectionnez Insérer.

2. Dans le volet d’outils, sélectionnez Entrée pour développer la catégorie, puis sélectionnez Saisie de texte.

3. Dans le volet des propriétés de saisie de texte, définissez Name sur NewItem et définissez Étiquette sur Nouvel élément.

   

   La propriété Name vous permet de faire référence au contrôle dans une expression Power Fx. Elle ne doit contenir qu’un seul mot, sans espaces ni caractères spéciaux. La propriété Étiquette est affichée dans la carte. Le nom et l’étiquette d’un contrôle ne doivent pas nécessairement être similaires, comme ils le sont ici, mais l’utilisation de noms similaires facilite le suivi des contrôles.

Ajouter un bouton Power Fx

1. Dans le volet de gauche, sélectionnez Insérer.

2. Dans le volet d’outils, sélectionnez Entrée pour développer la catégorie, puis sélectionnez Bouton.

3. Dans le volet des propriétés du bouton, définissez Type sur Ajouter un élément.

4. Dans le volet des propriétés, sélectionnez PowerFx pour placer votre curseur dans la barre de formule.

5. Saisissez l’expression Power Fx suivante dans la barre de formule : Collect(MyGroceryList, {Value: NewItem})

   Cette expression utilise la fonction Collect de Power Fx pour ajouter la valeur de la saisie de l’utilisateur, NewItem, à la variable de table MyGroceryList dans la colonne Valeur implicite. Étant donné que l’expression est liée à la propriété OnSelect du bouton, elle s’exécute lorsque l’utilisateur sélectionne le bouton.

   

Tester la carte

Vous devez toujours enregistrer vos modifications avant de lire une carte. Sélectionnez Enregistrer, puis Lire.

Testez votre carte en ajoutant quelques articles à la liste de courses.

Étapes suivantes

Apprenez à créer une carte plus complexe avec les connecteurs Microsoft Dataverse.