drag ListBoxItem to Canvas

Question

I want to Drag ListBoxItem to a Canvas
ListBoxItem is Type of UserControl,
how to do this. Thank u.

Answer 1

From ListBox to a  Canvas.

Answer 2

Hi,

you might find what you are looking for in this article:

http://www.codeproject.com/KB/WPF/WpfDragAndDropSmorgasbord.aspx

Answer 3

Hi Gunag,

You can do something like follows to drag ListBoxItem to a Canvas:

============= XAML =================

<Window x:Class="WpfApplication1.Window2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication1"
    Title="Window2" Height="590" Width="521">
    <Grid>
        <ListBox Margin="14,22,14,247" Name="listBox1" ItemsSource="{Binding}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <local:UserControl1/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <Canvas Height="206" Margin="20,0,23,25" Name="canvas1"
                VerticalAlignment="Bottom" Background="Yellow"
                AllowDrop="True" />
    </Grid>
</Window>

===============  C# =============

  public partial class Window2 : Window
    {
        public Window2()
        {
            InitializeComponent();

            DataTable dt = new DataTable();
            dt.Columns.Add("c1", typeof(int));
            dt.Columns.Add("c2");

            for (int j = 0; j < 10; j++)
            {
                dt.Rows.Add(j, "row" + j.ToString());
            }

            this.listBox1.DataContext = dt;

            this.listBox1.PreviewMouseLeftButtonDown +=
                new MouseButtonEventHandler(listBox1_PreviewMouseLeftButtonDown);
            this.canvas1.Drop += new DragEventHandler(canvas1_Drop);
        }

        private int top = 0;

        void canvas1_Drop (object sender, DragEventArgs e)
        {
            // Get the ListBoxItem that dragged into
            ListBoxItem item = (ListBoxItem)e.Data.GetData(e.Data.GetFormats()[0]);

            // Remove the corresponding item from the data source
            DataRowView drv = item.Content as DataRowView;
            DataTable dt = this.listBox1.DataContext as DataTable;
            dt.Rows.Remove(drv.Row);

            // Add the ListBoxItem into the Canvas
            this.canvas1.Children.Add(item);
            Canvas.SetTop(item, top);
            top += 30;
        }


        void listBox1_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            // Get the ListBoxItem that the mouse is current clicks
            var sourceElement = (FrameworkElement)sender;
            var hitItem = sourceElement.InputHitTest(e.GetPosition(sourceElement)) as FrameworkElement;
            ListBoxItem hitListBoxItem = FindVisualParent<ListBoxItem>(hitItem);

            if (hitListBoxItem != null)
            {
                DragDrop.DoDragDrop (this.listBox1, hitListBoxItem, DragDropEffects.Move);
            }
        }

        public static T FindVisualParent<T>(DependencyObject child)
            where T : DependencyObject
        {
            DependencyObject parentObject = VisualTreeHelper.GetParent(child);

            if (parentObject == null) return null;

            T parent = parentObject as T;
            if (parent != null)
            {
                return parent;
            }
            else
            {
                return FindVisualParent<T>(parentObject);
            }
        }

    }


If  anything is unclear, please feel free to let me know.

Best Regards,
Zhi-Xin Ye

---

Please remember to mark the replies as answers if they help and unmark them if they provide no help.
Welcome to the All-In-One Code Framework!