Procédure pas à pas : activation de la fonction glisser-déplacer sur un contrôle utilisateur

Article
10/18/2023

Cette procédure pas à pas montre comment créer un contrôle utilisateur personnalisé qui peut participer au transfert de données glisser-déplacer dans Windows Presentation Foundation (WPF).

Dans cette procédure pas à pas, vous allez créer un WPF UserControl personnalisé qui représente une forme de cercle. Vous implémentez la fonctionnalité sur le contrôle pour activer le transfert de données par glisser-déplacer. Par exemple, si vous faites glisser un contrôle de cercle sur un autre, les données de couleur de remplissage sont copiées du cercle source vers la cible. Si vous faites glisser d’un contrôle Circle vers un TextBox, la représentation sous forme de chaîne de la couleur de remplissage est copiée dans le TextBox. Vous allez également créer une petite application qui contient deux contrôles de panneau et un TextBox pour tester la fonctionnalité glisser-déplacer. Vous écrivez du code qui permet aux panneaux de traiter les données de cercle déplacées, ce qui vous permet de déplacer ou copier des cercles de la collection d’enfants d’un panneau à l’autre.

Cette procédure pas à pas décrit les tâches suivantes :

Créer un contrôle utilisateur personnalisé.
Permettre au contrôle utilisateur d’être une source de glissement.
Permettre au contrôle utilisateur d’être une cible de déplacement.
Permettre à un panneau de recevoir des données déplacées à partir du contrôle utilisateur.

Prérequis

Cette procédure pas à pas nécessite Visual Studio.

Créer le projet d’application

Dans cette section, vous allez créer l’infrastructure d’application, qui inclut une page principale avec deux panneaux et un TextBox.

Créez un projet d’application WPF en Visual Basic ou Visual C# nommé DragDropExample. Pour plus d’informations, consultez Procédure pas à pas : ma première application de bureau WPF.
Ouvrez MainWindow.xaml.

Ajoutez le balisage suivant entre les balises d’ouverture et de fermeture Grid .

Ce balisage crée l’interface utilisateur pour l’application de test.

<Grid.ColumnDefinitions>
    <ColumnDefinition />
    <ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0"
            Background="Beige">
    <TextBox Width="Auto" Margin="2"
             Text="green"/>
</StackPanel>
<StackPanel Grid.Column="1"
            Background="Bisque">
</StackPanel>

Ajouter un nouveau contrôle utilisateur au projet

Dans cette section, vous ajoutez un nouveau contrôle utilisateur au projet.

Dans le menu Projet, sélectionnez Ajouter un contrôle utilisateur.
Dans la boîte de dialogue Ajouter un nouvel élément , remplacez le nom Circle.xamlpar , puis cliquez sur Ajouter.

Circle.XAML et son code-behind sont ajoutés au projet.
Ouvrez Circle.xaml.

Ce fichier doit contenir les éléments d’interface utilisateur du contrôle utilisateur.
Ajoutez le balisage suivant à la racine Grid pour créer un contrôle utilisateur simple qui a un cercle bleu comme interface utilisateur.
```
<Ellipse x:Name="circleUI" 
         Height="100" Width="100"
         Fill="Blue" />
```
Ouvrez Circle.xaml.cs ou Circle.xaml.vb.
En C#, ajoutez le code suivant après le constructeur sans paramètre pour créer un constructeur de copie. Dans Visual Basic, ajoutez le code suivant pour créer à la fois un constructeur sans paramètre et un constructeur de copie.

Pour que le contrôle utilisateur puisse être copié, vous ajoutez une méthode de constructeur de copie dans le fichier code-behind. Dans le contrôle utilisateur de cercle simplifié, vous copiez uniquement les valeurs de remplissage et de taille du contrôle utilisateur.
```
public Circle(Circle c)
{
    InitializeComponent();
    this.circleUI.Height = c.circleUI.Height;
    this.circleUI.Width = c.circleUI.Height;
    this.circleUI.Fill = c.circleUI.Fill;
}
```
```
Public Sub New()
    ' This call is required by the designer.
    InitializeComponent()
End Sub

Public Sub New(ByVal c As Circle)
    InitializeComponent()
    Me.circleUI.Height = c.circleUI.Height
    Me.circleUI.Width = c.circleUI.Height
    Me.circleUI.Fill = c.circleUI.Fill
End Sub
```

Ajouter le contrôle utilisateur à la fenêtre principale

Ouvrez MainWindow.xaml.
Ajoutez le code XAML suivant à la balise d’ouverture Window pour créer une référence d’espace de noms XML à l’application actuelle.
```
xmlns:local="clr-namespace:DragDropExample"
```

Dans le premier StackPanel, ajoutez le code XAML suivant pour créer deux instances du contrôle utilisateur Circle dans le premier panneau.

<local:Circle Margin="2" />
<local:Circle Margin="2" />

Le code XAML complet pour le panneau ressemble à ce qui suit.

<StackPanel Grid.Column="0"
            Background="Beige">
    <TextBox Width="Auto" Margin="2"
             Text="green"/>
    <local:Circle Margin="2" />
    <local:Circle Margin="2" />
</StackPanel>
<StackPanel Grid.Column="1"
            Background="Bisque">
</StackPanel>

Implémenter les événements de la source glisser dans le contrôle utilisateur

Dans cette section, vous allez remplacer la OnMouseMove méthode et lancer l’opération de glisser-déplacer.

Si un glisser est démarré (un bouton de la souris est enfoncé et que la souris est déplacée), vous allez empaqueter les données à transférer dans un DataObject. Dans cet exemple, le contrôle de cercle empaquette trois éléments de données : une représentation sous forme de chaîne de sa couleur de remplissage, une double représentation de sa hauteur et une copie de lui-même.

Pour lancer une opération de glisser-déplacer

Ouvrez Circle.xaml.cs ou Circle.xaml.vb.

Ajoutez le remplacement suivant OnMouseMove pour fournir la gestion des classes pour l’événement MouseMove .

protected override void OnMouseMove(MouseEventArgs e)
{
    base.OnMouseMove(e);
    if (e.LeftButton == MouseButtonState.Pressed)
    {
        // Package the data.
        DataObject data = new DataObject();
        data.SetData(DataFormats.StringFormat, circleUI.Fill.ToString());
        data.SetData("Double", circleUI.Height);
        data.SetData("Object", this);

        // Initiate the drag-and-drop operation.
        DragDrop.DoDragDrop(this, data, DragDropEffects.Copy | DragDropEffects.Move);
    }
}

Protected Overrides Sub OnMouseMove(ByVal e As System.Windows.Input.MouseEventArgs)
    MyBase.OnMouseMove(e)
    If e.LeftButton = MouseButtonState.Pressed Then
        ' Package the data.
        Dim data As New DataObject
        data.SetData(DataFormats.StringFormat, circleUI.Fill.ToString())
        data.SetData("Double", circleUI.Height)
        data.SetData("Object", Me)

        ' Inititate the drag-and-drop operation.
        DragDrop.DoDragDrop(Me, data, DragDropEffects.Copy Or DragDropEffects.Move)
    End If
End Sub

Cette OnMouseMove substitution effectue les tâches suivantes :

Vérifie si le bouton gauche de la souris est enfoncé quand la souris se déplace.
Empaquette les données circle dans un DataObject. Dans cet exemple, le contrôle de cercle empaquette trois éléments de données : une représentation sous forme de chaîne de sa couleur de remplissage, une double représentation de sa hauteur et une copie de lui-même.
Appelle la méthode statique DragDrop.DoDragDrop pour lancer l’opération de glisser-déplacer. Vous transmettez les trois paramètres suivants à la DoDragDrop méthode :
- dragSource : Référence à ce contrôle.
- dataDataObject: créé dans le code précédent.
- allowedEffects : opérations de glisser-déplacer autorisées, qui sont Copy ou Move.

Appuyez sur F5 pour générer et exécuter l’application.
Cliquez sur l’un des contrôles Circle et faites-le glisser sur les panneaux, l’autre cercle et le TextBox. Lorsque vous faites glisser sur le TextBoxcurseur, le curseur change pour indiquer un déplacement.
Lorsque vous faites glisser un cercle sur le TextBoxcercle, appuyez sur la touche Ctrl . Notez que le curseur change pour indiquer une copie.
Faites glisser et déposez un cercle sur le TextBox. La représentation sous forme de chaîne de la couleur de remplissage du cercle est ajoutée au TextBox.

Par défaut, le curseur change pendant une opération de glisser-déplacer pour indiquer l’effet du déplacement des données. Vous pouvez personnaliser les commentaires donnés à l’utilisateur en gérant l’événement GiveFeedback et en définissant un autre curseur.

Envoyer des commentaires à l’utilisateur

Ouvrez Circle.xaml.cs ou Circle.xaml.vb.

Ajoutez le remplacement suivant OnGiveFeedback pour fournir la gestion des classes pour l’événement GiveFeedback .

protected override void OnGiveFeedback(GiveFeedbackEventArgs e)
{
    base.OnGiveFeedback(e);
    // These Effects values are set in the drop target's
    // DragOver event handler.
    if (e.Effects.HasFlag(DragDropEffects.Copy))
    {
        Mouse.SetCursor(Cursors.Cross);
    }
    else if (e.Effects.HasFlag(DragDropEffects.Move))
    {
        Mouse.SetCursor(Cursors.Pen);
    }
    else
    {
        Mouse.SetCursor(Cursors.No);
    }
    e.Handled = true;
}

Protected Overrides Sub OnGiveFeedback(ByVal e As System.Windows.GiveFeedbackEventArgs)
    MyBase.OnGiveFeedback(e)
    ' These Effects values are set in the drop target's
    ' DragOver event handler.
    If e.Effects.HasFlag(DragDropEffects.Copy) Then
        Mouse.SetCursor(Cursors.Cross)
    ElseIf e.Effects.HasFlag(DragDropEffects.Move) Then
        Mouse.SetCursor(Cursors.Pen)
    Else
        Mouse.SetCursor(Cursors.No)
    End If
    e.Handled = True
End Sub

Cette OnGiveFeedback substitution effectue les tâches suivantes :

Vérifie les Effects valeurs définies dans le gestionnaire d’événements de la DragOver cible de suppression.
Définit un curseur personnalisé en fonction de la Effects valeur. Le curseur a pour objectif de fournir des commentaires visuels à l’utilisateur sur l’effet du déplacement des données.

Appuyez sur F5 pour générer et exécuter l’application.
Faites glisser l’un des contrôles Circle sur les panneaux, l’autre cercle et le TextBox. Notez que les curseurs sont désormais les curseurs personnalisés que vous avez spécifiés dans le OnGiveFeedback remplacement.
Sélectionnez le texte green dans le TextBoxfichier .
Faites glisser le texte green sur un contrôle de cercle. Notez que les curseurs par défaut sont affichés pour indiquer les effets de l’opération de glisser-déplacer. Le curseur de commentaire est toujours défini par la source de glissement.

Implémenter des événements drop target dans le contrôle utilisateur

Dans cette section, vous indiquez que le contrôle utilisateur est une cible de déplacement, vous substituez les méthodes qui permettent au contrôle utilisateur d’être une cible de déplacement et vous traitez les données qui sont déplacées sur celui-ci.

Pour permettre au contrôle utilisateur d’être une cible de déplacement

Ouvrez Circle.xaml.

Dans la balise d’ouverture UserControl , ajoutez la propriété et définissez-la AllowDrop sur true.

<UserControl x:Class="DragDropWalkthrough.Circle"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300"
             AllowDrop="True">

La OnDrop méthode est appelée lorsque la propriété est définie true sur et que les AllowDrop données de la source de glissement sont supprimées sur le contrôle utilisateur Circle. Dans cette méthode, vous traitez les données qui ont été déplacées et appliquez les données au cercle.

Pour traiter les données déplacées

Ouvrez Circle.xaml.cs ou Circle.xaml.vb.

Ajoutez le remplacement suivant OnDrop pour fournir la gestion des classes pour l’événement Drop .

protected override void OnDrop(DragEventArgs e)
{
    base.OnDrop(e);

    // 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);
            circleUI.Fill = newFill;

            // Set Effects to notify the drag source what effect
            // the drag-and-drop operation had.
            // (Copy if CTRL is pressed; otherwise, move.)
            if (e.KeyStates.HasFlag(DragDropKeyStates.ControlKey))
            {
                e.Effects = DragDropEffects.Copy;
            }
            else
            {
                e.Effects = DragDropEffects.Move;
            }
        }
    }
    e.Handled = true;
}

Protected Overrides Sub OnDrop(ByVal e As System.Windows.DragEventArgs)
    MyBase.OnDrop(e)
    ' If the DataObject contains string data, extract it.
    If e.Data.GetDataPresent(DataFormats.StringFormat) Then
        Dim dataString As String = e.Data.GetData(DataFormats.StringFormat)

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

            ' Set Effects to notify the drag source what effect
            ' the drag-and-drop operation had.
            ' (Copy if CTRL is pressed; otherwise, move.)
            If e.KeyStates.HasFlag(DragDropKeyStates.ControlKey) Then
                e.Effects = DragDropEffects.Copy
            Else
                e.Effects = DragDropEffects.Move
            End If
        End If
    End If
    e.Handled = True
End Sub

Cette OnDrop substitution effectue les tâches suivantes :

Utilise la GetDataPresent méthode pour case activée si les données déplacées contiennent un objet de chaîne.
Utilise la GetData méthode pour extraire les données de chaîne si elles sont présentes.
Utilise un BrushConverter pour essayer de convertir la chaîne en un Brush.
Si la conversion réussit, applique le pinceau au Fill Ellipse pinceau qui fournit l’interface utilisateur du contrôle Circle.
Marque l’événement Drop comme géré. Vous devez marquer l’événement de déplacement comme étant géré pour que les autres éléments qui reçoivent cet événement sachent que le contrôle utilisateur de cercle l’a géré.

Appuyez sur F5 pour générer et exécuter l’application.
Sélectionnez le texte green dans le TextBox.
Faites glisser le texte vers un contrôle de cercle et déplacez-le. Le cercle passe du bleu au vert.
Tapez le texte green dans le TextBox.
Sélectionnez le texte gre dans le TextBox.
Faites le glisser vers un contrôle de cercle et déplacez-le. Notez que le curseur change pour indiquer que le déplacement est autorisé, mais la couleur du cercle ne change pas, car gre n’est pas une couleur valide.
Faites glisser le contrôle de cercle vert et déplacez-le sur le contrôle de cercle bleu. Le cercle passe du bleu au vert. Notez que le curseur affiché dépend de la TextBox source de glissement ou du cercle.

La définition de la AllowDrop propriété sur true et le traitement des données supprimées est tout ce qui est nécessaire pour permettre à un élément d’être une cible de suppression. Toutefois, pour offrir une meilleure expérience utilisateur, vous devez également gérer les événements et DragLeave DragOver les DragEnterévénements. Dans ces événements, vous pouvez effectuer des vérifications et fournir des commentaires supplémentaires à l’utilisateur avant de déplacer les données.

Quand les données sont glissées sur le contrôle utilisateur de cercle, le contrôle doit notifier la source de glissement si elle peut ou non traiter les données en cours de glissement. Si le contrôle ne sait pas comment traiter les données, il doit refuser le déplacement. Pour ce faire, vous allez gérer l’événement DragOver et définir la Effects propriété.

Pour vérifier que le déplacement de données est autorisé

Ouvrez Circle.xaml.cs ou Circle.xaml.vb.

Ajoutez le remplacement suivant OnDragOver pour fournir la gestion des classes pour l’événement DragOver .

protected override void OnDragOver(DragEventArgs e)
{
    base.OnDragOver(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 or moving.
        BrushConverter converter = new BrushConverter();
        if (converter.IsValid(dataString))
        {
            // Set Effects to notify the drag source what effect
            // the drag-and-drop operation will have. These values are
            // used by the drag source's GiveFeedback event handler.
            // (Copy if CTRL is pressed; otherwise, move.)
            if (e.KeyStates.HasFlag(DragDropKeyStates.ControlKey))
            {
                e.Effects = DragDropEffects.Copy;
            }
            else
            {
                e.Effects = DragDropEffects.Move;
            }
        }
    }
    e.Handled = true;
}

Protected Overrides Sub OnDragOver(ByVal e As System.Windows.DragEventArgs)
    MyBase.OnDragOver(e)
    e.Effects = DragDropEffects.None

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

        ' If the string can be converted into a Brush, allow copying or moving.
        Dim converter As New BrushConverter
        If converter.IsValid(dataString) Then
            ' Set Effects to notify the drag source what effect
            ' the drag-and-drop operation will have. These values are 
            ' used by the drag source's GiveFeedback event handler.
            ' (Copy if CTRL is pressed; otherwise, move.)
            If e.KeyStates.HasFlag(DragDropKeyStates.ControlKey) Then
                e.Effects = DragDropEffects.Copy
            Else
                e.Effects = DragDropEffects.Move
            End If
        End If
    End If
    e.Handled = True
End Sub

Cette OnDragOver substitution effectue les tâches suivantes :

Affecte la valeur Effects à la propriété None.
Effectue les mêmes case activée que celles effectuées dans la OnDrop méthode pour déterminer si le contrôle utilisateur Circle peut traiter les données déplacées.
Si le contrôle utilisateur peut traiter les données, définit la Effects propriété sur Copy ou Move.

Appuyez sur F5 pour générer et exécuter l’application.
Sélectionnez le texte gre dans le TextBox.
Faites glisser le texte sur un contrôle de cercle. Notez que le curseur change à présent pour indiquer que le déplacement n’est pas autorisé, car gre n’est pas une couleur valide.

Vous pouvez améliorer l’expérience utilisateur en appliquant un aperçu de l’opération de déplacement. Pour le contrôle utilisateur Circle, vous remplacerez les méthodes et OnDragLeave les OnDragEnter méthodes. Lorsque les données sont déplacées sur le contrôle, l’arrière-plan Fill actuel est enregistré dans une variable d’espace réservé. La chaîne est ensuite convertie en pinceau et appliquée à l’interface Ellipse utilisateur du cercle. Si les données sont déplacées hors du cercle sans être supprimées, la valeur d’origine Fill est réapproguée au cercle.

Pour afficher un aperçu du résultat de l’opération de glisser-déplacer

Ouvrez Circle.xaml.cs ou Circle.xaml.vb.

Dans la classe Circle, déclarez une variable privée Brush nommée _previousFill et initialisez-la sur null.

public partial class Circle : UserControl
{
    private Brush _previousFill = null;

Public Class Circle
    Private _previousFill As Brush = Nothing

Ajoutez le remplacement suivant OnDragEnter pour fournir la gestion des classes pour l’événement DragEnter .

protected override void OnDragEnter(DragEventArgs e)
{
    base.OnDragEnter(e);
    // Save the current Fill brush so that you can revert back to this value in DragLeave.
    _previousFill = circleUI.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.ToString());
            circleUI.Fill = newFill;
        }
    }
}

Protected Overrides Sub OnDragEnter(ByVal e As System.Windows.DragEventArgs)
    MyBase.OnDragEnter(e)
    _previousFill = circleUI.Fill

    ' If the DataObject contains string data, extract it.
    If e.Data.GetDataPresent(DataFormats.StringFormat) Then
        Dim dataString As String = 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 = converter.ConvertFromString(dataString)
            circleUI.Fill = newFill
        End If
    End If
    e.Handled = True
End Sub

Cette OnDragEnter substitution effectue les tâches suivantes :

Enregistre la Fill propriété de la Ellipse_previousFill variable.
Effectue les mêmes case activée effectuées dans la OnDrop méthode pour déterminer si les données peuvent être converties en un Brush.
Si les données sont converties en une valeur valide Brush, l’applique à l’objet Fill Ellipse.

Ajoutez le remplacement suivant OnDragLeave pour fournir la gestion des classes pour l’événement DragLeave .

protected override void OnDragLeave(DragEventArgs e)
{
    base.OnDragLeave(e);
    // Undo the preview that was applied in OnDragEnter.
    circleUI.Fill = _previousFill;
}

Protected Overrides Sub OnDragLeave(ByVal e As System.Windows.DragEventArgs)
    MyBase.OnDragLeave(e)
    ' Undo the preview that was applied in OnDragEnter.
    circleUI.Fill = _previousFill
End Sub

Cette OnDragLeave substitution effectue les tâches suivantes :

Applique l’enregistrement Brush dans la _previousFill variable à l’interface Fill Ellipse utilisateur qui fournit l’interface utilisateur du contrôle utilisateur Circle.

Appuyez sur F5 pour générer et exécuter l’application.
Sélectionnez le texte green dans le TextBox.
Faites glisser le texte sur un contrôle de cercle sans le déplacer. Le cercle passe du bleu au vert.
Faites glisser le texte en dehors du contrôle de cercle. Le cercle passe du vert au bleu.

Activer un panneau pour recevoir des données supprimées

Dans cette section, vous allez activer les panneaux qui hébergent les contrôles utilisateur Circle pour agir en tant que cibles de déplacement pour les données circle déplacées. Vous allez implémenter du code qui vous permet de déplacer un cercle d’un panneau vers un autre ou d’effectuer une copie d’un contrôle Circle en maintenant la touche Ctrl enfoncée tout en faisant glisser-déplacer un cercle.

Ouvrez MainWindow.xaml.

Comme indiqué dans le code XAML suivant, dans chacun des StackPanel contrôles, ajoutez des gestionnaires pour les événements et Drop les DragOver événements. Nommez le gestionnaire d’événementsDragOver, panel_DragOverpuis nommez le gestionnaire d’événementsDrop. panel_Drop

Par défaut, les panneaux ne sont pas des cibles de suppression. Pour les activer, ajoutez la AllowDrop propriété aux deux panneaux et définissez la valeur truesur .

<StackPanel Grid.Column="0"
            Background="Beige"
            AllowDrop="True"
            DragOver="panel_DragOver"
            Drop="panel_Drop">
    <TextBox Width="Auto" Margin="2"
             Text="green"/>
    <local:Circle Margin="2" />
    <local:Circle Margin="2" />
</StackPanel>
<StackPanel Grid.Column="1"
            Background="Bisque"
            AllowDrop="True"
            DragOver="panel_DragOver"
            Drop="panel_Drop">
</StackPanel>

Ouvrez MainWindows.xaml.cs ou MainWindow.xaml.vb.

Ajoutez le code suivant pour le gestionnaire d’événements DragOver .

private void panel_DragOver(object sender, DragEventArgs e)
{
    if (e.Data.GetDataPresent("Object"))
    {
        // These Effects values are used in the drag source's
        // GiveFeedback event handler to determine which cursor to display.
        if (e.KeyStates == DragDropKeyStates.ControlKey)
        {
            e.Effects = DragDropEffects.Copy;
        }
        else
        {
            e.Effects = DragDropEffects.Move;
        }
    }
}

Private Sub panel_DragOver(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    If e.Data.GetDataPresent("Object") Then
        ' These Effects values are used in the drag source's
        ' GiveFeedback event handler to determine which cursor to display.
        If e.KeyStates = DragDropKeyStates.ControlKey Then
            e.Effects = DragDropEffects.Copy
        Else
            e.Effects = DragDropEffects.Move
        End If
    End If
End Sub

Ce DragOver gestionnaire d’événements effectue les tâches suivantes :

Vérifie que les données déplacées contiennent les données « Object » qui ont été empaquetées dans le DataObject contrôle utilisateur Circle et transmises dans l’appel à DoDragDrop.
Si les données « Object » sont présentes, case activée indique si la touche Ctrl est enfoncée.
Si la touche Ctrl est enfoncée, définit la Effects propriété sur Copy. Sinon, définissez la Effects propriété sur Move.

Ajoutez le code suivant pour le gestionnaire d’événements Drop .

private void panel_Drop(object sender, DragEventArgs e)
{
    // If an element in the panel has already handled the drop,
    // the panel should not also handle it.
    if (e.Handled == false)
    {
        Panel _panel = (Panel)sender;
        UIElement _element = (UIElement)e.Data.GetData("Object");

        if (_panel != null && _element != null)
        {
            // Get the panel that the element currently belongs to,
            // then remove it from that panel and add it the Children of
            // the panel that its been dropped on.
            Panel _parent = (Panel)VisualTreeHelper.GetParent(_element);

            if (_parent != null)
            {
                if (e.KeyStates == DragDropKeyStates.ControlKey &&
                    e.AllowedEffects.HasFlag(DragDropEffects.Copy))
                {
                    Circle _circle = new Circle((Circle)_element);
                    _panel.Children.Add(_circle);
                    // set the value to return to the DoDragDrop call
                    e.Effects = DragDropEffects.Copy;
                }
                else if (e.AllowedEffects.HasFlag(DragDropEffects.Move))
                {
                    _parent.Children.Remove(_element);
                    _panel.Children.Add(_element);
                    // set the value to return to the DoDragDrop call
                    e.Effects = DragDropEffects.Move;
                }
            }
        }
    }
}

Private Sub panel_Drop(ByVal sender As System.Object, ByVal e As System.Windows.DragEventArgs)
    ' If an element in the panel has already handled the drop,
    ' the panel should not also handle it.
    If e.Handled = False Then
        Dim _panel As Panel = sender
        Dim _element As UIElement = e.Data.GetData("Object")

        If _panel IsNot Nothing And _element IsNot Nothing Then
            ' Get the panel that the element currently belongs to,
            ' then remove it from that panel and add it the Children of
            ' the panel that its been dropped on.

            Dim _parent As Panel = VisualTreeHelper.GetParent(_element)
            If _parent IsNot Nothing Then
                If e.KeyStates = DragDropKeyStates.ControlKey And _
                    e.AllowedEffects.HasFlag(DragDropEffects.Copy) Then
                    Dim _circle As New Circle(_element)
                    _panel.Children.Add(_circle)
                    ' set the value to return to the DoDragDrop call
                    e.Effects = DragDropEffects.Copy
                ElseIf e.AllowedEffects.HasFlag(DragDropEffects.Move) Then
                    _parent.Children.Remove(_element)
                    _panel.Children.Add(_element)
                    ' set the value to return to the DoDragDrop call
                    e.Effects = DragDropEffects.Move
                End If
            End If
        End If
    End If
End Sub

Ce Drop gestionnaire d’événements effectue les tâches suivantes :

Vérifie si l’événement Drop a déjà été géré. Par exemple, si un cercle est supprimé sur un autre cercle qui gère l’événement Drop , vous ne souhaitez pas que le panneau qui contient le cercle le gère également.
Si l’événement Drop n’est pas géré, case activée indique si la touche Ctrl est enfoncée.
Si la touche Ctrl est enfoncée lorsque le Drop résultat se produit, effectue une copie du contrôle Circle et l’ajoute à la Children collection du StackPanel.
Si la touche Ctrl n’est pas enfoncée, déplace le cercle de la Children collection de son panneau parent vers la Children collection du panneau sur lequel elle a été supprimée.
Définit la Effects propriété pour notifier la DoDragDrop méthode si une opération de déplacement ou de copie a été effectuée.

Appuyez sur F5 pour générer et exécuter l’application.
Sélectionnez le texte green dans le TextBoxfichier .
Faites glisser le texte sur un contrôle de cercle et déplacez-le.
Faites glisser un contrôle de cercle du panneau gauche vers le panneau droit et déplacez-le. Le cercle est supprimé de la Children collection du volet gauche et ajouté à la collection Children du panneau droit.
Faites glisser un contrôle Cercle du panneau vers l’autre panneau et déposez-le tout en appuyant sur la touche Ctrl . Le cercle est copié et la copie est ajoutée à la Children collection du panneau de réception.

Voir aussi

Vue d'ensemble du glisser-déplacer

Partager via