RichTextBox loses contents on drag&drop

13 posts, 0 answers
  1. Andrew
    Andrew avatar
    23 posts
    Member since:
    Oct 2008

    Posted 09 Mar 2011 Link to this post

    Hello,

    I have a RichTextBox in a StackPanel and when I drag and drop (implemented using RadDragAnDropManager) the RichTextBox loses contents on drop. I suspect this is because of the unload(removing and adding it back to the visual tree).

    Can you please give some hints how to make the control not lose his contents?

    Thanks
  2. Andrew
    Andrew avatar
    23 posts
    Member since:
    Oct 2008

    Posted 09 Mar 2011 Link to this post

    Sorry, I answered the question myself already :)
  3. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 29 Apr 2011 Link to this post

    Hi ken.

    I was wondering if what type of file/object were you trying to drop onto the RadRichTextBox? I kind of have a problem with dragging images in a stackpanel onto the rich textbox. Is that even possible? You said you already solved your problem. I hope you can help me.
  4. Andrew
    Andrew avatar
    23 posts
    Member since:
    Oct 2008

    Posted 29 Apr 2011 Link to this post

    Hi 

    My scenario was that I was having a stack panel containing different items, one of them being a RichTextBox.
    On dropping such an item, the RichTextBox (contained in this item) was losing its content.

    What you describe it's different. 
    If you drop on RadRichTextBox an image, not sure what is the default behavior of RichTextBox, not sure even if there is one.
    How are you implementing the drop?
  5. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 30 Apr 2011 Link to this post

    I was trying to put an AllowDrop property to the work area or shall we say the rich textbox. It still won't work. :(
  6. Iva Toteva
    Admin
    Iva Toteva avatar
    1319 posts

    Posted 04 May 2011 Link to this post

    Hello Angeli,

    Please find attached a sample application illustrating how you can insert images from files on drag and drop, as well as how you can use RadDragAndDropManager to for a TreeView in the same application.
    If this is not what you were looking for, do not hesitate to contact us again.

    Regards,
    Iva
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  7. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 04 May 2011 Link to this post

    Hi Iva! Thank you so much for the example. It was exactly what I was looking for. Thanks again! :)
  8. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 04 May 2011 Link to this post

    Hi Iva! Sorry to bother you again. I tried to experiment with your code and added a list box with images in it. I wanted to drag them to the RadRichTextBox but I'm missing some parts. What must I add to radRichTextBox_Drop method to make it work?
  9. Ivailo Karamanolev
    Admin
    Ivailo Karamanolev avatar
    276 posts

    Posted 05 May 2011 Link to this post

    Hello Angeli,

    The AllowDrop property and the Drop event are used only when dragging and dropping files from the OS to the Silverlight application. In order to use drag & drop inside your application, for objects that reside in it, you have to use RadDragAndDropManager. Please refer to the demo project Iva sent you on how to use it. It is implemented by registering query methods, as in the demo:
    RadDragAndDropManager.AddDragQueryHandler(radTreeView, OnDragQuery);
    RadDragAndDropManager.AddDropQueryHandler(radRichTextBox, OnDropQuery);
    RadDragAndDropManager.AddDragInfoHandler(radTreeView, OnDragInfo);
    RadDragAndDropManager.AddDropInfoHandler(radRichTextBox, OnDropInfo);

    Kind regards,
    Ivailo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  10. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 05 May 2011 Link to this post

    Hi Ivailo. Thanks for responding.

    I already got the idea behind the lines of code you sent. My problem now is translating the dropped image coming from a listbox into the RadRichTextBox. The example Iva sent was dropping an external image onto the richtextbox. I understand that this line of code below is for dropping the TreeViewItem onto the richtext box and transforming it to string.

    Span span = new Span(((RadTreeViewItem)e.Options.Payload).Header.ToString());
    rrtb.Document.InsertInline(span);
     
    I'm now having difficulty in doing it with an image since the given example was a text.

    if (e.Options.Source is Image)
    {
        Image draggedImg = e.Options.Source as Image;
     
    /*
        Section section = new Section();
        Paragraph paragraph = new Paragraph();
        Stream stream = Application.GetResourceStream( new Uri(@"/DragAndDrop;component/images/image_1.png", UriKind.RelativeOrAbsolute ) ).Stream;
        Size size = new Size( 236, 50 );
        ImageInline image = new ImageInline( stream, size, "png" );
        paragraph.Inlines.Add( image);
        section.Children.Add( paragraph );
        rrtb.Document.Sections.Add(section);
    */
    }
    The commented part I got from http://www.telerik.com/help/silverlight/radrichtextbox-features-layout-elements-inlineimage.html which enables the user to attach an image to the document.

    I don't know how to go about with DragDropQueryEventArgs e. I hope you can help me.
  11. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 08 May 2011 Link to this post

    should I use e.Options.Payload or e.Options.Source?

    I tried putting an indicator to identify the dragged element as an image by showing a message box once the image was dragged but nothing shows unlike the treeview which displays a message that it was a treeviewitem that was dragged.

    I hope to hear from you soon.
  12. Iva Toteva
    Admin
    Iva Toteva avatar
    1319 posts

    Posted 10 May 2011 Link to this post

    Hello Angeli,

    e.Options.Source is the RadTreeViewItem that is being dragged.
    e.Opions.Payload is the value that you wish to transfer between controls.

    For example, if you have a TreeView that has headers, which can be dragged and dropped and pasted as text, as well as Images you wish to have inserted in the document, you can do that in the following way:

    private void OnDragQuery(object sender, DragDropQueryEventArgs e)
    {
        RadTreeViewItem treeViewItem = e.Options.Source as RadTreeViewItem;
        if (e.Options.Status == DragStatus.DragQuery)
        {
            e.Options.Payload = treeViewItem.Item;
            if (treeViewItem.Item is EditableHeaderedItemsControl) //You cannot have images as DragCues
            {             
                TextBlock block = new TextBlock()
                {
                    Text = treeViewItem.Header.ToString()
                };
                e.Options.DragCue = block;
            }
        }
        e.Handled = true;
        e.QueryResult = true;
    }

    And then, in the OnDropInfo method:

    private void OnDropInfo(object sender, DragDropEventArgs e)
    {
       // Add a marker to be shown while draggin if you like, as shown in the demo
       if (e.Options.Status == DragStatus.DropComplete)
        {
            RadRichTextBox rrtb = e.Options.Destination as RadRichTextBox;
            Point viewPoint = e.Options.RelativeDragPoint;
            DocumentPosition pos = rrtb.ActiveEditorPresenter.GetDocumentPositionFromViewPoint(viewPoint);
            rrtb.Document.CaretPosition.MoveToPosition(pos);
            if (e.Options.Payload is Image)
            {
                Image payload = e.Options.Payload as Image;
                rrtb.InsertInline(new ImageInline(new WriteableBitmap(payload.Source as BitmapSource)));
            }
            else
            {
                Span span = new Span(((RadTreeViewItem)e.Options.Payload).Header.ToString());
                rrtb.Document.InsertInline(span);
            }
        }
    }

    I hope that helps.

    All the best,
    Iva
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  13. Angeli
    Angeli avatar
    29 posts
    Member since:
    Apr 2011

    Posted 12 May 2011 Link to this post

    Thanks for clearing that up Iva. To think I have to add only 2 lines of code compared to the ones I wrote. Thanks!
Back to Top