Vue d'ensemble du glisser-déplacer

Cette rubrique fournit une vue d’ensemble de la prise en charge des glisser-déplacer dans les applications WPF (Windows Presentation Foundation). Le glisser-déplacer fait généralement référence à une méthode de transfert de données qui implique l’utilisation d’une souris (ou d’un autre appareil pointant) pour sélectionner un ou plusieurs objets, en faisant glisser ces objets sur une cible de déplacement souhaitée dans l’interface utilisateur et en les supprimant.

Prise en charge du glisser-déplacer dans WPF

Les opérations de glisser-déplacer se composent généralement de deux parties : une source de glissement d'où provient l'objet glissé et une cible de déplacement qui reçoit l'objet déplacé. La source de glissement et la cible de déplacement peuvent être des éléments d'interface utilisateur d'une même application ou d'une application différente.

Le type et le nombre d'objets qui peuvent être manipulés par glisser-déplacer sont totalement aléatoires. Par exemple, les fichiers, dossiers et sélections de contenu font partie des objets les plus couramment manipulés par les opérations de glisser-déplacer.

Les actions particulières exécutées pendant une opération de glisser-déplacer varient en fonction de l'application et sont souvent déterminées par le contexte. Par exemple, le fait de faire glisser une sélection de fichiers d’un dossier vers un autre sur le même périphérique de stockage déplace les fichiers par défaut, tandis que le fait de faire glisser des fichiers d’un partage UNC (Universal Naming Convention) vers un dossier local copie les fichiers par défaut.

Les installations de glisser-déplacer fournies par WPF sont conçues pour être hautement flexibles et personnalisables pour prendre en charge un large éventail de scénarios de glisser-déplacer. Le glisser-déplacer prend en charge la manipulation d'objets au sein d'une même application ou entre différentes applications. Le glisser-déplacer entre les applications WPF et d’autres applications Windows est également entièrement pris en charge.

Dans WPF, n’importe quel UIElement ou ContentElement peut participer au glisser-déplacer. Les événements et méthodes nécessaires aux opérations de glisser-déplacer sont définis dans la classe DragDrop. Les classes UIElement et ContentElement contiennent des alias pour les événements attachés DragDrop, si bien que les événements apparaissent dans la liste des membres de classe quand un UIElement ou un ContentElement est hérité en tant qu'élément de base. Les gestionnaires d'événements attachés à ces événements sont attachés à l'événement attaché DragDrop sous-jacent et reçoivent la même instance de données d'événement. Pour plus d'informations, consultez l'événement UIElement.Drop.

Transfert de données

Le glisser-déplacer fait partie du domaine plus général du transfert de données. Le transfert de données comprend les opérations de glisser-déplacer et de copier-coller. L'opération de glisser-déplacer est similaire aux opérations de copier-coller et de couper-coller utilisées pour transférer des données d'un objet ou d'une application à l'autre, à l'aide du presse-papiers du système. Ces deux types d'opération nécessitent :

• un objet source qui fournit les données ;

• un moyen de stockage temporaire des données transférées ;

• un objet cible qui reçoit les données.

Dans une opération de copier-coller, le presse-papiers du système est utilisé pour stocker temporairement les données transférées ; dans une opération de glisser-déplacer, DataObject est utilisé pour stocker les données. Par concept, un objet de données se compose d'une ou plusieurs paires de Object qui contient les données réelles et un identificateur de format de données correspondant.

La source de glissement initie l'opération de glisser-déplacer en appelant la méthode statique DragDrop.DoDragDrop et en lui passant les données transférées. La méthode DoDragDrop inclut automatiquement les données d'un DataObject dans un wrapper, si nécessaire. Pour mieux contrôler le format de données, vous pouvez inclure les données d'un DataObject dans un wrapper avant de les passer à la méthode DoDragDrop. La cible de déplacement est chargée d'extraire les données du DataObject. Pour plus d’informations sur l’utilisation des objets de données, consultez Données et objets de données.

La source et la cible d'une opération de glisser-déplacer sont des éléments d'interface utilisateur ; cependant, les données réellement transférées ne sont généralement pas représentées visuellement. Vous pouvez écrire du code pour fournir une représentation visuelle des données déplacées, à l'instar de ce qui se produit quand vous faites glisser des fichiers dans l'Explorateur Windows. Par défaut, l'utilisateur est tenu au courant de l'effet de son action par la modification du curseur, par la représentation de l'effet que l'opération de glisser-déplacer aura sur les données si ces dernières sont déplacées ou copiées.

Effets de glisser-déplacer

Les opérations de glisser-déplacer peuvent avoir différents effets sur les données transférées. Par exemple, vous pouvez copier les données ou bien les déplacer. WPF définit une DragDropEffects énumération que vous pouvez utiliser pour spécifier l’effet d’une opération de glisser-déplacer. Dans la source de glissement, vous pouvez spécifier les effets que la source autorisera dans la méthode DoDragDrop. Dans la cible de déplacement, vous pouvez spécifier l'effet attendu de la cible dans la propriété Effects de la classe DragEventArgs. Quand la cible de déplacement spécifie son effet prévu dans l'événement DragOver, ces informations sont passées à la source de glissement dans l'événement GiveFeedback. La source du glissement utilise ces informations pour informer l'utilisateur de l'effet prévu de la cible du déplacement sur les données. Quand les données sont déplacées, la cible de déplacement spécifie son effet réel dans l'événement Drop. Ces informations sont passées à la source de glissement en tant que valeur de retour de la méthode DoDragDrop. Si la cible du déplacement retourne un effet qui n'est pas dans la liste des sources de glissement de allowedEffects, l'opération de glisser-déplacer est annulée sans que le transfert de données soit effectué.

Il est important de se rappeler que dans WPF, les DragDropEffects valeurs sont utilisées uniquement pour fournir une communication entre la source de glisser-déplacer et la cible de déplacement concernant les effets de l’opération de glisser-déplacer. L'effet réel de l'opération de glisser-déplacer dépend de la façon dont vous aurez écrit le code de votre application.

Par exemple, la cible du déplacement peut spécifier que le déplacement de données vers celle-ci a pour effet de déplacer les données. Cependant, pour être déplacées, les données doivent être à la fois ajoutées à l'élément cible et supprimées de l'élément source. L'élément source peut indiquer qu'il permet le déplacement des données, mais si vous ne fournissez pas de code pour supprimer les données de l'élément source, cette action se traduit par la copie des données et non par leur déplacement.

Événements de glisser-déplacer

Les opérations de glisser-déplacer prennent en charge un modèle piloté par les événements. La source du glissement et la cible du déplacement utilisent toutes deux un ensemble standard d'événements pour gérer les opérations de glisser-déplacer. Les tableaux suivants récapitulent les événements de glisser-déplacer standard. Il s'agit d'événements attachés de la classe DragDrop. Pour plus d’informations sur les événements attachés, consultez Vue d’ensemble des événements attachés.

Événements de la source du glissement

Événements de la cible du déplacement

Pour gérer les événements de glisser-déplacer des instances d'un objet, ajoutez des gestionnaires pour les événements répertoriés dans les tableaux précédents. Pour gérer les événements glisser-déplacer au niveau de la classe, remplacez les méthodes On*Event et On*PreviewEvent correspondantes. Pour plus d’informations, consultez Gestion de classe des événements routés par les classes de base de contrôle.

Implémentation du glisser-déplacer

Un élément d'interface utilisateur peut être une source du glissement, une cible du déplacement ou les deux à la fois. Pour implémenter le glisser-déplacer de base, écrivez du code pour initier l'opération de glisser-déplacer et traiter les données déplacées. Vous pouvez améliorer le glisser-déplacer en gérant les événements de glisser-déplacer facultatifs.

Pour implémenter le glisser-déplacer de base, effectuez les tâches suivantes :

• Identifiez l'élément destiné à être la source du glissement. Une source de glissement peut être un UIElement ou un ContentElement.

• Créez un gestionnaire d’événements pour la source du glissement, qui sera chargé de lancer l’opération de glisser-déplacer. L'événement est généralement un événement MouseMove.

• Dans le gestionnaire d'événements de la source de glissement, appelez la méthode DoDragDrop pour initier l'opération de glisser-déplacer. Dans l'appel DoDragDrop, spécifiez la source de glissement, les données à transférer et les effets autorisés.

• Identifiez l'élément destiné à être la cible du glissement. Une cible de déplacement peut être un UIElement ou un ContentElement.

• Sur la cible de déplacement, attribuez la valeur AllowDrop à la propriété true.

• Dans la cible de déplacement, créez un gestionnaire d'événements Drop pour traiter les données déplacées.

• Dans le gestionnaire d'événements Drop, extrayez les données de DragEventArgs à l'aide des méthodes GetDataPresent et GetData.

• Dans le gestionnaire d'événements Drop, utilisez les données pour effectuer l'opération de glisser-déplacer souhaitée.

Vous pouvez améliorer votre implémentation du glisser-déplacer en créant un DataObject personnalisé et en gérant des événements facultatifs de source de glissement et de cible de déplacement, comme le montrent les tâches suivantes :

• Pour transférer des données personnalisées ou plusieurs éléments de données, créez un DataObject à passer à la méthode DoDragDrop.

• Pour effectuer des actions supplémentaires pendant une opération de glissement, gérez les événements DragEnter, DragOver et DragLeave sur la cible de déplacement.

• Pour modifier l'apparence du pointeur de la souris, gérez l'événement GiveFeedback sur la source de glissement.

• Pour modifier la façon dont l'opération de glisser-déplacer est annulée, gérez l'événement QueryContinueDrag sur la source de glissement.

Exemple de glisser-déplacer

Cette section explique comment implémenter le glisser-déplacer pour un élément Ellipse. Ellipse est à la fois une source de glissement et une cible de déplacement. Les données transférées sont la représentation sous forme de chaîne de la propriété Fill de l'ellipse. Le code XAML suivant illustre l'élément Ellipse et les événements de glisser-déplacer associés qu'il gère. Pour obtenir les procédures complètes d’implémentation du glisser-déplacer, consultez Procédure pas à pas : activation de la fonction glisser-déplacer sur un contrôle utilisateur.

<Ellipse Height="50" Width="50" Fill="Green"
     MouseMove="ellipse_MouseMove"
     GiveFeedback="ellipse_GiveFeedback"
     AllowDrop="True"
     DragEnter="ellipse_DragEnter" DragLeave="ellipse_DragLeave"
     DragOver="ellipse_DragOver" Drop="ellipse_Drop" />

Autoriser un élément à être une source de glissement

Un objet qui devient source de glissement est chargé des opérations suivantes :

• Identification du moment où se produit le glissement.

• Lancement de l’opération de glisser-déplacer.

• Identification des données à transférer.

• Spécification des effets que l’opération de glisser-déplacer est autorisée à avoir sur les données transférées.

La source de glissement peut aussi fournir une rétroaction visuelle au sujet des actions autorisées (déplacement, copie, aucune) et peut annuler l'opération de glisser-déplacer en fonction d'autres entrées utilisateur, comme par exemple, appuyer sur la touche Échap durant l'opération de glissement.

Il revient à votre application de déterminer à quel moment une opération de glissement se produit et d'initier l'opération de glisser-déplacer en appelant la méthode DoDragDrop. Il s'agit en général d'un événement MouseMove qui se produit sur l'élément à faire glisser pendant que l'utilisateur appuie sur un bouton de la souris. L’exemple suivant montre comment initier une opération de glisser-déposer à partir du gestionnaire d’événements MouseMove d’un élément Ellipse pour faire de ce dernier la source de glissement. Les données transférées sont la représentation sous forme de chaîne de la propriété Fill de l'ellipse.

private void ellipse_MouseMove(object sender, MouseEventArgs e)
{
    Ellipse ellipse = sender as Ellipse;
    if (ellipse != null && e.LeftButton == MouseButtonState.Pressed)
    {
        DragDrop.DoDragDrop( ellipse,
                             ellipse.Fill.ToString(),
                             DragDropEffects.Copy);
    }
}

Private Sub Ellipse_MouseMove(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseEventArgs)
    Dim ellipse = TryCast(sender, Ellipse)
    If ellipse IsNot Nothing AndAlso e.LeftButton = MouseButtonState.Pressed Then
        DragDrop.DoDragDrop(ellipse, ellipse.Fill.ToString(), DragDropEffects.Copy)
    End If
End Sub

Dans le gestionnaire d'événements MouseMove, appelez la méthode DoDragDrop pour initier l'opération de glisser-déplacer. La méthode DoDragDrop accepte trois paramètres :

• dragSource : référence à l'objet de dépendance correspondant à la source des données transférées ; il s'agit généralement de la source de l'événement MouseMove.

• data : objet qui contient les données transférées, inclus dans un wrapper dans un DataObject.

• allowedEffects : une des valeurs d'énumération DragDropEffects qui spécifie les effets autorisés de l'opération de glisser-déplacer.

N'importe quel objet sérialisable peut être passé dans le paramètre data. Si les données ne sont pas déjà incluses dans un wrapper dans un DataObject, elles sont automatiquement incluses dans un wrapper dans un nouveau DataObject. Pour passer plusieurs éléments de données, vous devez créer vous-même le DataObject et le passer à la méthode DoDragDrop. Pour plus d’informations, consultez Données et objets de données.

Le paramètre allowedEffects est utilisé pour spécifier ce que la source du glissement autorise la cible du glissement à faire des données transférées. Les valeurs courantes pour une source de glissement sont Copy, Move et All.

Une source de glissement peut éventuellement gérer les événements GiveFeedback et QueryContinueDrag. Ces événements possèdent des gestionnaires par défaut qui sont utilisés, à moins que vous marquiez les événements comme gérés. En général, vous pouvez ignorer ces événements, sauf si vous avez besoin de modifier leur comportement par défaut.

L'événement GiveFeedback est déclenché en continu pendant l'opération de glissement de la source. Le gestionnaire par défaut de cet événement vérifie que la source du glissement se trouve sur une cible de dépôt valide. Si c'est le cas, il vérifie les effets autorisés de la cible du déplacement. Il fournit ensuite une rétroaction visuelle au sujet des effets de déplacement autorisés. Cette rétroaction visuelle se traduit généralement par le changement du curseur de la souris en curseur ne permettant ni copie, ni déplacement. Cet événement doit uniquement être géré si vous avez besoin d'utiliser des curseurs personnalisés pour fournir une rétroaction visuelle. Si vous gérez cet événement, assurez-vous de le marquer comme étant géré de sorte que le gestionnaire par défaut ne substitue pas à votre gestionnaire.

L'événement QueryContinueDrag est déclenché en continu pendant l'opération de glissement de la source. Vous pouvez gérer cet événement pour déterminer l’action qui doit terminer l’opération de glisser-déplacer, en fonction de l’état des touches Échap, Maj, Ctrl et Alt, ainsi que de l’état des boutons de la souris. Le gestionnaire par défaut de cet événement annule l'opération de glisser-déplacer si la touche Échap est enfoncée et déplace les données si le bouton de la souris est relâché.

Autoriser un élément à être une cible de déplacement

Un objet qui devient cible de déplacement est chargé des opérations suivantes :

• Confirmation qu’il s’agit d’une cible de déplacement valide.

• Réponse à la source du glissement quand elle effectue le glissement vers la cible.

• Vérification que les données transférées sont dans un format qu’elle peut recevoir.

• Traitement des données déplacées.

Pour spécifier un élément en tant que cible de déplacement, attribuez la valeur AllowDrop à la propriété true. Les événements de cible de déplacement seront ensuite déclenchés sur cet élément pour que vous puissiez les gérer. Pendant une opération de glisser-déplacer, la séquence d'événements suivante se produit sur la cible du déplacement :

1. DragEnter

2. DragOver

3. DragLeave ou Drop

L'événement DragEnter se produit quand les données sont glissées dans les limites de la cible de déplacement. En général, la gestion de cet événement vous permet d’obtenir un aperçu des effets de l’opération de glisser-déplacer, si cela est adapté à votre application. Ne définissez pas la propriété DragEventArgs.Effects dans l'événement DragEnter, car elle sera remplacée dans l'événement DragOver.

L'exemple suivant illustre le gestionnaire d'événements DragEnter pour un élément Ellipse. Ce code permet d'obtenir un aperçu des effets de l'opération de glisser-déplacer en enregistrant le pinceau Fill actif. Il utilise ensuite la méthode GetDataPresent pour vérifier que le DataObject déplacé sur l'ellipse contient bien les données de chaîne qui peuvent être converties en Brush. Si tel est le cas, les données sont extraites à l'aide de la méthode GetData. Elles sont ensuite converties en Brush avant d'être appliquées à l'ellipse. La modification peut être annulée dans le gestionnaire d'événements DragLeave. Si les données ne peuvent pas être converties en Brush, aucune action n'est effectuée.

private Brush _previousFill = null;
private void ellipse_DragEnter(object sender, DragEventArgs e)
{
    Ellipse ellipse = sender as Ellipse;
    if (ellipse != null)
    {
        // Save the current Fill brush so that you can revert back to this value in DragLeave.
        _previousFill = ellipse.Fill;

        // If the DataObject contains string data, extract it.
        if (e.Data.GetDataPresent(DataFormats.StringFormat))
        {
            string dataString = (string)e.Data.GetData(DataFormats.StringFormat);

            // If the string can be converted into a Brush, convert it.
            BrushConverter converter = new BrushConverter();
            if (converter.IsValid(dataString))
            {
                Brush newFill = (Brush)converter.ConvertFromString(dataString);
                ellipse.Fill = newFill;
            }
        }
    }
}

Private _previousFill As Brush = Nothing
Private Sub Ellipse_DragEnter(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    Dim ellipse = TryCast(sender, Ellipse)
    If ellipse IsNot Nothing Then
        ' Save the current Fill brush so that you can revert back to this value in DragLeave.
        _previousFill = ellipse.Fill

        ' If the DataObject contains string data, extract it.
        If e.Data.GetDataPresent(DataFormats.StringFormat) Then
            Dim dataString = e.Data.GetData(DataFormats.StringFormat)

            ' If the string can be converted into a Brush, convert it.
            Dim converter As New BrushConverter()
            If converter.IsValid(dataString) Then
                Dim newFill As Brush = CType(converter.ConvertFromString(dataString), Brush)
                ellipse.Fill = newFill
            End If
        End If
    End If
End Sub

L'événement DragOver se produit en continu pendant le déplacement des données sur la cible de déplacement. Cet événement est couplé à l'événement GiveFeedback sur la source de glissement. Dans le gestionnaire d'événements DragOver, les méthodes GetDataPresent et GetData sont généralement utilisées pour vérifier que les données transférées sont dans un format que la cible de déplacement peut traiter. Vous pouvez aussi vérifier si des touches de modification sont enfoncées, ce qui indique en général que l'utilisateur a l'intention d'opérer une copie ou un déplacement. Une fois ces vérifications effectuées, définissez la propriété DragEventArgs.Effects pour notifier la source de glissement de l’effet prévu du dépôt des données. La source de glissement reçoit ces informations dans les arguments de l'événement GiveFeedback et peut définir un curseur approprié de façon à fournir une rétroaction visuelle.

L'exemple suivant illustre le gestionnaire d'événements DragOver pour un élément Ellipse. Ce code vérifie que le DataObject déplacé sur l'ellipse contient bien des données de chaîne qui peuvent être converties en Brush. Si tel est le cas, il attribue à la propriété DragEventArgs.Effects la valeur Copy. Cela indique à la source du glissement que les données peuvent être copiées vers l'ellipse. Si les données ne peuvent pas être converties en Brush, la propriété DragEventArgs.Effects prend la valeur None. Cela indique à la source du glissement que l’ellipse n’est pas une cible de dépôt valide pour les données.

private void ellipse_DragOver(object sender, DragEventArgs e)
{
    e.Effects = DragDropEffects.None;

    // If the DataObject contains string data, extract it.
    if (e.Data.GetDataPresent(DataFormats.StringFormat))
    {
        string dataString = (string)e.Data.GetData(DataFormats.StringFormat);

        // If the string can be converted into a Brush, allow copying.
        BrushConverter converter = new BrushConverter();
        if (converter.IsValid(dataString))
        {
            e.Effects = DragDropEffects.Copy | DragDropEffects.Move;
        }
    }
}

Private Sub Ellipse_DragOver(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    e.Effects = DragDropEffects.None

    ' If the DataObject contains string data, extract it.
    If e.Data.GetDataPresent(DataFormats.StringFormat) Then
        Dim dataString = e.Data.GetData(DataFormats.StringFormat)

        ' If the string can be converted into a Brush, convert it.
        Dim converter As New BrushConverter()
        If converter.IsValid(dataString) Then
            e.Effects = DragDropEffects.Copy Or DragDropEffects.Move
        End If
    End If
End Sub

L'événement DragLeave se produit quand les données sont glissées hors des limites de la cible sans être déplacées. Cet événement permet d'annuler toutes vos actions dans le gestionnaire d'événements DragEnter.

L'exemple suivant illustre le gestionnaire d'événements DragLeave pour un élément Ellipse. Ce code annule l'aperçu fourni par le gestionnaire d'événements DragEnter en appliquant le Brush enregistré à l'ellipse.

private void ellipse_DragLeave(object sender, DragEventArgs e)
{
    Ellipse ellipse = sender as Ellipse;
    if (ellipse != null)
    {
        ellipse.Fill = _previousFill;
    }
}

Private Sub Ellipse_DragLeave(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    Dim ellipse = TryCast(sender, Ellipse)
    If ellipse IsNot Nothing Then
        ellipse.Fill = _previousFill
    End If
End Sub

L'événement Drop se produit quand les données sont déplacées sur la cible de déplacement ; par défaut, cela se produit quand le bouton de la souris est relâché. Dans le gestionnaire d'événements Drop, utilisez la méthode GetData pour extraire les données transférées à partir du DataObject et exécuter tout traitement de données requis par votre application. L'événement Drop met fin à l'opération de glisser-déplacer.

L'exemple suivant illustre le gestionnaire d'événements Drop pour un élément Ellipse. Ce code applique les effets de l'opération de glisser-déplacer et est similaire à celui du gestionnaire d'événements DragEnter. Il vérifie que le DataObject déplacé sur l'ellipse contient bien des données de chaîne qui peuvent être converties en Brush. Dans ce cas, le Brush est appliqué à l'ellipse. Si les données ne peuvent pas être converties en Brush, aucune action n'est effectuée.

private void ellipse_Drop(object sender, DragEventArgs e)
{
    Ellipse ellipse = sender as Ellipse;
    if (ellipse != null)
    {
        // If the DataObject contains string data, extract it.
        if (e.Data.GetDataPresent(DataFormats.StringFormat))
        {
            string dataString = (string)e.Data.GetData(DataFormats.StringFormat);

            // If the string can be converted into a Brush,
            // convert it and apply it to the ellipse.
            BrushConverter converter = new BrushConverter();
            if (converter.IsValid(dataString))
            {
                Brush newFill = (Brush)converter.ConvertFromString(dataString);
                ellipse.Fill = newFill;
            }
        }
    }
}

Private Sub Ellipse_Drop(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    Dim ellipse = TryCast(sender, Ellipse)
    If ellipse IsNot Nothing Then

        ' If the DataObject contains string data, extract it.
        If e.Data.GetDataPresent(DataFormats.StringFormat) Then
            Dim dataString = e.Data.GetData(DataFormats.StringFormat)

            ' If the string can be converted into a Brush, convert it.
            Dim converter As New BrushConverter()
            If converter.IsValid(dataString) Then
                Dim newFill As Brush = CType(converter.ConvertFromString(dataString), Brush)
                ellipse.Fill = newFill
            End If
        End If
    End If
End Sub

Voir aussi

• Clipboard
• Procédure pas à pas : activation de la fonction glisser-déplacer sur un contrôle utilisateur
• Guides pratiques
• Glisser-déposer