Écrans de client HTML pour les applications LightSwitch

À l'aide de Microsoft LightSwitch pour Visual Studio Update 2, vous pouvez créer des écrans clients HTML optimisées pour l'affichage sur les appareils mobiles.Cette rubrique présente les modèles que vous pouvez utiliser pour créer les écrans qui sont basés sur HTML5, les outils que vous pouvez utiliser pour concevoir des écrans, et certaines tâches que vous pouvez effectuer pour concevoir les meilleurs écrans pour votre application de LightSwitch.

Pour obtenir un exemple de bout en bout d'un client qui utilise des écrans HTML, consultez Procédure pas à pas : création d'un client LightSwitch pour les utilisateurs mobiles.

Clients HTML

Vous pouvez ajouter un ou plusieurs clients de HTML à une application existante d' LightSwitch, ou vous pouvez créer une application d' Microsoft LightSwitch pour Visual Studio Update 2 qui contient uniquement un client HTML.Chaque client HTML est contenu dans son propre projet dans la solution d' LightSwitch .

[!REMARQUE]

Lorsque vous ajoutez un projet de Client HTML à une solution d' LightSwitch, elle a mis à jour à Microsoft LightSwitch pour Visual Studio Update 2.La structure de fichiers de la solution est modifiée, et vous ne pouvez plus la solution sur un ordinateur qui ne dispose pas Microsoft LightSwitch pour Visual Studio Update 2 est installé.

Pour plus d'informations, consultez Comment : créer ou ajouter un projet client HTML.

Modèles d'écran

Pour commencer, créez un écran à l'aide de l'un des modèles d'écran suivants :

• Recherchez l'écran

• Écran de détails de vue

• Écran de détails ajoutez/modification

Pour plus d'informations sur la sélection d'un modèle, consultez Choix d'un type d'écran pour un client HTML d'une application LightSwitch.

Pour plus d'informations sur la recherche de ces modèles, consultez Comment : créer un écran de client HTML.

Concepteur d'écran

Vous pouvez modifier la conception d'un écran à l'aide de le générateur d'écran.Le concepteur d'écran affiche des éléments tels que les champs de données et commandes, et l'arborescence de contenu de l'écran, qui est une représentation hiérarchique de vos données.Vous pouvez faire glisser des éléments vers l'arborescence de contenu de l'écran et les réorganiser dans l'ordre que vous voulez.

Pour plus d'informations sur le concepteur d'écran, consultez Visite du concepteur d'écran.

Pour plus d'informations sur la façon d'effectuer des tâches spécifiques dans le concepteur d'écran, consultez Comment : concevoir un écran HTML à l'aide du concepteur d'écran.

Tâches de conception d'écran

Pour modifier la conception d'un écran, vous pouvez effectuer les tâches suivantes :

• Modifier l'apparence d'un écran

• Ajouter des champs et des commandes à un écran

• Filtrer les données qui s'affichent dans un écran

• Ajouter des données à un écran

• Personnalisez la navigation entre les écrans

• Modifier un écran à l'aide de code

Modifier l'apparence d'un écran

Vous pouvez modifier l'affichage des données dans un écran.Par exemple, vous pouvez configurer une collecte d'informations pour apparaître sous la forme d'une liste ou en mosaïque.Vous pouvez modifier l'ordre dans lequel les champs s'affichent ou regroupent les champs ensemble.

Pour plus d'informations, consultez Comment : concevoir un écran HTML à l'aide du concepteur d'écran.

Ajouter des champs et des commandes à un écran

Les écrans HTML dans LightSwitch fournissent des commandes prédéfinies afin que les utilisateurs puissent afficher, mettre à jour, supprimer, ou enregistrer des données.Vous pouvez également ajouter des commandes et des champs personnalisés.

Ajoutez une commande personnalisée si vous souhaitez ajouter la logique métier à l'écran.Par exemple, vous pouvez ajouter un bouton afin qu'un utilisateur puisse afficher une liste de clients selon le volume de commande.Pour plus d'informations, consultez Comment : ajouter un bouton à un client mobile pour LightSwitch.

Vous pouvez ajouter des champs de propriétés locales personnalisés pour collecter ou afficher des informations.Par exemple, vous pouvez ajouter une zone de texte en regard du bouton de volume de ventes afin que l'utilisateur puisse spécifier le nombre de clients qui doivent s'afficher dans la liste.Pour plus d'informations, consultez Comment : ajouter une propriété locale à un écran HTML.

Ajouter des contrôles personnalisés à un écran

En ajoutant des contrôles personnalisés à un écran HTML, vous pouvez afficher ou collecter des informations d'une manière qui vont au delà des fonctionnalités des contrôles intégrés à LightSwitch.Vous pouvez également utiliser un contrôle personnalisé pour remplacer tout contrôle intégré d' LightSwitch qui s'affiche à l'écran.Pour plus d'informations, consultez Comment : ajouter un contrôle personnalisé à un écran HTML pour une application LightSwitch.

Filtrer les données qui s'affichent dans un écran

Vous pouvez filtrer les données qui s'affichent dans un écran en modifiant les conditions de requêtes d'écran.

Chaque groupe de données qui s'affiche dans le volet de gauche du concepteur est basé sur une requête.Les affichages écran uniquement les informations retournées par ces requêtes.Pour modifier les informations qui s'affichent pour un groupe de données, modifiez la requête.

Pour plus d'informations, consultez Comment : filtrer des données dans un client HTML pour une application LightSwitch.

Ajouter des données à un écran

Vous pouvez ajouter d'autres types de données à un écran.Par exemple, dans un écran qui affiche des clients, vous pouvez ajouter une grille de données qui affiche une liste de commandes.Pour plus d'informations, consultez Comment : Ajouter des données à un écran.

Personnalisez la navigation entre les écrans

Dans un client HTML, un seul écran est actif à tout moment.Vous pouvez spécifier la manière dont l'utilisateur ouvre un écran des autres et ce qui se produit lorsqu'un écran est inactif.

Pour plus d'informations, consultez Comment : contrôler la navigation entre les écrans HTML dans une application LightSwitch.

Modifier un écran à l'aide de code

Vous pouvez ajouter du code aux méthodes partielles qu' LightSwitch appelle afin que, lorsque certains événements se produisent au moment de l'exécution, l'écran soit modifié de manière appropriée.Par exemple, vous pouvez ajouter le code qui masque le nom d'une société qui souhaite rester anonyme pour les utilisateurs de votre application.Ce code examinerait le nom de la société des clients et, lorsqu'il trouve une correspondance, placerait la propriété d' IsVisible du champ d' CompanyName à False avant que les informations s'affichent à l'écran.

Pour plus d'informations sur l'emplacement écrire votre code, consultez Comment : gérer des événements d'écran dans un client mobile pour une application LightSwitch.

Pour plus d'informations sur l'ajout de code qui modifie un écran, consultez How to: Modify an HTML Screen by Using Code.

Rubriques connexes

Titre	Description
Choix d'un type d'écran pour un client HTML d'une application LightSwitch	Décrit les modèles que vous pouvez utiliser comme point de départ pour créer des écrans.
Comment : créer un écran de client HTML	Indique comment ajouter des écrans à votre application.
Visite du concepteur d'écran	Illustre les parties du concepteur et leurs fonctions.
Comment : concevoir un écran HTML à l'aide du concepteur d'écran	Indique comment utiliser le concepteur d'écran.
Comment : ajouter une propriété locale à un écran HTML	Montre comment ajouter un champ personnalisé de propriété locale à l'écran.
Comment : ajouter un bouton à un client mobile pour LightSwitch	Montre comment ajouter un bouton ou un lien qui exécute le code personnalisé dans un écran.
Comment : ajouter un contrôle personnalisé à un écran HTML pour une application LightSwitch	Montre comment utiliser un contrôle personnalisé HTML dans un écran d' LightSwitch .
Comment : Ajouter des données à un écran	Indique comment ajouter des données d'autres requêtes à un écran.
Comment : Filtrer les données sur un écran HTML	Indique comment utiliser des requêtes pour contrôler les données qui s'affichent dans l'écran.
Comment : gérer des événements d'écran dans un client mobile pour une application LightSwitch	Décrit comment personnaliser votre application en écrivant du code qui s'exécute lorsque certains événements se produisent.
How to: Modify an HTML Screen by Using Code	Décrit comment utiliser le code pour modifier des contrôles et interagir avec les éléments sur un écran.
Référence : propriétés du concepteur d'écran	Décrit les propriétés des éléments qui s'affichent dans la liste des membres de l'écran et l'arborescence de contenu de l'écran du concepteur d'écran.Vous pouvez modifier l'apparence et le comportement des éléments en utilisant la fenêtre Propriétés pour définir la valeur des propriétés.
Comment : contrôler la navigation entre les écrans HTML dans une application LightSwitch	Décrit le modèle de navigation d'écran pour un client HTML d'une application de LightSwitch.