Hello,
I am using the DragDropManager in the XamGrid in your newest Silverlight controls. I have the DragSource and DropTargets working like I want with one exception.
My problem is that when I move the scroll bar in the grid, the DragStart event fires and causes the drag visual over the scroll thumb. How can I stop this from happenning?
Also, before I added the custom drag source template (from which I populate in the DragStart event), the drag visual was the entire XamGrid rather than just the selected rows...maybe these are related.
My code is below,
Thanks!
-Mark
<ig:XamGrid x:Name="_endPoints" ItemsSource="{Binding EndPoints}" AutoGenerateColumns="False"> <ig:DragDropManager.DragSource> <ig:DragSource IsDraggable="True" DragChannels="EndPoint" DragStart="DragSource_DragStart" DragEnd="DragSource_DragEnd" Drop="DragSource_Drop"> <ig:DragSource.DragTemplate> <DataTemplate x:Name="dragTemplate"> <ListBox Visibility="Visible" x:Name="dtStackPanel" ItemsSource="{Binding Path=Data}" Opacity=".5"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" Background="{StaticResource GreenGradientBrush}" Margin="-5"> <TextBlock Width="150" FontSize="11" Style="{StaticResource NormalText}" Margin="5" Text="{Binding Name}" /> <TextBlock Width="100" FontSize="11" Style="{StaticResource NormalText}" Margin="5" Text="{Binding IpAddress}"/> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </DataTemplate> </ig:DragSource.DragTemplate> </ig:DragSource> </ig:DragDropManager.DragSource> <ig:XamGrid.Columns> <ig:TextColumn Key="Name"/> <ig:TextColumn Key="Status"/> <ig:TextColumn Key="OperatingSystem"/> <ig:TextColumn Key="IpAddress"/>
</ig:XamGrid.Columns> </ig:XamGrid>
</ig:XamGrid.Columns>
Hi Mark,
In order to avoid this I suggest you to re-style the XamGrid and attach the drag source to rows panel – it is a part of XamGrid control template:
…
<igPrim:RowsPanel x:Name="RowsPanel"/>
So it goes:
<igPrim:RowsPanel x:Name="RowsPanel">
<ig:DragDropManager.DragSource>
<ig:DragSource IsDraggable="True"
DragStart="DragSource_DragStart">
</ig:DragSource>
</ig:DragDropManager.DragSource>
</igPrim:RowsPanel>
You need to set this style inline in order to be able to use the event handlers of DragSource.
Another approach is within DragStart event handler to examine the visual tree of the original drag source and cancel the operation if needed:
private void DragSource_DragStart(object sender, DragDropStartEventArgs e)
{
DependencyObject visualParent = e.OriginalDragSource;
while (visualParent != null)
ScrollBar scrollBar = visualParent as ScrollBar;
if (scrollBar != null)
e.Cancel = true;
return;
}
visualParent = VisualTreeHelper.GetParent(visualParent);
Best regards.
Plamen.
Plamen, Thanks for your reply.
Option 1 is not really viable for me, since we have many many views with a XamGrid supporting drag and drop. I cannot have that XamGrid control template repeated in so many places in order to get at the rows panel and attach my event handlers. Additionally it caused style issues with simple mouse overs selecting rows.
Option 2 sort of works, at least I can return from the routine that populates my drag template listbox for my custom visual. But when I include e.Cancel, it cancels the scroll event rendering it useless. I'm still suck with the default no drop allowed cursor when I scroll in any grid with DrabSource enabled.
It seems triggering drag start on scrolling in the grid would never be desired . Do you know of any other solution?
Thanks for your assistance, -Mark
Here you go, Thanks for your reply.
<core:HierarchicalDataTemplate x:Key="treeNodeTemplate" ItemsSource="{Binding Converter={StaticResource ItemsSourceConverter}}" core:ContainerBinding.ContainerBindings="{StaticResource SelectedItemsCollection}" > <Grid> <Grid Visibility="{Binding Converter={StaticResource folderNodeDropConverter}}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Image Source="{Binding ImageSource}" Width="16" /> <TextBlock Text="{Binding Name}" ToolTipService.ToolTip="{Binding Name}" Margin="5,0,0,0" Grid.Column="1" MinWidth="50"/> <TextBox Text="{Binding Name}" Tag="Folder" Margin="5,0,0,0" Grid.Column="1" Visibility="Collapsed" LostFocus="textbox_LostFocus" KeyUp="textbox_KeyUp" MinWidth="50"/> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="true" DropChannels="Folder,Configuration"/> </ig:DragDropManager.DropTarget> <ig:DragDropManager.DragSource> <ig:DragSource IsDraggable="True" Drop="Tree_DragDropHandler" DataObject="{Binding}" DragChannels="Folder, Configuration"> <ig:DragSource.CopyCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/rollover.png" /> </DataTemplate> </ig:DragSource.CopyCursorTemplate> <ig:DragSource.DropNotAllowedCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/critical.png" /> </DataTemplate> </ig:DragSource.DropNotAllowedCursorTemplate> <ig:DragSource.MoveCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/rollover.png" /> </DataTemplate> </ig:DragSource.MoveCursorTemplate> <ig:DragSource.DragTemplate> <DataTemplate x:Name="dragTemplate"> <Grid Background="{StaticResource GreenGradientBrush}" Visibility="Visible" Opacity=".5" Height="25" Width="200"> <TextBlock FontSize="11" Style="{StaticResource NormalText}" Margin="5" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Name}"/> </Grid> </DataTemplate> </ig:DragSource.DragTemplate> </ig:DragSource> </ig:DragDropManager.DragSource> </Grid> <Grid Visibility="{Binding Converter={StaticResource configurationNodeDropConverter}}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Image Source="{Binding ImageSource}" Width="16" /> <TextBlock Text="{Binding Name}" ToolTipService.ToolTip="{Binding Name}" Margin="5,0,0,0" Grid.Column="1"/> <TextBox Text="{Binding Name}" Tag="SecurityGroup" Margin="5,0,0,0" Grid.Column="1" Visibility="Collapsed" LostFocus="textbox_LostFocus" KeyUp="textbox_KeyUp"/> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="true" DropChannels="EndPoint,Folder,App,Dir,Certs,Script,User"/> </ig:DragDropManager.DropTarget> <ig:DragDropManager.DragSource> <ig:DragSource IsDraggable="True" Drop="Tree_DragDropHandler" DataObject="{Binding}" DragChannels="Configuration"> <ig:DragSource.CopyCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/rollover.png" /> </DataTemplate> </ig:DragSource.CopyCursorTemplate> <ig:DragSource.DropNotAllowedCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/critical.png" /> </DataTemplate> </ig:DragSource.DropNotAllowedCursorTemplate> <ig:DragSource.MoveCursorTemplate> <DataTemplate> <Image Height="30" Width="30" Source="/ctConsole;Component/Assets/Images/rollover.png" /> </DataTemplate> </ig:DragSource.MoveCursorTemplate> <ig:DragSource.DragTemplate> <DataTemplate > <Grid Background="{StaticResource GreenGradientBrush}" Visibility="Visible" Opacity=".5" Height="25" Width="200"> <TextBlock FontSize="11" Style="{StaticResource NormalText}" Margin="5" Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Name}"/> </Grid> </DataTemplate> </ig:DragSource.DragTemplate> </ig:DragSource> </ig:DragDropManager.DragSource> </Grid> <Grid Visibility="{Binding Converter={StaticResource componentPolicyNodeDropConverter}}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Image Source="{Binding ImageSource}" Width="16" /> <TextBlock Text="{Binding Name}" ToolTipService.ToolTip="{Binding Name}" Margin="5,0,0,0" Grid.Column="1"/> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="true" DropChannels="App,Dir,Certs,Script,User,EndPoint"/> </ig:DragDropManager.DropTarget> </Grid> <Grid Visibility="{Binding Converter={StaticResource endPointsNodeDropConverter}}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Image Source="{Binding ImageSource}" Width="16" /> <TextBlock Text="{Binding Name}" ToolTipService.ToolTip="{Binding Name}" Margin="5,0,0,0" Grid.Column="1"/> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="true" DropChannels="App,Dir,Certs,Script,User,EndPoint"/> </ig:DragDropManager.DropTarget> </Grid> <Grid Visibility="{Binding Converter={StaticResource pendingEndPointsNodeDropConverter}}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Image Source="{Binding ImageSource}" Width="16" /> <TextBlock Text="{Binding Name}" ToolTipService.ToolTip="{Binding Name}" Margin="5,0,0,0" Grid.Column="1"/> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="false" /> </ig:DragDropManager.DropTarget> </Grid> </Grid> </core:HierarchicalDataTemplate>
I don’t know how your converters work but I’ve made and attached simple application which follows the same pattern and I can’t see missing cursor at any point neither when navigating nor while drag-drop. Can you look at it, please? Is there anything more or something I'm missing?
Thanks.
Hi Plamen,
Thanks for your reply. I clearly see that it works fine there with the same type converter approach. I cannot figure out why my problem is happening. It does not happen with version 10.2.20102.1029 but it does on version .2066.
I'll keep looking... -Mark
It looks like this has something to do with using the toolkit:BusyIndicator in certain situations. If I don't set the IsBusy property that we use to bind to the BusyIndicator it seems to work just fine. Very odd. I'm using my original hierarchichal data template in the tree also... Wierd that it is ok when I revert back to version .1029 on the infragistics control...
Any ideas?
Is it possible to give me a small sample how do you use the BusyIndicator.