Procédure pas à pas : création d'une application Vision Clinic

Cette procédure illustre pas à pas la procédure de bout en bout de création d'une application dans Visual Studio LightSwitch.Vous utiliserez nombre des fonctionnalités de LightSwitch pour créer une application Vision Clinic fictive.L'application inclut des fonctionnalités de planification de rendez-vous et de création de factures.

Composants requis

Téléchargez la base de données de PrescriptionContoso de MSDN Code Gallery.

Étapes

• Créer un projet

  Créer le projet d'application.

• Définir des tables

  Ajoutez les entités Patient, Invoice et Invoice Detail.

• Créer une liste de choix

  Créer une liste de valeurs.

• Définir une relation

  Lier les tables connexes.

• Ajouter une autre entité

  Ajouter l'entité Appointment.

• Créer un écran

  Créer un écran pour afficher des patients.

• Exécution de l'application

  Exécuter l'application et entrer des données.

• Se connecter à une base de données

  Se connecter à une base de données externe.

• Apporter des modifications aux entités

  Modifier les entités Products et Product Rebate.

• Créer un écran de liste et détails

  Créer un écran pour afficher des produits.

• Modifier la disposition de l'écran

  Modifiez la disposition de l'écran de la liste des produits.

• Apporter des modifications d'exécution

  Apporter des modifications dans l'application en cours d'exécution.

• Créer une requête

  Créer une requête paramétrable et la lier à un écran.

• Ajouter un champ calculé

  Créer un champ calculé et l'ajouter à un écran.

• Créer une relation entre bases de données

  Créer une relation virtuelle entre des entités dans des bases de données différentes.

• Créer l'écran Factures

  Créez un écran pour afficher des factures.

• Modifier l'écran des factures

  Modifier la disposition de l'écran Factures dans l'application en cours d'exécution.

• Ajouter la logique de l'écran

  Écrire du code pour calculer des dates.

• Ajouter d'autres champs calculés

  Créez des champs calculés plus complexes et les ajouter à l'écran Factures.

• Déployer l'application

  Publier l'application en tant qu'application bureautique à deux couches.

Créer un projet

La première étape pour créer une application LightSwitch consiste à ouvrir un nouveau projet.

Pour créer un projet

1. Dans le menu Windows Démarrer, cliquez sur Visual Studio 2012.

   Le concepteur LightSwitch apparaît.

2. Dans le menu Fichier, cliquez sur Nouveau projet.

   La boîte de dialogue Nouveau projet s'affiche.

3. Dans la liste Modèles installés, sélectionnez le nœud LightSwitch.

4. Dans le volet central, sélectionnez Application (VB)LightSwitch ou LightSwitchApplication (C#).

5. Dans le champ Nom, tapez Vision Clinic, puis cliquez sur OK.

   La fenêtre Concepteur de Vision Clinic s'affiche, et les dossiers nécessaires pour votre projet sont ajoutés à la fenêtre Explorateur de solutions.

   

Définir des tables

Dans LightSwitch, les tables sont appelées entités; elles modélisent l'objet représenté par les données, dans ce cas un patient.Les applications LightSwitch utilisent un modèle de « formulaires de données », autrement dit, des formulaires ou écrans qui affichent les données d'une ou plusieurs sources.LightSwitch inclut une base de données intrinsèque qui peut être utilisée pour stocker des données pour votre application.À l'étape suivante, vous créerez une table de base de données pour stocker des informations sur les patients.

Pour créer l'entité Patient

1. Dans la fenêtre Concepteur de Vision Clinic, cliquez sur Créer une table.

   Le Concepteur de données s'affiche et un nœud Table1Items apparaît sous Sources de données dans l'Solution Explorer.

2. Dans la fenêtre Propriétés, sélectionnez la propriété Nom, tapez Patient, puis appuyez sur Entrée.

   Le nom dans la barre de titre du Concepteur de données devient « Patient » et le nom dans l'explorateur de solutions devient « Patients ».

3. Dans la colonne Nom, cliquez sur <Ajouter une propriété>, tapez FirstName, puis appuyez sur Entrée.

   Notez que le type de données approprié, String, s'affiche dans la colonne Type, et que la case à cocher du champ Requis est sélectionnée.Un patient doit avoir un nom.

4. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez LastName.

5. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez Street.

6. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez Street2.

7. Dans la colonne Requis, décochez la case à cocher.

   La deuxième ligne d'une adresse postale est facultative.

8. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez City.

9. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez State.

10. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez Zip.

11. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez PrimaryPhone.

12. Dans la colonne Type, sélectionnez PhoneNumber dans la liste déroulante.

    PhoneNumber est un type d'entreprise personnalisé qui représente un modèle commun pour la saisie et la mise en forme de numéros de téléphone.

13. Dans la colonne Requis, décochez la case à cocher.

14. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez SecondaryPhone.

15. Dans la colonne Type, sélectionnez PhoneNumber dans la liste déroulante.

16. Dans la colonne Requis, décochez la case à cocher.

17. Cliquez sur <Ajouter un champ> dans la colonne Nom et tapez Email.

18. Dans la colonne Type, sélectionnez EmailAddress dans la liste déroulante.

    EmailAddress est un autre type d'entreprise personnalisé qui représente une adresse de messagerie correctement mise en forme.

19. Dans la colonne Requis, décochez la case à cocher.

20. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez PolicyNumber.

21. Dans la fenêtre Propriétés, sélectionnez la propriété Longueur maximale et tapez 12.

    Cela empêchera les utilisateurs d'entrer un numéro de police d'assurance comportant plus de 12 caractères.

    

22. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Ensuite, vous créerez deux entités supplémentaires pour représenter les éléments de facture et de ligne de facture.

Pour créer les entités Invoice et InvoiceDetail

1. Dans l'explorateur de solutions, cliquez sur Data Sources.Dans le menu Projet, cliquez sur Ajouter une table.

   Une nouvelle instance du Concepteur de données apparaît.

2. Dans la fenêtre Propriétés, sélectionnez la propriété Name.Tapez Invoice, puis appuyez sur Entrée.

3. Dans la colonne Nom, cliquez sur <Ajouter une propriété>.Tapez InvoiceDate, puis appuyez sur Entrée.

4. Dans la colonne Type, sélectionnez DateTime dans la liste déroulante.

5. Dans la colonne Nom, cliquez sur <Ajouter une propriété>.Tapez InvoiceDue, puis appuyez sur Entrée.

6. Dans la colonne Type, sélectionnez DateTime dans la liste déroulante.

7. Dans la colonne Requis, décochez la case à cocher.

8. Dans la colonne Nom, cliquez sur <Ajouter une propriété>.Tapez InvoiceStatus, puis appuyez sur Entrée.

9. Dans la colonne Type, sélectionnez Integer dans la liste déroulante.

10. Dans la colonne Nom, cliquez sur <Ajouter une propriété>.Tapez ShipDate, puis appuyez sur Entrée.

11. Dans la colonne Type, sélectionnez DateTime dans la liste déroulante.

    

12. Dans l'explorateur de solutions, cliquez sur Data Sources.Dans le menu Projet, cliquez sur Ajouter une table.

13. Dans la fenêtre Propriétés, sélectionnez la propriété Nom, tapez InvoiceDetail, puis appuyez sur Entrée.

14. Dans la colonne Nom, cliquez sur <Ajouter une propriété>, tapez Quantity, puis appuyez sur Entrée.

15. Dans la colonne Type, sélectionnez Integer dans la liste déroulante.

16. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez UnitPrice.

17. Dans la colonne Type, sélectionnez Money dans la liste déroulante.

    Money est un autre type d'entreprise personnalisé qui représente et met en forme les devises.

    

18. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer une liste de choix

À l'étape suivante, vous créerez une liste de choix pour l'entité Invoice.Une liste de choix vous permet de présenter à l'utilisateur un ensemble fixe de valeurs pour effectuer son choix.

Pour créer une liste de choix

1. Dans l'explorateur de solutions, double-cliquez sur Invoices.

2. Dans le Concepteur de données, sélectionnez le champ InvoiceStatus.

3. Dans la fenêtre Propriétés, cliquez sur le lien Liste de choix.

   

   La boîte de dialogue Liste de choix s'affiche.

4. Dans la boîte de dialogue Liste de choix, entrez les valeurs suivantes, puis cliquez sur OK.

   Valeur	Nom complet
   0	Active
   1	Payé
   2	En retard

   Lorsque ce champ s'affiche dans un écran, il présente à l'utilisateur une liste déroulante qui contient les trois valeurs Nom complet que vous avez entrées.

5. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Définir une relation

À l'étape suivante, vous définirez des relations entre les entités Patient, Invoiceet InvoiceDetail.

Pour définir des relations

1. Dans l'explorateur de solutions, double-cliquez sur Invoices.

2. Dans la barre d'outils Concepteur de données, cliquez sur Relation.

   La boîte de dialogue Ajouter une nouvelle relation s'affiche.

3. Dans la boîte de dialogue Ajouter une nouvelle relation, sélectionnez la colonne Vers sur la ligne Nom.Sélectionnez Patient, puis cliquez sur OK.

   Une relation one-to-many est créée entre les entités Patient et Invoice; un patient peut avoir plusieurs factures.

4. Dans la barre d'outils Concepteur de données, cliquez sur Relation.

   La boîte de dialogue Ajouter une nouvelle relation s'affiche.

5. Dans la boîte de dialogue Ajouter une nouvelle relation, sélectionnez la colonne Vers sur la ligne Nom, puis sélectionnez InvoiceDetail.

6. Dans la colonne De sur la ligne Multiplicité, sélectionnez Un.

7. Sélectionnez la colonne Vers sur la ligne Multiplicité, puis sélectionnez Plusieurs, et cliquez sur OK.

   Une relation one-to-many est créée entre les entités Invoice et InvoiceDetail; une facture peut avoir des détails de plusieurs factures.

   

8. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer l'entité Appointment

À l'étape suivante, vous ajouterez une ou plusieurs entités pour représenter un rendez-vous, puis vous ajouterez une relation et une liste de choix.

Pour ajouter l'entité Appointment

1. Dans l'explorateur de solutions, cliquez sur Data Sources, puis dans le menu Projet, cliquez sur Ajouter une table.

2. Dans la fenêtre Propriétés, remplacez Nom par Rendez-vous.

3. Dans le Concepteur de données, cliquez sur <Ajouter une propriété> dans la colonne Nom, puis tapez AppointmentTime.

4. Dans la colonne Type, sélectionnez DateTime dans la liste déroulante.

5. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez AppointmentType.

6. Dans la colonne Type, sélectionnez Short Integer dans la liste déroulante.

7. Cliquez sur <Ajouter une propriété> dans la colonne Nom et tapez DoctorNotes.

8. Acceptez le type par défaut, String, et décochez la case à cocher Requis.

9. Dans la barre d'outils Concepteur de données, cliquez sur Relation.

10. Dans la boîte de dialogue Ajouter une nouvelle relation, sélectionnez la colonne Vers sur la ligne Nom.Sélectionnez Patient, puis cliquez sur OK.

    Une relation one-to-many est créée entre les entités Patient et Appointment; un patient peut avoir plusieurs rendez-vous.

11. Dans le Concepteur de données, sélectionnez le champ AppointmentType.

12. Dans la fenêtre Propriétés, cliquez sur le lien Liste de choix.

    La boîte de dialogue Liste de choix s'affiche.

13. Dans la boîte de dialogue Liste de choix, entrez les valeurs suivantes, puis cliquez sur OK.

    Valeur	Nom complet
    0	Annuel
    1	Suivi
    2	Urgence

    

14. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer un écran

À l'étape suivante, vous créerez un écran pour afficher une liste de patients.

Pour créer un écran

1. Dans l'explorateur de solutions, cliquez sur le nœud Écrans, puis dans le menu Projet, cliquez sur Ajouter un écran.

   La boîte de dialogue Ajouter un nouvel écran s'ouvre.

2. Sélectionnez Écran format grille modifiable dans la liste Sélectionnez un modèle d'écran.

3. Dans la zone de texte Nom de l'écran, tapez PatientList.

4. Sélectionnez la liste déroulante Données d'écran et sélectionnez Patients.Cliquez sur OK.

   

   Le Concepteur d'écran s'ouvre et affiche une représentation hiérarchique de la disposition de l'écran.

5. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Exécuter l'application et entrer des données

Vous disposez désormais d'une application opérationnelle.À l'étape suivante, vous exécuterez l'application et entrerez des données.

Pour exécuter l'application

1. Appuyez sur F5 pour démarrer l'application.

2. Dans l'application en cours d'exécution, sélectionnez l'écran PatientList, puis cliquez sur le bouton Ajouter (+...).

   La boîte de dialogue Ajouter un nouveau patient s'affiche.

3. Entrer les données pour un nouveau patient.Dans le champ Courrier électronique, entrez une valeur non valide, par exemple john#example.com.

   

   Lorsque vous vous déplacez hors du champ une bordure rouge s'affiche.Le type d'entreprise EmailAddress a des règles de validation intégrées qui peuvent détecter une adresse de messagerie dans un format incorrect.

4. Corrigez l'erreur, terminez l'entrée de données, puis cliquez sur OK.

   Le bouton Enregistrer de la barre d'outils d'application est maintenant activé.

5. Cliquez sur le bouton Ajouter (+...).Ajoutez des données pour un deuxième patient, puis cliquez sur OK.

6. Cliquez sur Enregistrer pour enregistrer vos données.

   Vous pouvez maintenant réorganiser les colonnes dans la grille PatientList, et vous pouvez effectuer un tri sur une colonne.

7. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

8. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Se connecter à une base de données

À l'étape suivante, vous vous connecterez à une base de données externe qui contient les informations concernant le produit.

[!REMARQUE]

Avant d'exécuter cette étape, vous devrez télécharger et installer la base de données PrescriptionContoso.La base de données peut être téléchargé MSDN Code Galleryà partir de.Suivez les instructions du fichier Install.htm pour installer la base de données.

Attacher à une source de données

1. Dans l'explorateur de solutions, sélectionnez le nœud Sources de données.

2. Dans le menu Projet, cliquez sur Ajouter une source de données.

   L'Assistant Attacher une source de données s'ouvre.

3. Dans l'Assistant Attacher une source de données, cliquez sur Base de données, puis sur Suivant.

   La boîte de dialogue Choisir la source de données s'affiche.

   [!REMARQUE]

   Si vous vous êtes connecté précédemment à une base de données dans LightSwitch, cette boîte de dialogue ne s'affiche pas et vous pouvez ignorer l'étape suivante.

4. Si la boîte de dialogue Choisir la source de données s'affiche, sélectionnez Microsoft SQL Server (SQL CLient) et cliquez sur Continuer.

   La boîte de dialogue Propriétés de connexion s'affiche.

5. Dans la boîte de dialogue Propriétés de connexion, entrez les valeurs dans la table suivante, puis cliquez sur OK.

   Champ	Valeur
   Server Name	(localdb)\v11.0
   Se connecter au serveur	Utiliser l'authentification Windows
   Sélectionnez ou entrez un nom de base de données	C:\Temp\PrescriptionContoso.mdf

   

   La page de l'Assistant Choisir vos objets de base de données s'affiche.

6. Développez le nœud Tables.

7. Sélectionnez les tables Product et ProductRebate, puis cliquez sur Terminer.

   La source de données C_TEMP_PRESCRIPTIONCONTOSO_MDFData est ajoutée au projet et les entités sont créées pour Products et ProductRebates.

8. Dans l'explorateur de solutions, cliquez avec le bouton droit sur C_TEMP_PRESCRIPTIONCONTOSO_MDFData, cliquez sur Renommer, puis tapez PrescriptionContoso.

9. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Modifier les entités Products et ProductRebate

À l'étape suivante, vous apporterez des modifications aux entités ProductRebate et Products.

Pour modifier les entités Products et ProductRebate

1. Dans l'explorateur de solutions, double-cliquez sur le nœud ProductRebates.

2. Sélectionnez le champ Rabais et modifiez le Type en Money.

3. Dans l'explorateur de solutions, double-cliquez sur le nœud Products.

4. Dans le Concepteur de données, sélectionnez le champ Prix de détail conseillé par le fabricant et modifiez le Type en Money.

5. Sélectionnez le champ ProductImage et modifiez le Type en Image.

6. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer un écran de liste et détails

À l'étape suivante, vous créerez un écran pour afficher les informations sur le produit.

Pour créer un écran de liste et détails

1. Dans l'explorateur de solutions, sélectionnez le nœud Écrans.Dans le menu Projet, cliquez sur Ajouter un écran.

2. Dans la boîte de dialogue Ajouter un nouvel écran, sous Écran de liste et détails dans la liste Sélectionnez un modèle d'écran.

3. Dans le champ Nom de l'écran, tapez ProductList.

4. Sélectionnez la liste déroulante Données d'écran et sélectionnez PrescriptionContoso.Products.

5. Dans la liste Données supplémentaires à inclure, activez les cases à cocher Product Details et Product ProductRebates, puis cliquez sur OK.

Modifier la disposition de l'écran

À l'étape suivante, vous ajouterez la disposition de l'écran ProductList.

Pour personnaliser la disposition

1. Dans le Concepteur d'écran, sélectionnez le nœud Rows Layout | Product Details dans l'Arborescence de contenu de l'écran.

2. Dans la liste déroulante Disposition des lignes, sélectionnez Image et texte.

3. Sélectionnez les valeurs suivantes de la liste déroulante pour chaque champ sous le nœud Image et texte:

   Champ	Valeur
   (PICTURE)	Image du produit
   (TITLE)	Nom du produit
   (SUBTITLE)	Prix de détail conseillé par le fabricant (MSRP)
   (DESCRIPTION)	Description

   

4. Appuyez sur F5 pour exécuter l'application et consulter les résultats.

5. Dans l'application en cours d'exécution, cliquez sur le menu ProductList pour afficher l'écran.

   Ne fermez pas l'application.À l'étape suivante, vous apporterez des modifications dans l'application en cours d'exécution.

Apporter des modifications dans l'application en cours d'exécution

À l'étape suivante, vous modifierez l'écran Liste de produits dans l'application en cours d'exécution.

Pour personnaliser un écran au moment de l'exécution

1. Sur l'écran Liste des produits, cliquez sur le bouton Concevoir l'écran dans l'angle inférieur droit.

2. Dans le volet de gauche, sélectionnez le nœud Data Grid | Product Rebates.

3. Dans la fenêtre Propriétés, remplacez la propriété Nom complet par Contoso Rebates.

   Le nom change également dans la fenêtre d'application.

4. Sélectionnez le champ MSRP et modifiez la propriété Description en Prix suggéré avant remises.

   

5. Cliquez sur le bouton Enregistrer pour revenir à l'application en cours d'exécution et consulter les modifications.Pointez sur le champ MSRP pour afficher sa description.

6. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

7. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer une requête

À l'étape suivante, vous créerez une requête paramétrable et la lierez à un écran.

Pour créer une requête paramétrable

1. Dans l' Explorateur de solutions, sélectionnez le nœud Products.Dans le menu Projet, cliquez sur Ajouter une requête.

   Le Concepteur de requêtes apparaît.

2. Dans la fenêtre Propriétés, sélectionnez le champ Nom et tapez RelatedProducts.

3. Dans le Concepteur de requêtes, cliquez sur Ajouter un filtre.

   Une condition de filtre est ajoutée à la section Filtrer.

4. Dans la deuxième liste déroulante, sélectionnez Catégorie.

5. Dans la quatrième liste déroulante, sélectionnez Paramètre.

6. Dans la cinquième liste déroulante, cliquez sur Ajouter.

   Un nouveau Parameter nommé Category de type String est ajouté à la section Paramètres.

   

7. Dans l'explorateur de solutions, double-cliquez sur le nœud ProductList pour ouvrir le Concepteur d'écran.

8. Dans la barre d'outils Concepteur d'écran, cliquez sur Ajouter un élément de données.

   La boîte de dialogue Ajouter un élément de données s'affiche.

9. Dans la boîte de dialogue Ajouter un élément de données, cliquez sur Requête.Dans la colonne Nom, sélectionnez PrescriptionContoso.RelatedProducts, puis cliquez sur OK.

   Un nœud RelatedProducts s'affiche dans le volet gauche.

10. Sélectionnez le nœud Category sous Paramètres de la requête.

11. Dans la fenêtre Propriétés, sélectionnez la propriété Liaison de paramètre et tapez Products.SelectedItem.Category.

12. Dans le volet central, développez le nœud Add sous le nœud DataGrid | Contoso Rebates et cliquez sur Related Products.

    

13. Appuyez sur F5 pour exécuter l'application et consulter les résultats.

    Ouvrez l'écran Liste de produits et notez qu'une liste de produits connexes est affichée pour chaque produit sélectionné.

14. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

15. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Ajouter un champ calculé

À l'étape suivante, vous ajouterez un champ qui utilise une valeur calculée.La valeur calculée sera le prix d'un produit une fois le rabais appliqué.

Pour ajouter un champ calculé

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité Products.

2. Dans le Concepteur de données, cliquez sur <Ajouter une propriété>.Tapez CurrentPrice, puis appuyez sur Tabulation.

3. Dans la colonne Type, sélectionnez Money dans la liste déroulante.

   Dans la fenêtre Propriétés, sous Général la propriété Est calculée est sélectionnée par défaut.

4. Dans la fenêtre Propriétés, cliquez sur le lien Modifier la méthode.

   L'Éditeur de code apparaît et affiche la méthode CurrentPrice_Compute.

5. Ajoutez le code suivant au gestionnaire d'événements :

   Dim rebates As Decimal
       For Each item In ProductRebates
           If item.RebateStart <= Date.Today And item.RebateEnd >= Date.Today Then
               rebates = rebates + item.Rebate
           End If
       Next
   
       result = Me.MSRP - rebates
   

   decimal rebates = default(decimal);
   
   
               foreach (var item in ProductRebates)
               {
                   if (item.RebateStart <= System.DateTime.Today && item.RebateEnd >= System.DateTime.Today)
                   {
                       rebates += item.Rebate.Value;
                   }
               }
   
               result = this.MSRP - rebates;
   

   

6. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

À l'étape suivante, vous ajouterez le champ calculé à l'écran ProductList.

Pour ajouter un champ calculé à un écran

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'écran ProductList.

2. Dans le volet gauche du Concepteur d'écran, sélectionnez le nœud CurrentPrice et faites-le glisser en dessous du nœud (Description) | Description dans le volet central.

   

3. Appuyez sur F5 pour exécuter l'application et consulter les résultats.

4. Dans l'écran ProductList, modifiez le champ Rabais ou MSRP.Le CurrentPrice est recalculé.Cliquez sur Fermer pour revenir au mode Création.

5. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

6. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer une relation entre bases de données

À l'étape suivante, vous créerez une relation virtuelle entre des entités de deux bases de données différentes et afficherez les données de deux sources différentes dans un seul écran de liste et détails.

Pour créer une relation entre bases de données

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité InvoiceDetails.

2. Dans le Concepteur de données, cliquez sur le bouton de barre d'outils Relation.

3. Dans la boîte de dialogue Ajouter une nouvelle relation, sélectionnez le champ Nom dans la colonne Vers et sélectionnez Product.

   Une nouvelle section s'affiche en bas de boîte de dialogue.Elle affiche les champs connexes dans les deux entités.Si nécessaire, vous pouvez modifier les champs connexes en un autre champ du même type de données ou définir plusieurs champs connexes comme clés.

   

4. Cliquez sur OK pour enregistrer la relation.

   La nouvelle relation s'affiche sous forme de trait en pointillé dans le concepteur.Cela indique que les entités sont dans des sources de données différentes, dans ce cas InvoiceDetails dans la base de données intrinsèque et Products dans la base de données PrescriptionContoso.

5. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Créer un écran pour afficher des factures

À l'étape suivante, vous créerez un écran pour afficher les factures.

Pour créer un écran

1. Dans l'explorateur de solutions, sélectionnez le nœud Écrans.Dans le menu Projet, cliquez sur Ajouter un écran.

2. Dans la boîte de dialogue Ajouter un nouvel écran, sous Écran de liste et détails dans la liste Sélectionnez un modèle d'écran.

3. Dans la zone de texte Nom de l'écran, tapez InvoiceScreen.

4. Sélectionnez la liste déroulante Données d'écran et sélectionnez Invoices.

5. Dans la liste Données supplémentaires à inclure:, sélectionnez Invoice Details et Invoice InvoiceDetails, puis cliquez sur OK.

   

6. Développez le nœud Data Grid Row | Invoice Detail.Sélectionnez le nœud Product Product ID et supprimez-le.

7. Pour réorganiser les champs, cliquez sur le nœud UnitPrice et faites-le glisser sous le nœud Product.

8. Appuyez sur F5 pour exécuter l'application.Dans le menu, cliquez sur Invoice Screen pour afficher l'écran.

9. Dans le volet Invoices, cliquez sur le bouton Ajouter (+...).

   Entrer des données de facture.Notez que le champ InvoiceStatus fournit une liste déroulante de valeurs, et le champ Patient contient un bouton qui ouvre une boîte de dialogue contenant une liste de patients.

10. Dans le volet Détails de la facture, cliquez sur le bouton Ajouter (+...).

    Entrez des données de détail de facture.Notez que le champ Product fournit une liste déroulante de produits de la base de données PrescriptionContoso.

11. Cliquez sur le bouton Enregistrer pour enregistrer les données de votre facture.

12. Ne fermez pas l'application.À l'étape suivante, vous apporterez des modifications dans l'application en cours d'exécution.

Modifier l'écran des factures

À l'étape suivante, vous apporterez des modifications à l'écran Invoices dans l'application en cours d'exécution.

Pour modifier un écran dans l'application en cours d'exécution

1. Dans l'écran Invoice Screen, cliquez sur le bouton Concevoir l'écran dans le coin supérieur droit.

2. Dans le volet de gauche, sélectionnez le nœud Liste | Factures.Dans la liste déroulante Liste, sélectionnez DataGrid.

3. Sélectionnez le nœud Patient.Utilisez la flèche Monter dans la marge de gauche pour le déplacer au-dessus du nœud Invoice Date.

   

4. Cliquez sur Enregistrer pour revenir à l'application en cours d'exécution et consulter les modifications.

5. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

6. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Définir la logique de l'écran

À l'étape suivante, vous ajouterez le code pour définir la logique par défaut pour les dates de facture.

Pour définir la logique de l'écran

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité Invoices.

2. Dans le Concepteur de données, cliquez sur la liste déroulante Écrire le code dans la barre d'outils.Cliquez sur le lien Invoice_Created.

   L'Éditeur de code s'ouvre et affiche la méthode Invoice_Created.

3. Dans la méthode Invoice_Created, ajoutez le code suivant pour définir le comportement par défaut des dates:

   InvoiceDate = Date.Today
   InvoiceDue = Date.Today.AddDays(30)
   ShipDate = Date.Today.AddDays(3)
   

   InvoiceDate = System.DateTime.Today;
   InvoiceDue = System.DateTime.Today.AddDays(30);
   ShipDate = System.DateTime.Today.AddDays(3);
   

4. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité Invoices.

5. Dans le Concepteur de données, sélectionnez le champ InvoiceDate.

6. Cliquez sur la liste déroulante Écrire le code sur la barre d'outils, puis cliquez sur le lien InvoiceDate_Changed.

7. Dans la méthode InvoiceDate_Changed, ajoutez le code suivant pour mettre à jour les dates lorsque InvoiceDate est modifié:

   InvoiceDue = InvoiceDate.AddDays(30)
   ‘ If the ShipDate is earlier than the new InvoiceDate, update it.
   If ShipDate < InvoiceDate Then
       ShipDate = InvoiceDate.AddDays(2)
   End If
   

   InvoiceDue = InvoiceDate.AddDays(30); 
       // If the ShipDate is earlier than the new InvoiceDate, update it
   if (ShipDate < InvoiceDate)
       {
           ShipDate = InvoiceDate.AddDays(2);
       }
   

8. Dans l'explorateur de solutions, double-cliquez sur le nœud InvoiceDetails.

9. Dans le Concepteur de données, sélectionnez le champ Product, cliquez sur la liste déroulante Écrire le code dans la barre d'outils, puis cliquez sur le lien Product_Changed.

10. Dans l'Éditeur de code, ajoutez le code suivant pour définir le prix unitaire et la quantité par défaut:

    UnitPrice = Product.CurrentPrice
    Quantity = 1
    

    UnitPrice = Product.CurrentPrice;
    
    Quantity = 1;
    

11. Appuyez sur F5 pour exécuter l'application et consulter les modifications.

    Ouvrez l'écran Facture et ajoutez une nouvelle facture.Les champs de date, le prix et la quantité sont maintenant mis à jour automatiquement.

12. Cliquez sur le bouton Enregistrer pour enregistrer vos modifications.

13. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

14. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Ajouter d'autres champs calculés

À l'étape suivante, vous ajouterez des champs calculés pour Sous-total, Taxe et Totaux aux entités InvoiceDetails et Invoices.

Pour ajouter des champs calculés

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité InvoiceDetails.

2. Dans le Concepteur de données, cliquez sur <Ajouter une propriété>. Tapez Sous-total, puis appuyez sur Tabulation.

3. Dans la colonne Type, sélectionnez Money dans la liste déroulante.

4. Dans la fenêtre Propriétés, sous Propriétés générales, activez la case à cocher IsComputed.

5. Cliquez sur le lien Modifier la méthode.

   L'Éditeur de code apparaît et affiche la méthode SubTotal_Compute.

6. Ajoutez le code suivant pour calculer le SubTotal.

   result = Quantity * UnitPrice
   

   result = Quantity * UnitPrice;
   

7. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité Invoices.

8. Dans le Concepteur de données, cliquez sur <Ajouter une propriété>. Tapez Taxe, puis appuyez sur Tabulation.

9. Dans la colonne Type, sélectionnez Money dans la liste déroulante.

10. Dans la fenêtre Propriétés, activez la case à cocher IsComputed.

11. Cliquez sur le lien Modifier la méthode.

    L'Éditeur de code s'ouvre et affiche la méthode Tax_Compute.

12. Remplacez la méthode Tax_Compute par le code suivant pour calculer la Tax:

    Private Sub Tax_Compute(ByRef result As Decimal)
        Result =  GetSubTotal() * 0.095
    End Sub
    Protected Function GetSubTotal() As Decimal
        GetSubtotal = 0
        For Each item In InvoiceDetails
            GetSubTotal = GetSubTotal + item.SubTotal
        Next
    End Function
    

    partial void Tax_Compute(ref decimal result)
        {
            result = GetSubTotal() * (decimal)0.095;
        }
    protected decimal GetSubTotal()
        {
            return this.InvoiceDetails.Sum(i => i.SubTotal);
        }
    

13. Dans l'explorateur de solutions, double-cliquez sur le nœud d'entité Invoices.

14. Dans le Concepteur de données, cliquez sur <Ajouter une propriété>.Tapez Total, puis appuyez sur Tabulation.

15. Dans la colonne Type, sélectionnez Money dans la liste déroulante.

16. Dans la fenêtre Propriétés, activez la case à cocher IsComputed.

17. Cliquez sur le lien Modifier la méthode.

    L'Éditeur de code s'ouvre et affiche la méthode Total_Compute.

18. Ajoutez le code suivant pour calculer le Tax.

    result = GetSubTotal() + Tax
    

    result = GetSubTotal() + Tax;
    

19. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

À l'étape suivante, vous ajouterez les nouveaux champs à l'écran Invoices.

Pour ajouter des champs à un écran

1. Dans l'explorateur de solutions, double-cliquez sur le nœud d'écran InvoiceScreen.

2. Dans le volet central, sélectionnez et développez le nœud Rows Layout | Invoice Details.

3. Sélectionnez et développez la liste déroulante Ajouter et sélectionnez Taxe.

   Le champ Taxe est ajouté à la section Pile Verticale | InvoiceDetails.

4. Sélectionnez de nouveau la liste déroulante Ajouter et sélectionnez le champ Total.

5. Appuyez sur F5 pour exécuter l'application et consulter les résultats.

   Ouvrez l'écran Invoice Screen.Les champs Taxe et Total sont maintenant affichés pour chaque ligne de facture.

6. Cliquez sur le bouton Concevoir l'écran pour passer en mode de personnalisation.

7. Dans le volet de gauche, sélectionnez et développez le nœud Ligne de grille de données| Détails de la facture.

8. Cliquez sur la liste déroulante Ajouter et sélectionnez SubTotal.

9. Cliquez sur Enregistrer pour enregistrer la modification.Un champ SubTotal est maintenant affiché dans la grille Détails de la facture.

   

10. Cliquez sur le bouton Fermer dans le coin supérieur droit de l'application en cours d'exécution pour revenir au mode design.

11. Dans le menu Fichier, cliquez sur Enregistrer tout pour enregistrer votre travail.

Déployer l'application

À l'étape suivante, vous déploierez l'application en tant qu'application bureautique à deux couches.

Pour publier une application bureautique à deux couches

1. Dans l'explorateur de solutions sélectionnez le nœud Vision Clinic, puis dans le menu Générer, cliquez sur Publier Vision Clinic.

   L'Assistant de Publication d'application LightSwitch s'affiche.

2. Sur la page Bienvenue dans l'Assistant de Publication LightSwitch, vérifiez que l'option Bureau est sélectionnée, puis cliquez sur Suivant.

3. Sur la page Services d'application, vérifiez que l'option Local est sélectionnée, puis cliquez sur Suivant.

4. Sur la page Spécifier les préférences de publication, sélectionnez le champ Où voulez-vous placer les fichiers d'application ? et tapez C:\Publish.

5. Dans la section Comment voulez-vous publier la base de données par défaut ?, sélectionnez Publier directement dans la base de données maintenant, puis cliquez sur Suivant.

6. Sur la page Données d'application LightSwitch - Connexion de base de données SQL, acceptez les valeurs de chaîne de connexion par défaut, puis cliquez sur Suivant.

7. Sur la page Composants requis pour l'installation, acceptez les paramètres par défaut et cliquez sur Suivant.

8. Dans la page Autres informations de connexion, acceptez les paramètres par défaut, puis cliquez sur Suivant.

9. Dans l'explorateur Windows, accédez au répertoire C:\Publish et double-cliquez le fichier Setup.exe pour installer l'application sur l'ordinateur local.

   [!REMARQUE]

   Pour installer l'application sur un autre ordinateur, copiez le contenu du dossier de publication et de tous ses sous-dossiers.Avant de procéder à l'installation, vous devez effectuer les étapes décrites dans le fichier Install.htm, disponible dans le dossier de publication.

10. Si une boîte de dialogue d'Installation de l'application – Avertissement de sécurité s'affiche, cliquez sur Installer.

    L'application Vision Clinic sera installée et lancée.

    

11. Entrez des données et vérifiez que l'application fonctionne comme prévu.

    Conseil
    Si vous voulez réexécuter l'application Vision Clinic, vous pouvez l'ouvrir dans le menu Démarrer.

Cela termine la procédure pas à pas de l'application Vision Clinic.Vous devez maintenant avoir compris les notions fondamentales de la procédure de création de bout en bout d'une application LightSwitch.

Cette procédure pas à pas a présenté les fonctionnalités de base de LightSwitch, mais vous pouvez en faire encore davantage avec LightSwitch.Lorsque vous commencez à générer vos propres applications, vous pouvez approfondir votre connaissance des fonctionnalités dans la documentation du produit.

Voir aussi

Concepts

Visite guidée de LightSwitch

Visual Studio LightSwitch

Autres ressources

Mise en route avec LightSwitch