ItemsControl Drag and Drop

J’ai un ItemsControl avec un DataTemplate qui est lié à un ObservableCollection de nombres entiers.

       

Et dans les ressources Windows:

      

J’essaie de mettre en œuvre la possibilité de glisser-déposer des éléments dans ItemsControl (pour pouvoir réorganiser les entiers). Quelqu’un at-il un exemple simple de la façon de procéder? J’ai connecté les événements PreviewMouseMove, DragEnter et Drop. Le problème est que je ne sais pas comment déterminer quel élément est déplacé et où il est déplacé. Il semble que la totalité de ItemsControl soit transmise aux événements.

Voici un exemple comment je l’ai fait.

XAML:

                  

ViewModel:

  class MyViewModel { public MyViewModel() { MyCommand = new ICommandImplementation(); } public ObservableCollection MyData { get { return new ObservableCollection(new ssortingng[]{ "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten", "eleven", "twelve", "thirteen", "fourteen", "fifteen", "sixteen", "seventeen", "eighteen", "nineteen", "twenty" }); } } public ICommand MyCommand { get; private set; } private class ICommandImplementation : ICommand { public bool CanExecute(object parameter) { return true; } public event EventHandler CanExecuteChanged; public void Execute(object parameter) { System.Windows.MessageBox.Show("Button clicked! " + (parameter ?? "").ToSsortingng()); } } } 

Événements:

  private void Drop(object sender, DragEventArgs e) { var source = e.Data.GetData("Source") as ssortingng; if (source != null) { int newIndex = listview.Items.IndexOf((sender as Button).Content); var list = listview.ItemsSource as ObservableCollection; list.RemoveAt(list.IndexOf(source)); list.Insert(newIndex, source); } } private void PreviewMouseMove(object sender, MouseEventArgs e) { if (e.LeftButton == MouseButtonState.Pressed) { Task.Factory.StartNew(new Action(() => { Thread.Sleep(500); App.Current.Dispatcher.BeginInvoke(new Action(() => { if (e.LeftButton == MouseButtonState.Pressed) { var data = new DataObject(); data.SetData("Source", (sender as Button).Content); DragDrop.DoDragDrop(sender as DependencyObject, data, DragDropEffects.Move); e.Handled = true; } }), null); }), CancellationToken.None); } } 

L’exemple ci-dessus est un peu complexe car chaque élément de la list est un Button et, sur ce Button je dois également effectuer certaines actions. Votre cas est relativement facile.

Le glisser-déposer peut être déroutant pour de nombreux développeurs. Mais voici quelques points clés pour le faire:

  1. Utilisez l’événement PreviewMouseMove pour démarrer un glisser-déplacer. Dans le gestionnaire, utilisez l’événement DragDrop.DoDragDrop pour DragDrop des événements liés à DragDrop et des Cursors . sender argument de l’ sender est l’élément qui a capturé la souris actuellement dans ce cas, le UIElement qui est déplacé.

  2. Utilisez l’ DragEnter & DragOver si vous souhaitez modifier le visuel de l’élément sur lequel la Mouse DragOver actuellement. sender argument de l’ sender est l’élément qui a glissé / qui vient de se terminer.

  3. Utilisez l’événement Drop pour gérer l’élément déposé. sender argument de l’ sender est l’élément sur lequel la chute s’est produite

  4. Utilisez l’object DataObject pour transmettre des informations entre ces événements. SetData méthode SetData de la classe est utilisée pour append des données dans ceci. Cette méthode a deux arguments qui fonctionnent comme key-value paire key-value . Une fois défini, vous pouvez obtenir ces données dans le prochain événement appelé de DragDrop en utilisant GetData méthode GetData en passant la key en argument. (ie e.Data.GetData("Source") )

Voici un post relatif.