This is a migrated thread and some comments may be shown as answers.

Drag Visual too close to the mouse arrow

9 Answers 64 Views
DragAndDrop
This is a migrated thread and some comments may be shown as answers.
tomas
Top achievements
Rank 1
tomas asked on 24 Apr 2013, 09:17 PM
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. 

 

9 Answers, 1 is accepted

Sort by
0
Nick
Telerik team
answered on 25 Apr 2013, 08:22 AM
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

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
tomas
Top achievements
Rank 1
answered on 25 Apr 2013, 10:08 AM
Hi Nikolay,

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

Thank you for any help.

Tom
0
Nick
Telerik team
answered on 25 Apr 2013, 01:59 PM
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

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
tomas
Top achievements
Rank 1
answered on 25 Apr 2013, 05:27 PM
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

 
0
Accepted
Nick
Telerik team
answered on 26 Apr 2013, 10:26 AM
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

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
tomas
Top achievements
Rank 1
answered on 26 Apr 2013, 11:45 AM
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
0
Nick
Telerik team
answered on 01 May 2013, 07:22 AM
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

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
tomas
Top achievements
Rank 1
answered on 01 May 2013, 12:34 PM
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
0
Nick
Telerik team
answered on 06 May 2013, 09:58 AM
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

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Tags
DragAndDrop
Asked by
tomas
Top achievements
Rank 1
Answers by
Nick
Telerik team
tomas
Top achievements
Rank 1
Share this question
or