[Solved] Drag Visual too close to the mouse arrow

[tomas]

Hi Telerik,

I am using the code from your example Tree To Grid Drag.

e.DragVisualOffset = e.RelativeStartPoint

private void OnDragInitialize(object sender, DragInitializeEventArgs e)

{

    DropIndicationDetails details = new DropIndicationDetails();

    var listBoxItem = e.OriginalSource as System.Windows.Controls.ListBoxItem ?? (e.OriginalSource as FrameworkElement).ParentOfType<System.Windows.Controls.ListBoxItem>();

 

    var item = listBoxItem != null ? listBoxItem.DataContext : (sender as System.Windows.Controls.ListBox).SelectedItem;

    details.CurrentDraggedItem = item;

 

    IDragPayload dragPayload = DragDropPayloadManager.GeneratePayload(null);

 

    dragPayload.SetData("DraggedData", item);

    dragPayload.SetData("DropDetails", details);

 

    e.Data = dragPayload;

 

    e.DragVisual = new DragVisual()

    {

        Content = details,

        ContentTemplate = Application.Current.Resources["sboDragged"] as DataTemplate

    };

 

    e.DragVisualOffset = e.RelativeStartPoint;  //new Point(e.RelativeStartPoint.X+10 , e.DragVisualOffset.Y +10);

    e.AllowedEffects = DragDropEffects.All;

}



The problem is the I have no space between the arrow and the dragged visual but running your demo directly from your website there is a space between the mouse arrow and dragged border. 

why is the same code not working for me please?

My data template for the dragged data object is

<DataTemplate x:Key="sboDragged">
            <Grid >
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="auto" />
                </Grid.ColumnDefinitions>
                <TextBlock Text="Dragged ... Name:"  />
                <TextBlock Text="{Binding CurrentDraggedItem.Name}" Grid.Column="1" />
                <TextBlock Text="Id:" Grid.Row="1"  />
                <TextBlock Grid.Row="1" Text="{Binding CurrentDraggedItem.Id}" Grid.Column="1" />
                <StackPanel Orientation="Horizontal" Grid.Row="2" Grid.ColumnSpan="2">
                    <TextBlock Text="{Binding CurrentDropPosition}" FontWeight="Bold" MinWidth="45"/>
                    <TextBlock Text=", (" Foreground="Gray" />
                    <TextBlock Text="{Binding CurrentDraggedOverItem.Name}"/>
                    <TextBlock Text=")" Foreground="Gray" />
                </StackPanel>
            </Grid>
        </DataTemplate>

It seems to me, that data template has nothing to do with it.

http://www.telerik.com/help/silverlight/dragdrompmanager-howto-set-drag-visual.html

In this example, the mouse arrow is in the centre of dragged border. How can I achieve this?

Thank you very much. 

 

[Nick]

Hi Tomas,

The DragTemplates used in the examples are customized with some Margin values which gives the impression the Visual is with a bigger offset. You can do either that, or set the offset to be a little bigger so you get the same behavior.

Let me know if I can help you further with this! 

All the best,
Nikolay Vasilev
the Telerik team

[tomas]

Hi Nikolay,

Thank you, but I cannot find any drag template in these examples.

Thank you for any help.

Tom

[Nick]

Hi Tom,

You can see the templates defined in the Resources of the UserControls used.

<DataTemplate x:Key="DragTemplate">
    <telerik:RadDockPanel Margin="2" MaxWidth="200">
        <TextBlock Text="{Binding Name}" telerik:RadDockPanel.Dock="Top" Foreground="{telerik:Windows8Resource ResourceKey=MainBrush}"/>
        <TextBlock Text="{Binding UnitPrice}" Foreground="{telerik:Windows8Resource ResourceKey=MainBrush}"
                   telerik:RadDockPanel.Dock="Left" />
        <TextBlock Text="{Binding Description}" telerik:RadDockPanel.Dock="Left"
                   Margin="2 0 0 0" Foreground="telerik:Windows8Resource ResourceKey=MainBrush" TextWrapping="Wrap" />
    </telerik:RadDockPanel>
</DataTemplate>

You can find the xaml in the code section of every example.

Hope this helps!  Kind regards,
Nikolay Vasilev
the Telerik team

[tomas]

Please, can you explain to me, why this datatemplate should add the space about 10 pixels around the dragged item from your example:Tree to grid drag?

It seems to me, it is not possible. 

Thank you very much. 

BTW where are the pictures signaling the (un)possiblity of the drop?

Tom

 

[Nick]

Hello Tomas,

Well it is a combination of various margins actually that acumulate to the final amount. 

As to the Forbidden drop sign, it is automatically applied when you use one of our DragVisuals and change the drag effects.

Hope this helps!  

Regards,
Nikolay Vasilev
the Telerik team

[tomas]

Well, this is really funny reply,

Can you tell me which data templates are accumulating the final result of the 10 pixels breathing space between the dragged border and the arrow of the cursor?

Your suggested DragTemplate has nothing to do with it. You can try it yourself.

Thank you very much.

Tom

[Nick]

Hello Tom,

It appears you are right. The reported relative offset has an additional 10 pixels to its X coordinate resulting in the visual effect you see. As I mentioned before, you can use the relative strart point to set your offset however you want.

Hope this makes sense! 

Greetings,
Nikolay Vasilev
the Telerik team

[tomas]

Hello Nikolay,

Ok, so back to the basic.

I would like to know, which functionality in your example Tree to grid drag is making that 10 pixels margin around the dragged visual cue.

You can see there is no +10 in your source code:e.DragVisualOffset = e.RelativeStartPoint; 

And I would like to get the correct response from you this time.

Thank you very much.

Tom

[Nick]

Hello Tomas,

As it turns out it is a result of the positioning of the controls in the Examples application that is isolated to it only. We are still working on identifying the exact cause.
By default there are no additional pixels to the RelativeStartPoint. If you need the additional offset you can use the relative point, create a new one that has the necessary values and assign it to the DragVisualOffset. 

Hope this makes sense! 

All the best,
Nik
the Telerik team