Drag and Drop from a DataGrid to a ListBoxItem
I have a ListBox (with ItemTemplate defined in the XAML), and a DataGrid. I would like to perform drag and drop operations from the DataGrid to the ListBox. My problem is I don't understand how to know on which ListBoxItem the dragged row has been dropped.
Does anyone have an idea ?
Thanks in advance.
Edit: Here is the ListBox's XAML:
<toolkit:DockPanel Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" Width="200">
<toolkit:ListBoxDragDropTarget Name="dropTarget1" AllowDrop="True" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" AllowedSourceEffects="Move">
<ListBox Name="lbClusters">
<!-- Override default HorizontalContentAlignment -->
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
</Style>
</ListBox.ItemContainerStyle>
<!-- Override default presentation panel (to be able to organize) -->
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<!-- Items presentation -->
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="Black" BorderThickness="1" Margin="5">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border Background="Gray" Padding="10,5,0,5" Grid.Row="0" >
<TextBlock Text="{Binding Name}" HorizontalAlignment="Stretch" />
开发者_高级运维 </Border>
<ListBox ItemsSource="{Binding MatchingProcessors}" DisplayMemberPath="Name" Grid.Row="1" MinHeight="100" />
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</toolkit:ListBoxDragDropTarget>
</toolkit:DockPanel>
And here is the DataGrid:
<toolkit:DataGridDragDropTarget VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Stretch">
<sdk:DataGrid Name="Grid1" SelectionChanged="Grid_SelectionChanged" AutoGenerateColumns="False">
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Binding="{Binding Configuration.Nickname}" Header="NickName" />
<sdk:DataGridTextColumn Binding="{Binding SerialNumber}" Header="SN" />
<sdk:DataGridTextColumn Binding="{Binding ComputerName}" Header="IPHostname"/>
<sdk:DataGridTextColumn Binding="{Binding Configuration.GroupName}" Header="Group" />
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</toolkit:DataGridDragDropTarget>
Ok here is what I did... Maybe there is a better solution ? But this one seems to fit what I need.
I changed my ListBox.ItemTemplate
to add 2 events: MouseEnter
and MouseLeave
on the Grid:
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="Black" BorderThickness="1" Margin="5">
<Grid MouseEnter="Grid_MouseEnter" MouseLeave="Grid_MouseLeave">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border Background="Gray" Padding="10,5,0,5" Grid.Row="0" >
<TextBlock Text="{Binding Name, Mode=TwoWay}" HorizontalAlignment="Stretch" />
</Border>
<ListBox ItemsSource="{Binding MatchingProcessors, Mode=TwoWay}" DisplayMemberPath="SerialNumber" Grid.Row="1" MinHeight="100" />
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
Then in the code I implemented thos events, and keep a reference to the hovered element in the ListBox.
private ListBoxItem currentListBoxItem = null;
private void Grid_MouseEnter(object sender, MouseEventArgs e)
{
List<UIElement> list = VisualTreeHelper.FindElementsInHostCoordinates(e.GetPosition(null), LayoutRoot as UIElement) as List<UIElement>;
var tmp = list.OfType<ListBoxItem>().Where(el => el.DataContext != null && el.DataContext is MyType).FirstOrDefault();
if (tmp != null)
{
this.currentListBoxItem = tmp;
}
}
private void Grid_MouseLeave(object sender, MouseEventArgs e)
{
this.currentListBoxItem = null;
}
精彩评论