JobaDiniz JobaDiniz - 4 months ago 87
C# Question

Wpf empty ListBox template + drag-and-drop

Following WPF listbox empty datatemplate answer, I vertical and horizontal aligned the TextBlock to center.

However, when the empty template is shown, I cannot drag and drop items into the ListBox, except when I mouse over the actual TextBlock. I want to be able to drag item in any place inside ListBox.


<Window x:Class="EmptyListBoxWithDragAndDrop.MainWindow"
Title="MainWindow" Height="600" Width="800" WindowStartupLocation="CenterScreen">

<ColumnDefinition Width="200"/>
<ColumnDefinition Width="*"/>

<ListBox Grid.Column="0" ItemsSource="{Binding Source}"

<ListBox Grid.Column="1" ItemsSource="{Binding Target}"
AllowDrop="True" gong:DragDrop.IsDropTarget="True" gong:DragDrop.DropHandler="{Binding}">
<Style TargetType="ListBox" BasedOn="{StaticResource {x:Type ListBox}}">
<Trigger Property="HasItems" Value="False">
<Setter Property="Template">
<TextBlock Text="Drag items from left ListBox" VerticalAlignment="Center" HorizontalAlignment="Center"/>


using GongSolutions.Wpf.DragDrop;
using System.Collections.ObjectModel;

namespace EmptyListBoxWithDragAndDrop
public class ViewModel : IDropTarget
public ViewModel()
Source = new ObservableCollection<string>();
Target = new ObservableCollection<string>();

Source.Add("Item 1");
Source.Add("Item 2");
Source.Add("Item 3");
Source.Add("Item 4");
Source.Add("Item 5");
Source.Add("Item 6");
Source.Add("Item 7");

public ObservableCollection<string> Source { get; private set; }
public ObservableCollection<string> Target { get; private set; }

public void DragOver(IDropInfo dropInfo)
if (dropInfo.Data is string)
dropInfo.Effects = System.Windows.DragDropEffects.Copy;

public void Drop(IDropInfo dropInfo)
if (dropInfo.Data is string)

I'm using gong-wpf-dragdrop lib. Anyone know how to solve this?


You should give your custom template a background to allow target drop at the whole client size.

    <Grid Background="{TemplateBinding Background}">
        <TextBlock Text="Drag items from left ListBox" VerticalAlignment="Center" HorizontalAlignment="Center"/>

Hope this helps!