Personnaliser l’interface utilisateur d’une application de la liste SharePoint pour Windows Phone
Personnaliser l'interface utilisateur Windows Phone générée par le modèle d'Application de liste SharePoint Windows Phone.
Les applications de liste SharePoint à partir du modèle d'Application de liste SharePoint Windows Phone sont basent sur l'infrastructure de Silverlight pour Windows Phone. Toutes les fonctionnalités fournies par la plate-forme de Silverlight sur un téléphone Windows sont disponibles pour les développeurs pour la personnalisation de l'interface utilisateur (IU) d'une application de liste SharePoint conçue pour un Windows Phone.
Important
[!IMPORTANTE] Si vous développez une application pour Windows Phone 8, vous devez utiliser Visual Studio Express 2012 au lieu de Visual Studio 2010 Express. À l'exception de l'environnement de développement, toutes les informations de cet article s'applique à la création d'applications pour Windows Phone 8 et Windows Phone 7.> For more information, see Comment : configurer un environnement pour le développement d'applications mobiles pour SharePoint.
Créer une application de liste SharePoint pour les personnalisations de l'interface utilisateur
Pour les procédures suivantes, supposons qu’un serveur exécutant SharePoint Server dispose d’une liste de commandes de produits créée à partir du modèle liste personnalisée, similaire à l’exemple de liste Commandes de produit utilisé dans Guide pratique pour implémenter la logique métier et la validation des données dans une application Windows Phone pour SharePoint. Pour l'exemple d'application Windows Phone utilisée dans cette rubrique, la liste des commandes de produit sur laquelle repose l'application a été modifiée pour inclure des champs supplémentaires. La liste de commandes de produits modifiée utilisée pour les besoins des exemples de cette rubrique a été créée avec les colonnes et types de champs affichés dans le tableau 1.
Le tableau 1. Liste des commandes de produits modifiée
| Colonne | Type | Requis |
|---|---|---|
| Produit (c'est-à-dire, titre) | Ligne unique de texte (texte) | Oui |
| Description | Ligne unique de texte (texte) | Non |
| Catégorie de produit | Choix | Non |
| Quantité | Numérique | Oui |
| Date de la commande | Date et heure (DateTime) | Non |
| Date d'exécution | Date et heure (DateTime) | Non |
| Urgent | Booléen | Non |
| Numéro de contact | Ligne unique de texte (texte) | Non |
Suivez les procédures décrites dans Comment : créer une Windows Phone application de liste SharePoint pour utiliser le modèle d’application de liste Windows Phone SharePoint afin de générer une application de liste SharePoint comme point de départ pour les personnalisations d’interface utilisateur suivantes. Spécifiez que la liste SharePoint de cible pour l'application de liste qui dispose d'un schéma semblable à ce qui est représenté dans le tableau 1.
Remplacer les contrôles de zone de texte avec des contrôles de sélecteur de dates
Basé sur le projet, telle que générée par le modèle, des champs dans la liste désignés en tant que champs DateTime (comme, par exemple, le champ de Date de la commande dans la liste des commandes de produits exemple) sont liés par défaut aux contrôles TextBox dans le formulaire de modification (EditForm.xaml) et le nouveau formulaire (NewForm.xaml) dans l'application. La première amélioration que vous effectuerez dans l'interface utilisateur est de faciliter la saisie de valeurs de date pour les champs de ce type en remplaçant leurs contrôles associés TextBox par DatePicker des contrôles à partir de la Silverlight pour Windows Phone Toolkit. Vous pouvez installer Silverlight pour Windows Phone Toolkit depuis le Site Web CodePlex, un site d'hébergement pour les projets de logiciels open source.
Pour remplacer les contrôles de zone de texte avec des contrôles de sélecteur de dates
Dans Microsoft Visual Studio 2010, si le projet n'est pas déjà ouvert, ouvrez le projet créé dans la section précédente, basé sur le modèle d'Application de liste SharePoint Windows Phone et à l'aide d'une liste SharePoint, telles que la liste des commandes de produits représentée dans le tableau 1.
Dans le menu projet Visual Studio, cliquez sur Ajouter une référence. La boîte de dialogue Ajouter une référence s'affiche.
Sous l'onglet Parcourir, accédez à l'assembly Microsoft.Phone.Controls.Toolkit.dll installé par Silverlight pour Windows Phone Toolkit.
Notes
[!REMARQUE] Vous trouverez l'assembly Microsoft.Phone.Controls.Toolkit.dll dans % ProgramFiles% %(x86) \Microsoft SDKs\Windows Phone\v7.1\Toolkit\< MonthYear >\Bin dans une installation standard de la boîte à outils, où < MonthYear > est peut-être quelque chose comme « Oct11 », en fonction de la version du Kit de ressources installé. (Ou vous pouvez trouver les assemblys installés par le Kit de ressources sur votre système en cliquant sur le bouton Démarrer, pointez sur Tous les programmes, en développant l'élément Microsoft Silverlight pour Windows Phone Toolkit dans le menu Programmes et en cliquant sur les fichiers binaires.)
Dans L'Explorateur de solutions, sélectionnez le fichier EditForm.xaml sous le nœud de vues.
Appuyez sur Maj + F7 (ou double-cliquez sur le fichier) pour ouvrir le fichier dans le concepteur.
Dans le volet XAML du concepteur, ajoutez une déclaration d'espace de noms pour les contrôles dans l'assembly du Kit de ressources pour la balise
<phone:PhoneApplicationPage>de différenciation.<phone:PhoneApplicationPage x:Class="ContosoSPListApp.EditForm" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" shell:SystemTray.IsVisible="True" x:Name = "EditPage">Le seul changement pour le balisage par défaut généré par le modèle est l'ajout de la désignation d'espace de noms « xmlns:toolkit ». Notez également que la valeur de l'attribut Class ici est basée sur le nom de votre projet. « ContosoSPListApp » est le nom de cet exemple de projet. La valeur de cet attribut dans votre projet sera différent à partir de la valeur ici en fonction du nom de votre projet.
Dans le fichier EditForm.xaml, recherchez le contrôle StackPanel dans le balisage qui contient les contrôles associés au champ de Date de la commande (désigné comme « Order_x0020_Date » dans le schéma XML pour le champ). Par défaut, le modèle génère un contrôle TextBox et deux contrôles TextBlock pour les champs DateTime. Le balisage pour le contrôle StackPanel et les contrôles qu'il contient doit ressembler à la balise suivante.
<StackPanel Orientation="Vertical" Margin="0,5,0,5"> <TextBlock TextWrapping="Wrap" HorizontalAlignment="Left" Style="{StaticResource PhoneTextNormalStyle}">Order Date</TextBlock> <TextBox Height="Auto" Style="{StaticResource TextValidationTemplate}" FontSize="{StaticResource PhoneFontSizeNormal}" Width="470" HorizontalAlignment="Left" Name="txtOrder_x0020_Date" Text="{Binding [Order_x0020_Date], Mode=TwoWay, ValidatesOnNotifyDataErrors=True, NotifyOnValidationError=True}" TextWrapping="Wrap" /> <TextBlock FontSize="16" TextWrapping="Wrap" HorizontalAlignment="Left" Style="{StaticResource PhoneTextSubtleStyle}" Text="{Binding DateTimeFormat}" /> </StackPanel>Remplacez ce contrôle StackPanel et les contrôles qu'il contient par le balisage suivant.
<StackPanel Orientation="Vertical" Margin="0,5,0,5"> <toolkit:DatePicker Header="Order Date" Value="{Binding [Order_x0020_Date], Mode=TwoWay}"> </toolkit:DatePicker> </StackPanel>Ensuite, recherchez (également dans EditForm.xaml) du contrôle StackPanel dans le balisage qui contient les contrôles associés au champ de Date d'exécution (désigné comme « Fulfillment_x0020_Date » dans le schéma pour le champ). Le balisage pour la StackPanel et les contrôles qu'il contient doit ressembler à la balise suivante.
<StackPanel Orientation="Vertical" Margin="0,5,0,5"> <TextBlock TextWrapping="Wrap" HorizontalAlignment="Left" Style="{StaticResource PhoneTextNormalStyle}">Fulfillment Date</TextBlock> <TextBox Height="Auto" Style="{StaticResource TextValidationTemplate}" FontSize="{StaticResource PhoneFontSizeNormal}" Width="470" HorizontalAlignment="Left" Name="txtFulfillment_x0020_Date" Text="{Binding [Fulfillment_x0020_Date], Mode=TwoWay, ValidatesOnNotifyDataErrors=True, NotifyOnValidationError=True}" TextWrapping="Wrap" /> <TextBlock FontSize="16" TextWrapping="Wrap" HorizontalAlignment="Left" Style="{StaticResource PhoneTextSubtleStyle}" Text="{Binding DateTimeFormat}" /> </StackPanel>Remplacez ce contrôle StackPanel et les contrôles qu'il contient par le balisage suivant.
<StackPanel Orientation="Vertical" Margin="0,5,0,5"> <toolkit:DatePicker Header="Fulfillment Date" Value="{Binding [Fulfillment_x0020_Date], Mode=TwoWay}"></toolkit:DatePicker> </StackPanel>Enfin, vous pouvez ajouter des images d'icônes interface utilisateur de Silverlight pour Windows Phone Toolkit à votre projet. Dans L'Explorateur de solutions, sélectionnez le nœud qui représente le projet (nommé, par exemple, « ContosoSPListApp »).
Dans le menu projet Visual Studio, cliquez sur Nouveau dossier. Ajout d'un nouveau dossier sous le nœud du projet. Nommez le dossier « Toolkit.Content ».
Dans L'Explorateur de solutions, sélectionnez le dossier que vous avez créé à l'étape précédente.
Dans le menu projet, cliquez sur Ajouter un élément existant. Une fenêtre de Navigateur s'ouvre.
Accédez au dossier dans lequel les images d'icônes prise en charge, ApplicationBar.Cancel.png et ApplicationBar.Check.png, ont été installés par Silverlight pour Windows Phone Toolkit.
Notes
[!REMARQUE] Les images se trouvent dans % ProgramFiles% %(x86) \Microsoft SDKs\Windows Phone\v7.1\Toolkit\< MonthYear >\Bin\Icons dans une installation standard de la boîte à outils, où < MonthYear > est peut-être quelque chose comme « Oct11 », en fonction de la version du Kit de ressources installé.
Sélectionnez les deux images et cliquez sur Ajouter. Les fichiers image sont ajoutés au projet sous le nœud de dossier Toolkit.Content.
Important
[!IMPORTANTE] Pour les composants de Silverlight pour Windows Phone Toolkit pour être en mesure d'utiliser les images d'icônes, ils doivent être placés à l'emplacement dans votre projetée comme indiqué dans les étapes précédentes.
Dans L'Explorateur de solutions, sélectionnez les deux fichiers image sous le dossier Toolkit.Content.
Dans la Fenêtre Propriétés, définissez la propriété Action de génération pour les images à « Content » et définissez la propriété Copier dans un répertoire de sortie à « Copier si plus récent ».
Notes
[!REMARQUE] Si la Fenêtre Propriétés n'est pas visible, appuyez surCTRL+W, puis surPPour afficher la fenêtre en Visual Studio.
Si vous démarrez le projet (en appuyant surF5) pour la déployer à l'émulateur de Windows Phone, vous pouvez naviguer vers le formulaire de modification d'un élément (en cliquant sur un élément dans la page principale de l'affichage de la liste puis en cliquant sur le bouton Modifier dans la Barre de l'Application dans l'application). Les champs DateTime sous la forme sont désormais associé au contrôle DatePicker, comme illustré dans la Figure 1.
La figure 1. Formulaire de modification avec contrôle DatePicker
Le contrôle DatePicker (mise en surbrillance pour le champ de Date de la commande dans la Figure 1) ressemble beaucoup à un contrôle TextBox avec un associés TextBlock en tant qu'étiquette, sauf que lorsque vous cliquez sur le contrôle DatePicker (ou appuyez sur un appareil Windows Phone), le contrôle affiche une page distincte avec des contrôles de sélection des dates à l'aide de mouvements, comme le montre la Figure 2.
La figure 2. Page de sélection de date
En cliquant sur les bouton terminé les transferts la date sélectionnée pour le contrôle DatePicker sur le formulaire de modification. Si vous cliquez ensuite sur le bouton Enregistrer sur ce formulaire, les valeurs des champs DateTime associées aux contrôles DatePicker sont mis à jour dans la liste SharePoint sur le serveur, car les propriétés Value des contrôles étaient liées aux champs appropriés dans le fichier EditForm.xaml dans la procédure précédente. Si vous souhaitez remplacer les contrôles TextBox des contrôles de DatePicker dans le nouveau formulaire ainsi que, vous devez répéter les étapes 4 à 10 de la procédure pour le fichier NewForm.xaml dans le projet.
Ajouter des contrôles pour prendre en charge les options de remplissage personnalisés pour les champs Choice
Champs désignées avec le type de champ de choix dans une liste SharePoint peuvent être configurés sur un serveur SharePoint pour permettre aux utilisateurs de spécifier des valeurs de choix personnalisée (ou « remplissages ») pour un champ, en plus des valeurs de choix déclarés qui peut être affectée à un champ choix lorsqu'il est défini sur le serveur. Dans les projets créés à partir du modèle d'Application de liste SharePoint Windows Phone, les champs Choice ne sont pas affichés par défaut à inclure la prise en charge de l'interface utilisateur pour entrer les options « remplissages ». Dans les procédures de cette section, vous allez ajouter des contrôles d'interface utilisateur et le code à votre application pour prendre en charge la saisie de valeurs de choix personnalisée pour le champ de catégorie de produit.
Dans les procédures suivantes, vous allez :
- Ajouter une classe ( ContosoConverter) avec la logique de conversion pour traiter les données d'être enregistrées dans le champ de choix de catégorie de produit.
- Ajouter un membre de propriété ( OtherCategoryValue) à la classe EditItemViewModel qui fournit l'accès à une chaîne représentant la valeur « remplissages » pour le champ de choix. Ce membre de la propriété servira à l'origine dans une déclaration de liaison d'un contrôle ajouté TextBox sur le formulaire de modification.
- Ajoutez un contrôle RadioButton et un contrôle TextBox au formulaire de modification pour les utilisateurs soient en mesure de spécifier une valeur de choix « remplissages » pour le champ de catégorie de produit.
- Modifiez le fichier code-behind, EditForm.xaml.cs, associé au formulaire de modification pour enregistrer une fonction de la valeur convertisseur du valeur modifier champ pour les champs Choice et implémenter des gestionnaires d'événements pour les contrôles ajoutés au formulaire de modification.
Notes
Pour plus d’informations sur les convertisseurs de valeurs de champ, consultez Comment : prendre en charge et convertir des types de champs SharePoint pour Windows Phone applications.
Pour ajouter une classe pour prendre en charge de conversion de données pour les champs Choice
Dans L'Explorateur de solutions, sélectionnez le nœud qui représente le projet (nommé, par exemple, ContosoSPListApp).
Dans le menu projet Visual Studio (ou Visual Studio Express pour Windows Phone), cliquez sur Ajouter une classe. La boîte de dialogue Ajouter un nouvel élément s'ouvre avec le modèle de classe c# déjà sélectionné.
Spécifiez un nom pour le fichier de classe (comme, par exemple, ContosoConverter.cs) et cliquez sur Ajouter. Le fichier de classe est ajouté au projet et ouvert pour modification.
Remplacez le contenu du fichier par le code suivant.
using System; using System.Net; using System.Windows; using System.Collections.ObjectModel; using Microsoft.SharePoint.Phone.Application; using Microsoft.SharePoint.Client; namespace SPListAppUICustomization { public class ContosoConverter { // Edit Field Value Converter SET function for Choice fields. public static void SetConvertedChoiceEditFieldValue(string fieldName, object fieldValue, ListItem item, ConversionContext context, string customCategory) { ObservableCollection<ChoiceFieldViewModel> choices = fieldValue as ObservableCollection<ChoiceFieldViewModel>; bool isCustomValue = true; string specifiedChoice = string.Empty; if (choices != null) { foreach (ChoiceFieldViewModel choiceItem in choices) { if ((choiceItem.IsChecked == true) || (choiceItem.Name.Equals(customCategory, StringComparison.CurrentCultureIgnoreCase))) { specifiedChoice = choiceItem.Name; isCustomValue = false; break; } } if (isCustomValue == true) { specifiedChoice = customCategory; } } else { specifiedChoice = customCategory; } item[fieldName] = specifiedChoice; } } }Enregistrez le fichier.
La fonction SetConvertedChoiceEditFieldValue ici est utilisée pour l'implémentation de la modifier champ valeur convertisseur définir délégué de fonction inscrit pour les champs Choice dans l'application. La fonction effectue une itération dans la collection d'objets ChoiceFieldViewModel transmise comme argument fieldValue. les objets ChoiceFieldViewModel sont utilisés pour représenter les valeurs individuelles pour les champs Choice dans les projets basés sur le modèle d'Application de liste SharePoint Windows Phone. Chaque objet possède une propriété Name qui représente un choix donné et une propriété booléenne ( IsChecked) qui indique si une valeur de choix donné (de ces valeurs disponibles pour un champ tel qu'il a été définie) est la valeur spécifiée pour le champ. La fonction SetConvertedChoiceEditFieldValue détermine si un objet ChoiceFieldViewModel dans la collection est activé ou si la propriété Name d'un objet correspond à une valeur personnalisée spécifiée pour le champ de catégorie de produit. Si tel est le cas, la propriété Name de cet objet ChoiceFieldViewModel est utilisée pour définir la valeur du champ. Dans le cas contraire, une valeur personnalisée spécifiée (à partir de l'argument customCategory ) est définie comme la valeur du champ.
Ensuite, vous allez ajouter un membre de la propriété à la classe EditItemViewModel qui fournit l'accès à la valeur « remplissages » pour un champ choix (ou une chaîne vide si la valeur du champ choix spécifiée est un des choix disponibles pour le champ sur le serveur).
Pour ajouter un membre de la propriété à la classe de classes EditItemViewModel
Dans L'Explorateur de solutions, sous le nœud de dossier ViewModel, sélectionnez le fichier EditItemViewModel.cs.
AppuyezF7(ou double-cliquez sur le fichier) pour ouvrir le fichier pour modification.
Après les directives de using par défaut dans le fichier, ajoutez la directive suivante.
using System.Collections.ObjectModel;Ajoutez l'implémentation d'un membre de propriété (nommé OtherCategoryValue) suivante au fichier, au sein du bloc de code (délimité par ouvrante et fermante accolades) qui implémente la classe EditItemViewModel.
public string OtherCategoryValue { get { string specifiedCategory = string.Empty; // See if specified Choice field value is one of the available values // from the List ViewModel. If it is, return an empty string. ObservableCollection<ChoiceFieldViewModel> choicesCollection = this["Product_x0020_Category"] as ObservableCollection<ChoiceFieldViewModel>; if (choicesCollection != null && choicesCollection.Any(choice => choice.IsChecked)) { return specifiedCategory; } // If Choice field value is not one of the values from the List ViewModel, // get the value from the underlying list item and return value as string. specifiedCategory = SharePointListItem.FieldValuesAsText["Product_x0020_Category"]; return specifiedCategory; } }Enregistrez le fichier.
Ensuite, vous ajoutez des contrôles au formulaire de modification et configurer ces contrôles pour prendre en charge la saisie de valeurs personnalisées pour le champ de catégorie de produit.
Pour ajouter et configurer des contrôles d'interface utilisateur pour la saisie de valeurs de champ de choix personnalisée
Dans L'Explorateur de solutions, sélectionnez le fichier EditForm.xaml sous le nœud de dossier Views.
AppuyezMAJ + F7(ou double-cliquez sur le fichier) pour ouvrir le fichier dans le concepteur.
Recherchez le contrôle StackPanel qui contient les contrôles (un contrôle TextBlock et un contrôle ListBox ) pour rendre le champ de Catégorie de produit à partir de la liste SharePoint de commandes de produit. Ajouter et configurer un contrôle RadioButton et un autre contrôle TextBox vers le conteneur StackPanel, comme illustré dans le code suivant.
<StackPanel Orientation="Vertical" Margin="0,5,0,5"> <TextBlock TextWrapping="Wrap" HorizontalAlignment="Left" Style="{StaticResource PhoneTextNormalStyle}"> Product Category</TextBlock> <ListBox MaxHeight="400" Width="Auto" x:Name="lstBoxProduct_x0020_Category" ItemsSource="{Binding [Product_x0020_Category]}"> <ListBox.ItemTemplate> <DataTemplate> <RadioButton FontSize="{StaticResource PhoneFontSizeNormal}" HorizontalAlignment="Left" GroupName="Product_x0020_Category" Content="{Binding Name}" IsChecked="{Binding IsChecked, Mode=TwoWay}" /> </DataTemplate> </ListBox.ItemTemplate> </ListBox> <!-- The following two controls added to support UI Customization for Choice field. --> <RadioButton x:Name="rbOtherCategory" FontSize="{StaticResource PhoneFontSizeNormal}" HorizontalAlignment="Left" GroupName="Product_x0020_Category" Content="Other:" IsChecked ="True" /><TextBox x:Name="txtOtherCategory" Text="{Binding OtherCategoryValue}" FontSize="{StaticResource PhoneFontSizeNormal}" Width="470" HorizontalAlignment="Left" TextWrapping="Wrap" Visibility="Visible" /> </StackPanel>Le fichier EditForm.xaml est sélectionné dans L'Explorateur de solutions, puis appuyez surF7Pour ouvrir le fichier de code-behind associé, EditForm.xaml.cs, pour la modification.
Modifiez le constructeur dans le fichier pour ajouter un gestionnaire, EditForm_Loaded, pour l'événement Loaded. Le constructeur modifié doit correspondre au constructeur dans le code suivant.
public EditForm() { InitializeComponent(); viewModel = App.MainViewModel.SelectedItemEditViewModelInstance; if (!viewModel.IsInitialized) { viewModel.InitializationCompleted += new EventHandler<InitializationCompletedEventArgs>(OnViewModelInitialization); viewModel.Initialize(); } else { this.DataContext = viewModel; } // Adding handler for Loaded event. this.Loaded += new RoutedEventHandler(EditForm_Loaded); }Ajoutez l'implémentation suivante pour le Gestionnaire d'événements EditForm_Loaded dans le fichier, dans le bloc de code (délimité par ouvrante et fermante accolades) qui implémente la classe partielle EditForm.
private void EditForm_Loaded(object sender, RoutedEventArgs e) { // Register EditFieldValueConverter SET function on Choice fields. Converter.RegisterEditFieldValueConverter(FieldType.Choice, (string fieldName, object fieldValue, ListItem item, ConversionContext context) => { string otherCategoryValue = string.Empty; if (this.rbOtherCategory.IsChecked == true) { otherCategoryValue = this.txtOtherCategory.Text.Trim(); if (string.IsNullOrWhiteSpace(OtherCategoryValue)) { otherCategoryValue = "(Unspecified)"; } } ContosoConverter.SetConvertedChoiceEditFieldValue(fieldName, fieldValue, item, context, otherCategoryValue); }); // Adding RadioButton event handlers here because the // txtOtherCategory TextBox will be loaded and available at this point. this.rbOtherCategory.Checked += new RoutedEventHandler(rbOtherCategory_Checked); this.rbOtherCategory.Unchecked += new RoutedEventHandler(rbOtherCategory_Unchecked); }Dans ce code, l'instruction lambda utilisée dans l'appel à la méthode RegisterEditFieldValueConverter de la classe Converter détermine si le contrôle de RadioButton rbOtherCategory(ajouté à l'étape 3) est coché. Si tel est le cas, la valeur de la propriété Text du contrôle de TextBox txtOtherCategory est transmise à la fonction SetConvertedChoiceEditFieldValue. Si rbOtherCategory n'est pas cochée, une chaîne vide est passée. Si rbOtherCategory est activée, mais aucune valeur n'est réellement spécifiée par l'utilisateur dans la zone de texte txtOtherCategory, une valeur « (non spécifié) » est transmise.
Enfin, ajoutez des gestionnaires pour les événements Checked et Unchecked de la rbOtherCategory RadioButton pour afficher ou masquer le contrôle TextBox permet de fournir des valeurs de catégorie de produit personnalisées. Inclure les implémentations suivantes pour ces gestionnaires dans le fichier EditForm.xaml.cs, une nouvelle fois dans le bloc de code qui implémente la classe partielle EditForm.
private void rbOtherCategory_Checked(object sender, RoutedEventArgs e) { this.txtOtherCategory.Visibility = System.Windows.Visibility.Visible; this.txtOtherCategory.Focus(); } private void rbOtherCategory_Unchecked(object sender, RoutedEventArgs e) { this.txtOtherCategory.Visibility = System.Windows.Visibility.Collapsed; }Enregistrez le fichier.
Si vous générez le projet et déployez sur un émulateur de Windows Phone (en appuyant surF5), vous pouvez voir que dans le formulaire de modification, un contrôle RadioButton est ajouté pour chaque valeur choice désigné dans la définition de champ de catégorie de produit, en fonction de la valeur par défaut une logique de rendu de l'interface utilisateur pour les champs Choice. En outre, un autre contrôle RadioButton (étiquetées en tant que « autres: "dans l'interface utilisateur) est fourni pour les utilisateurs soient en mesure de spécifier des valeurs de choix personnalisée. Si le contrôle supplémentaire RadioButton est activé, un contrôle de TextBox est affiché pour la saisie de la valeur attendue.
Pour les éléments dans la liste des commandes de produits qui sont déjà associé à une valeur personnalisée de la catégorie de produit et puis modifiés dans l'application, la modification de formulaire s'affiche avec le contrôle de supplémentaires RadioButton déjà activée et le contrôle de TextBox afficher la valeur personnalisée déjà visible.