Drag from App to Desktop

12 posts, 0 answers
  1. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 24 Jul 2012 Link to this post

    I am using WPF MVVM and having some trouble dragging an image from my application to the desktop. Any time I drag outside of the application the DragStatus becomes DragStatus.Cancel.

    What am I doing wrong? I can post the relative code if this is not a simple thing.
  2. Nick
    Admin
    Nick avatar
    593 posts

    Posted 26 Jul 2012 Link to this post

    Hi Matthew,

    Would it be possible to share some more information about the exact implementation of the DragDrop scenario? 
    Also may I advice you to check our DragDropPayloadManager which enables manipulations of data objects that can be used in drag drop operations between multiple aplications. 

    Kind regards,
    Nik
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. UI for WPF is Visual Studio 2017 Ready
  4. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 26 Jul 2012 Link to this post

    I am using WPF MVVM. I want to drag an image from a Grid Layout to the desktop and save the file on the desktop, or whatever folder the user chooses. The image is in <image> format. I am getting the results I want, in that a messagebox pops up showing me the file name when I drag to the desktop (Which is intended) but it only files if I look for the drag cancel status, not drag complete. I have native mode enabled, but I get a null destination and a cancel when I drag outside of my application.
  5. Nick
    Admin
    Nick avatar
    593 posts

    Posted 27 Jul 2012 Link to this post

    Hello Matthew,

    Unfortunately there isn't a way to get the Destination. Mind that once you go out of your application, you don't know about the visual tree of anything you are dragging over. Therefore since the RadDragAndDropManager counts on the VisualTree to define its source and destination. 

    For the Cancel status. The issue could be occurring if you are dragging just an image, while in native drag it's always more appropriate to use DataObjects. However this is just a speculation and I cannot say anything with certainty before I see the event implementation of the scenario.

    Hope this helps! 

    Regards,
    Nik
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  6. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 30 Jul 2012 Link to this post

    Here are the parts of my implementation. The ultimate goal is to save the image (Preferably the source file) to the destination (desktop or Windows Explorer folder)

    View:
    <Image
                        x:Name="recordImage"
                        Width="500"
                        VerticalAlignment="Top"
                        Source="{Binding SelectedItem.imageLocation}"
                        t:RadDragAndDropManager.AllowDrag="True"
                        t:RadDragAndDropManager.AutoDrag="True">
                        <i:Interaction.Triggers>
                            <local:DragQueryRoutedEventTrigger
                                EventName="DragQuery"
                                EventOwnerType="{x:Type t:RadDragAndDropManager}">
                                <cmd:EventToCommand
                                    Command="{Binding DragQueryCommand, Mode=OneWay}"
                                    PassEventArgsToCommand="True" />
                            </local:DragQueryRoutedEventTrigger>
                            <local:DragInfoRoutedEventTrigger
                                EventName="DragInfo"
                                EventOwnerType="{x:Type t:RadDragAndDropManager}">
                                <cmd:EventToCommand
                                    Command="{Binding DragInfoCommand, Mode=OneWay}"
                                    PassEventArgsToCommand="True" />
                            </local:DragInfoRoutedEventTrigger>
                                <!--<i:EventTrigger
                                EventName="MouseDown">
                                <cmd:EventToCommand
                                    Command="{Binding ViewImageCommand}" />
                            </i:EventTrigger>-->
                        </i:Interaction.Triggers>
                    </Image>

    ViewModel:

    public ICommand DragInfoCommand { get { return new RelayCommand<Telerik.Windows.Controls.DragDrop.DragDropEventArgs>((e) => OnDragInfo(e)); } }
            public ICommand DragQueryCommand { get { return new RelayCommand<Telerik.Windows.Controls.DragDrop.DragDropQueryEventArgs>((e) => OnDragQuery(e)); } }
     
    private static void OnDragInfo(Telerik.Windows.Controls.DragDrop.DragDropEventArgs e)
            {
                if (e.Options.Status == DragStatus.DragCancel)
                {
     
                    if (e.Options.DropDataObject == null)
                    {
                        e.Options.DropDataObject = new DataObject(e.Source);
                        MessageBox.Show(e.Options.DropDataObject.ToString());
                    }
                }
                 
            }
     
            private static void OnDragQuery(Telerik.Windows.Controls.DragDrop.DragDropQueryEventArgs e)
            {
                if (e.Options.Status == DragStatus.DragQuery)
                {
                    e.Options.Payload = e.Source;
                }
                e.QueryResult = true;
            }
  7. Nick
    Admin
    Nick avatar
    593 posts

    Posted 31 Jul 2012 Link to this post

    Hi Matthew,

    The problem is in the DataObject that you give to the Paylod in the operation. The problem resides in the interapplication transfer of objects implementation. You have to use the SetDropFileList method of the DataObject.

    Here is how I was able to achieve the behavior:

    private void OnDragQuery(object sender, DragDropQueryEventArgs e)
    {
        var payload = new DataObject();
        StringCollection strColl = new StringCollection();
        strColl.Add(@"..\..\test.jpg");
        payload.SetFileDropList(strColl);
         
        e.QueryResult = true;
        e.Options.DragCue = new DragVisual()
        {
            Content = new Image() { Source = this.Image.Source, MaxHeight = 100 }
        };
        e.Options.Payload = payload;
         
        e.Options.Effects = DragDropEffects.Copy;
    }


    Hope this helps!  All the best,
    Nik
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  8. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 31 Jul 2012 Link to this post

    We are getting closer for sure. When I drag the image outside of the application it gives me the can't copy icon. Also, using the MVVM pattern (Which we are violating a little because of the UI awareness in the VM) how do I set up my RelayCommand to use the sender, eventargs signature. And is the Sender necessary if we are not accessing it?

    VM:

    public ICommand DragQueryCommand { get { return new RelayCommand<Telerik.Windows.Controls.DragDrop.DragDropQueryEventArgs>((e) => OnDragQuery(e)); } }
     
            private void OnDragQuery(DragDropQueryEventArgs e)
            {
                var payload = new DataObject();
                StringCollection strColl = new StringCollection();
                strColl.Add(SelectedItem.imageLocation);
                payload.SetFileDropList(strColl);
                e.QueryResult = true;
                e.Options.Payload = payload;
                e.Options.Effects = DragDropEffects.Copy;
            }

  9. Nick
    Admin
    Nick avatar
    593 posts

    Posted 01 Aug 2012 Link to this post

    Hello Matthew,

    Actually you don't need the sender in the ViewModel. You can access the source element from the Options in the EventArgs. 

    As to the No-Copy sign, could you specify what exactly do you mean by that?

    Looking forward to hearing from you. 

    Kind regards,
    Nik
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  10. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 01 Aug 2012 Link to this post

    When I get the dragged item off of the application the cursor turns into the circle with the line through it. Whenever I release the mouse after dragging the item, I get a cancel status whether I drop the item on the application or on the desktop.
  11. Matthew
    Matthew avatar
    6 posts
    Member since:
    Aug 2011

    Posted 01 Aug 2012 Link to this post

    In the end I need to know to save an image to the desktop by dragging it from my WPF application. The image is draggable, the cues are working, everything seems fine, the question is, what events do I need and what do they need to look like?

    This is my dragquery:

    private void OnDragQuery(DragDropQueryEventArgs e)
            {
                var payload = new DataObject();
                Image saveImage = e.Options.Source as Image;
                StringCollection strColl = new StringCollection();
                strColl.Add(saveImage.Source.ToString());
                payload.SetFileDropList(strColl);
                e.QueryResult = true;
                e.Options.Payload = payload;
                e.Options.Effects = DragDropEffects.Copy;
            }


    Where do I get the destination to save the image file and where do I put the Save Logic? This is simply saving a single image (From file) to the desktop from my application.

  12. Lancelot
    Lancelot avatar
    251 posts
    Member since:
    Jul 2012

    Posted 01 Aug 2012 Link to this post

    Hi Matthew,

    DragDropManager has events that you can subscribe to. You can find that list here. You may find the DragInfo handler useful. You can search for a DragCompleted status, if it returns true, then apply your save logic.

    Good Luck,
    Lancelot
  13. Nick
    Admin
    Nick avatar
    593 posts

    Posted 06 Aug 2012 Link to this post

    Hello Matthew,

    As Lancelot said, the proper place to listen for the event would be the DragInfo event with a status of DragComplete. 
    The thing is that this would be the approach in a scenario where the Drag and Drop operations are limited to one application. In your case however, the situation requires some extra efforts to achieve the behavior that you desire. The problem is that you have hit a limitation of the RadDragAndDropManager, and the best advice I can give you is to use the DragDropManager instead. 

    Now on how to implement the scenario with RadDragAndDropManager. If you don't need to handle the DragCancel status in the event explicitly, everything should work  fine as it is. If you have to execute some custom logic in those cases however, you will have to be aware of the current element you are dragging over, or if you are still somewhere over your application at all. You can use the DropQuery event to do that, and cache the last destination over which you have been dragging. The problem here is again related to the RadDragAndDropmanager, since it does not give the means to determine when the drag has left a certain destination. At best, if you have to handle the Cancel status, the best way to do it would be the DropInfo event with status DropCancel. 

    As to the problem with the native drop, check if the path of the image is the correct one, and if the applications permissions are sufficient to execute such operations. 

    Kind regards,
    Nik
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top
UI for WPF is Visual Studio 2017 Ready