[Solved] Drag ItemTemplate only text

[Brian]

I have been attempting to incorporate the Drag and Drop example for two listBoxes.  Yet, when i drag my item it just shows the text and not the item template from the listBox.  I have included a image to show what i am talking about...

private void OnDragInfo(object sender, DragDropEventArgs e)
       {
           if (e.Options.Status == DragStatus.DragComplete)
           {
               var listBox = e.Options.Source.FindItemsConrolParent() as ItemsControl;
               var itemsSource = listBox.ItemsSource as IList;
               var operation = e.Options.Payload as DragDropOperation;
               itemsSource.Remove(operation.Payload);
           }
       }
       private void OnDropInfo(object sender, DragDropEventArgs e)
       {
           var destination = e.Options.Destination;
           if (e.Options.Status == DragStatus.DropPossible && destination is ListBoxItem)
           {
               var listBox = destination.FindItemsConrolParent() as ListBox;
               FrameworkElement rootChild = VisualTreeHelper.GetChild(listBox, 0) as FrameworkElement;
               Storyboard dropStoryboard = rootChild.FindResource("DropStoryboard") as Storyboard;
               dropStoryboard.Begin();
               //Get the DropCueElemet:
               var dropCueElement = (VisualTreeHelper.GetChild(listBox, 0) as FrameworkElement).FindName("DropCueElement") as FrameworkElement;
               var operation = e.Options.Payload as DragDropOperation;
               //Get the parent of the destination:
               var visParent = VisualTreeHelper.GetParent(destination) as UIElement;
               //Get the spacial relation between the destination and its parent:
               var destinationStackTopLeft = destination.TransformToVisual(visParent).Transform(new Point());
               var yTranslateValue = operation.DropPosition == DropPosition.Before ? destinationStackTopLeft.Y : destinationStackTopLeft.Y + destination.ActualHeight;
               dropCueElement.RenderTransform = new TranslateTransform() { Y = yTranslateValue };
               e.Handled = true;
           }
           if (e.Options.Status == DragStatus.DropPossible && destination is ListBox)
           {
               var listBox = destination as ListBox;
               FrameworkElement rootChild = VisualTreeHelper.GetChild(listBox, 0) as FrameworkElement;
               Storyboard dropStoryboard = rootChild.FindResource("DropStoryboard") as Storyboard;
               dropStoryboard.Begin();
               //Get the DropCueElemet:
               var dropCueElement = (VisualTreeHelper.GetChild(listBox, 0) as FrameworkElement).FindName("DropCueElement") as FrameworkElement;
               var operation = e.Options.Payload as DragDropOperation;
               // Get the size of the items:
               var itemsPresenter = listBox.GetTemplateChild<FrameworkElement>("ItemsPresenterElement");
               var panel = VisualTreeHelper.GetChild(itemsPresenter, 0) as Panel;
               if (panel != null)
               {
                   var yTranslateValue = panel.ActualHeight;
                   dropCueElement.RenderTransform = new TranslateTransform() { Y = yTranslateValue };
               }
           }
           //Hide the DropCue:
           if (e.Options.Status == DragStatus.DropImpossible || e.Options.Status == DragStatus.DropCancel || e.Options.Status == DragStatus.DropComplete)
           {
               var listBox = destination as ListBox;
               if (listBox == null)
               {
                   listBox = e.Options.Destination.FindItemsConrolParent() as ListBox;
               }
               FrameworkElement rootChild = VisualTreeHelper.GetChild(listBox, 0) as FrameworkElement;
               Storyboard dropStoryboard = rootChild.FindResource("DropStoryboard") as Storyboard;
               dropStoryboard.Stop();
           }
           //Place the item:
           if (e.Options.Status == DragStatus.DropComplete && destination is ListBoxItem)
           {
               var listBox = e.Options.Destination.FindItemsConrolParent() as ListBox;
               var itemsSource = listBox.ItemsSource as IList;
               var destinationIndex = itemsSource.IndexOf(e.Options.Destination.DataContext);
               var operation = e.Options.Payload as DragDropOperation;
               var insertIndex = operation.DropPosition == DropPosition.Before ? destinationIndex : destinationIndex + 1;
               itemsSource.Insert(insertIndex, operation.Payload);
               listBox.Dispatcher.BeginInvoke(new Action(() =>
               {
                   listBox.SelectedIndex = insertIndex;
               }));
           }
           //Place the item:
           if (e.Options.Status == DragStatus.DropComplete && destination is ListBox)
           {
               var listBox = e.Options.Destination as ListBox;
               var itemsSource = listBox.ItemsSource as IList;
               var operation = e.Options.Payload as DragDropOperation;
               itemsSource.Add(operation.Payload);
           }
       }
       private void OnDropQuery(object sender, DragDropQueryEventArgs e)
       {
           var destination = e.Options.Destination;
           if (e.Options.Status == DragStatus.DropDestinationQuery && destination is ListBoxItem)
           {
               var listBox = destination.FindItemsConrolParent() as ListBox;
               //Cannot place na item relative to itself:
               if (e.Options.Source == e.Options.Destination)
               {
                   return;
               }
               //Get the spatial relation between the destination item and the vis. root:
               var destinationTopLeft = destination.TransformToVisual(Window.GetWindow(destination)).Transform(new Point());
               //Should the new Item be moved before or after the destination item?:
               bool placeBefore = (e.Options.CurrentDragPoint.Y - destinationTopLeft.Y) < destination.ActualHeight / 2;
               var operation = e.Options.Payload as DragDropOperation;
               operation.DropPosition = placeBefore ? DropPosition.Before : DropPosition.After;
               e.QueryResult = true;
               e.Handled = true;
           }
           if (e.Options.Status == DragStatus.DropDestinationQuery && destination is ListBox)
           {
               var listBox = destination as ListBox;
               // Cannot drop the last or only item of the list box within the same list box:
               var operation = e.Options.Payload as DragDropOperation;
               //if (listBox.ItemsSource != null && listBox.ItemsSource.Cast<object>().Last() != operation.Payload)
               //{
               e.QueryResult = true;
               e.Handled = true;
               //}
               //else
               //{
               //    e.QueryResult = false;
               //    e.Handled = true;
               //}
           }
       }
       private void OnDragQuery(object sender, DragDropQueryEventArgs e)
       {
           if (e.Options.Status == DragStatus.DragQuery)
           {
               var sourceControl = e.Options.Source;
               e.QueryResult = true;
               e.Handled = true;
               var dragCue = RadDragAndDropManager.GenerateVisualCue(sourceControl);
               dragCue.HorizontalAlignment = HorizontalAlignment.Left;
               dragCue.Content = sourceControl.DataContext;
               e.Options.DragCue = dragCue;
               e.Options.Payload = new DragDropOperation() { Payload = sourceControl.DataContext };
           }
           if (e.Options.Status == DragStatus.DropSourceQuery)
           {
               e.QueryResult = true;
               e.Handled = true;
           }
       }

any help would be great...  im still relatively new to the WPF game...   i apologize in advance...

[Tsvyatko]

Hi Brian,

What I can suggest for the easiest way to create drag cue similar to source is to use the following style for the source listboxItems:

<Style TargetType="ListBoxItem">
    <Setter Property="telerik:RadDragAndDropManager.AutoDrag"  Value="True"/>
</Style>

This will approve drag from these listboxitems, set the payload from their DataContext and generate screenshot from them as DragCue. Thus you can simply delete the dragquery handler method.
Note that autodrag will only trigger its logic if the e.QueryResult in DragQuery is null.

Let me know if you need any further assistance.

Best wishes,
Tsvyatko
the Telerik team

[Brian]

Thanks, that got me close enough to get it working.  the ListItem still comes across as a box, but it contains the itemtemplate.   I had to eliminate the use of the Var operation which was the DragDropOperation type, but the rest of the functionality works acordingly.