Pratiques conseillées : conception et affichage des boîtes de dialogue
Lorsque vous concevez et affichez des boîtes de dialogue dans votre application cartographique, plusieurs facteurs sont à prendre en compte. Vous devez notamment vous demander comment afficher l'interface utilisateur, comment parvenir à une intégration homogène avec la structure existante de l'application, vous interroger sur le thème et la conception globale et vous demander si vous souhaitez que des actions soient effectuées lorsque la boîte de dialogue se ferme ou une fois qu'elle est fermée, par exemple supprimer une couche de la carte.
Affichage de l'interface utilisateur
Pour afficher l'élément d'interface utilisateur (boîte de dialogue) au sein de la visionneuse, l'API d'extensibilité offre deux méthodes : ShowWindow et HideWindow. Ces méthodes sont disponibles à partir de MapApplication.Current. La méthode MapApplication.Current.ShowWindow affiche les éléments FrameworkElement dans une boîte de dialogue flottante. Pour ce faire, il vous suffit de transmettre à la méthode l'objet que vous souhaitez afficher avec le titre de la boîte de dialogue. Outre le contenu et le titre de la boîte de dialogue, la méthode ShowWindow accepte les arguments facultatifs suivants :
- isModal : valeur booléenne qui détermine si une boîte de dialogue est modale. Par défaut, elle ne l'est pas.
- onHidingHandler : gestionnaire d'événements appelé lorsque la boîte de dialogue a commencé à se fermer
- onHideHandler : gestionnaire d'événements appelé lorsque la boîte de dialogue est complètement fermée
- windowType : valeur d'énumération qui détermine si la fenêtre doit s'afficher avec les couleurs de l'environnement de conception (c'est-à-dire Application Builder) ou de l'environnement d'exécution (c'est-à-dire la visionneuse)
- top : double acceptant les valeurs null qui détermine le décalage de la fenêtre, en pixels, par rapport au haut de l'application. Si cet argument est omis, la fenêtre est centrée à la verticale.
- left : double acceptant les valeurs null qui spécifie le décalage de la fenêtre, en pixels, par rapport au côté gauche de l'application. Si cet argument est omis, la fenêtre est centrée à l'horizontale.
La méthode ShowWindow retourne également une référence à la méthode FloatingWindow qui est affichée. Même si la signature de la méthode ShowWindow indique un objet de type retour, il s'agira d'une instance de FloatingWindow dans la visionneuse et Application Builder.
Si vous implémentez une commande, affichez l'interface utilisateur dès que le bouton est activé (lorsque la commande est exécutée). Si votre commande nécessite que l'utilisateur interagisse avec la carte, l'interface utilisateur doit l'indiquer.
Lorsque vous utilisez ShowWindow, définissez l'arrière-plan de votre interface utilisateur comme transparent. La couleur d'arrière-plan de la boîte de dialogue contenant votre interface utilisateur est fonction des couleurs thématiques de l'application, qui sont elles-mêmes configurées par les utilisateurs qui conçoivent l'application.
Pour obtenir un exemple d'affichage de l'interface utilisateur Silverlight, supposons que vous avez implémenté le Contrôle utilisateur avec la classe code-behind par défaut et le langage XAML comme suit :
<UserControl x:Class="MyExtension.SimpleDialog"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="Transparent">
<TextBlock Text="This is my Silverlight UI!" Margin="20" />
</Grid>
</UserControl>
Un outil affichant ce contrôle dans une boîte de dialogue lors de son exécution serait implémenté comme suit :
[Export(typeof(ICommand))]
[DisplayName("Show A Simple Dialog")]
[Category("My Tools")]
[Description("Tool to show a simple dialog")]
[DefaultIcon("<Insert path to icon>")]
public class ShowDialogCommand : ICommand
{
private SimpleDialog dialog = null;
public void Execute(object parameter)
{
// Instantiate a new dialog if one does not already exist.
dialog = dialog ?? new SimpleDialog();
// Display the dialog.
MapApplication.Current.ShowWindow("Simple Dialog", dialog);
}
public bool CanExecute(object parameter)
{
// Return true so that the command is always enabled.
return true;
}
public event EventHandler CanExecuteChanged;
}
Dans une visionneuse dont le thème est identique, la boîte de dialogue apparaît comme suit :
 |
Personnalisation de la mise en page
Personnalisez la mise en page pour ajouter des éléments d'interface utilisateur (des volets par exemple) à l'application, que vous ne souhaitez pas voir apparaître dans une boîte de dialogue flottante. Si l'élément d'interface utilisateur doit toujours être visible, incluez-le dans la mise en page. Pour permettre à l'utilisateur d'activer et de désactiver l'élément d'interface utilisateur, vous pouvez :
- inclure un bouton de fermeture ou un autre élément similaire dans l'interface utilisateur, qui définit la propriété Visibilité sur Réduit ;
- créer un outil (c'est-à-dire implémenter ICommand) qui trouve le contrôle à l'aide de MapApplication.Current.FindControlInLayout, puis qui définit sa propriété Visibilité sur Visible.
Remarque :Comme les mises en page n'incluront pas nécessairement votre interface utilisateur, gérez le cas où FindControlInLayout renvoie la valeur Null.
Ne parcourez pas par programmation l'arborescence visuelle pour ajouter dynamiquement les éléments à l'application. Cette approche est de nature fragile car elle nécessite que l'arborescence visuelle soit structurée d'une manière particulière. Le code qui effectue cette opération peut s'interrompre d'une mise en page à l'autre et d'une version à l'autre.
Pour plus d'informations, reportez-vous à la rubrique Création d'une mise en page personnalisée et aux exemples de la section Contrôles des exemples interactifs d'ArcGIS Viewer for Silverlight.
Pinceaux
L'assembly d'extensibilité inclut un ensemble de pinceaux utilisés dans la visionneuse et Application Builder. Utilisez les pinceaux intégrés pour colorer votre interface utilisateur. Les couleurs de votre interface utilisateur sont ainsi cohérentes avec celles de l'application, et les utilisateurs peuvent les configurer au moyen des contrôles de thématiques.
Les pinceaux suivants sont disponibles :
Pinceaux de la visionneuse
- BackgroundGradientBrush : couleur d'arrière-plan principale pour les éléments de l'interface utilisateur dans la visionneuse. Il est utilisé comme arrière-plan des boîtes de dialogue et du volet latéral.
- BackgroundStartGradientStopColorBrush : couleur de début de BackgroundGradientBrush.
- BackgroundEndGradientStopColorBrush : couleur de fin de BackgroundGradientBrush.
- BackgroundTextColorBrush : couleur de texte principale des éléments de l'interface utilisateur dans la visionneuse. Elle est destinée à être appliquée au texte superposé aux éléments avec BackgroundGradientBrush pour l'arrière-plan ou le remplissage.
- AccentColorBrush : définit une couleur qui contraste avec BackgroundGradientBrush, mais qui est différente de la couleur du texte. Cette couleur est utilisée, par exemple, dans les bordures, les barres de défilement et les boutons.
- AccentTextColorBrush : définit une couleur pour le texte au sein de la visionneuse qui est superposé sur des éléments utilisant AccentColorBrush pour l'arrière-plan ou le remplissage.
- SelectionColorBrush : destiné à être utilisé comme couleur des éléments sélectionnés. Cette couleur est utilisée, par exemple, pour mettre en surbrillance la couche sélectionnée dans Contenu de le carte.
- SelectionOutlineColorBrush : destiné à être utilisé conjointement à SelectionColorBrush pour entourer les sélections. Cette couleur est utilisée, par exemple, pour entourer la couche sélectionnée dans Contenu de la carte.
Pinceaux d'Application Builder
- DesignHostBackgroundBrush : couleur d'arrière-plan principale pour les éléments de l'interface utilisateur d'Application Builder.
- DesignHostBackgroundTextBrush : couleur de texte principale des éléments de l'interface utilisateur d'Application Builder. Elle est destinée à être appliquée au texte superposé aux éléments utilisant DesignHostBackgroundBrush pour l'arrière-plan ou le remplissage.
- DesignHostAccentBrush : couleur qui contraste avec la couleur d'arrière-plan d'Application Builder, mais qui est différente de la couleur du texte.
- DesignHostAccentTextBrush : couleur du texte d'Application Builder superposé sur des éléments utilisant DesignHostAccentBrush pour l'arrière-plan ou le remplissage.
Actions lors de la fermeture de la boîte de dialogue
Pour initier une action lorsque la fenêtre affichée par votre complément se ferme, transmettez un gestionnaire d'événement au paramètre onHidingHandler et/ou onHideHandler de la méthode MapApplication.Current.ShowWindow.
- onHidingHandler : vous permet d'exécuter une certaine logique avant la fermeture de la fenêtre et, si cela est nécessaire, annule l'opération de fermeture de la fenêtre. Vous pouvez utiliser ce paramètre, par exemple, si l'utilisateur ferme la fenêtre pendant une opération et que vous souhaitez lui demander s'il souhaite annuler l'opération.
- onHideHandler : permet d'exécuter une certaine logique après la fermeture de la fenêtre. Vous pouvez l'utiliser, par exemple, pour supprimer une couche de résultats de la carte.