Labo : créer une application canevas avec des contrôles uniques

Effectué

Important

Pour ce labo, ne vous connectez pas avec vos informations d’identification. Pour vous connecter à votre environnement de labo avec les informations d’identification correctes, procédez comme suit :

  1. Sélectionnez Se connecter pour lancer le mode Machine virtuelle dans cette unité.
  2. Une fenêtre PowerShell et une invite de commande Windows s’affichent alors. Après deux à trois minutes, elles se ferment et Power Apps s’ouvre automatiquement. Attendez l’affichage de l’écran d’accueil Power Apps.

Pour consulter les instructions du labo, cliquez sur l’onglet Instructions dans l’encadré du labo.

Création de la collection de données

Au cours de cette formation, plusieurs contrôles mentionnés dans les unités précédentes vont vous permettre de créer une application canevas unique qui évoluera à mesure que vous interagirez avec les contrôles. Vous aurez ainsi une idée des fonctionnalités des contrôles et de la manière dont vous pouvez les adapter à vos besoins.

Remarque

Power Apps requiert une licence Office 365, une version d’évaluation gratuite ou un compte développeur gratuit.

  1. Connectez-vous à Power Apps.

  2. Sur l’écran d’accueil, cliquez sur Créer>Application vide, puis sur Créer sous Application canevas vide dans la fenêtre contextuelle.

  3. Nommez votre application New Controls App, puis cliquez sur Créer.

  4. Ignorez le message de bienvenue. Ensuite, cliquez sur le bouton Insérer, puis sélectionnez un contrôle Bouton. Définissez sa propriété OnSelect sur la formule suivante :

    ClearCollect(CityPopulations, {City:"London", 
    Country:"United Kingdom", Population:8615000}, {City:"Berlin",
    Country:"Germany", Population:3562000}, {City:"Madrid",
    Country:"Spain", Population:3165000}, {City:"Rome",
    Country:"Italy", Population:2874000}, {City:"Paris",
    Country:"France", Population:2273000}, {City:"Hamburg",
    Country:"Germany", Population:1760000}, {City:"Barcelona",
    Country:"Spain", Population:1602000}, {City:"Munich",
    Country:"Germany", Population:1494000}, {City:"Milan",
    Country:"Italy", Population:1344000})
    
  5. Maintenez enfoncée la touche Alt, puis sélectionnez le contrôle Bouton. (Vous allez ainsi créer votre collection et y stocker toutes les informations.)

  6. Cliquez sur le bouton Insérer, sélectionnez un contrôle Galerie verticale, puis CityPopulations dans la fenêtre contextuelle Sélectionner une source de données.

    Capture d’écran de la galerie insérée, avec le bouton Insérer et l’option CityPopulations mis en évidence.

  7. Avec la galerie sélectionnée, dans le volet Propriétés à droite, redéfinissez la propriété Layout en remplaçant Image, titre et sous-titre par Titre, sous-titre et corps.

  8. Sélectionnez le dernier (ou troisième) libellé dans le premier élément de la galerie, puis redéfinissez la propriété Text sur ThisItem.Population.

    Capture d’écran des options du menu Galerie pour la propriété Text.

  9. Sélectionnez Screen1 dans l’Arborescence (afin de ne pas l’insérer dans la galerie). Ensuite, cliquez sur le bouton Insérer, puis recherchez/sélectionnez un contrôle Curseur.

  10. Redéfinissez la propriété Max du curseur sur 10000000.

  11. Insérez un contrôle Libellé de texte et redéfinissez la propriété Text sur Slider1.Value.

  12. Sélectionnez le premier élément de la galerie, puis cliquez sur Insérer. Ensuite, recherchez et sélectionnez une icône représentant une Coche. Placez-la à droite de la galerie.

    Remarque

    Des coches devraient s’afficher dans chaque ligne de la galerie. Une galerie répète le format du premier élément pour tous les autres. Si vous ne voyez pas plusieurs coches, veillez de nouveau à sélectionner le premier élément de la galerie et insérer une icône représentant une Coche.

  13. Redéfinissez la propriété Visible de l’icône représentant une coche sur :

    ThisItem.Population > Slider1.Value
    

    Capture de l’écran de l’application avec des exemples de données.

Placez l’application en mode Aperçu et essayez d’ajuster le curseur. Lorsque vous ajustez le curseur, des coches devraient apparaître et disparaître par élément de la galerie, car vous définissez la visibilité afin qu’elle change en fonction du contrôle du curseur. En substance, vous avez créé une galerie qui indique si la population d’une ville est supérieure ou non à la valeur du curseur.