Trying to drag a button

[Eric]

I'm trying to put together a simple example. I am tring to drag a button onto one of two grids inside of a larger grid.

I created a DraggableButton class and a DropTargetGrid class along the lines described in the Draft "Getting Started" document.

I'm running into a Null Reference error during initialization. The DropTargetGrid seems to initialize, but the DraggableButton chokes and I'm not sure why. It compiles, but chokes on initialization.

Here is my implementation for the DraggableButton class:

	using System;
	using System.Windows.Controls;
	using System.Windows.Shapes;
	using Telerik.Windows;
	using Telerik.Windows.Controls.DragDrop;
	namespace SimpleDragPOC
	{
	public class DraggableButton : Button
	{
	public event EventHandler<DragDropQueryEventArgs> DropQuery
	{
	add
	{
	this.AddHandler(RadDragAndDropManager.DropQueryEvent, value);
	}
	remove
	{
	this.RemoveHandler(RadDragAndDropManager.DropQueryEvent, value);
	}
	}
	public event EventHandler<DragDropEventArgs> DropInfo
	{
	add
	{
	this.AddHandler(RadDragAndDropManager.DropInfoEvent, value);
	}
	remove
	{
	this.RemoveHandler(RadDragAndDropManager.DropInfoEvent, value);
	}
	}
	public event EventHandler<DragDropQueryEventArgs> DragQuery
	{
	add
	{
	this.AddHandler(RadDragAndDropManager.DragQueryEvent, value);
	}
	remove
	{
	this.RemoveHandler(RadDragAndDropManager.DragQueryEvent, value);
	}
	}
	public event EventHandler<DragDropEventArgs> DragInfo
	{
	add
	{
	this.AddHandler(RadDragAndDropManager.DragInfoEvent, value);
	}
	remove
	{
	this.RemoveHandler(RadDragAndDropManager.DragInfoEvent, value);
	}
	}
	public DraggableButton()
	{
	this.DragQuery += new EventHandler<DragDropQueryEventArgs>(DraggableButton_DragQuery);
	this.DragInfo += new EventHandler<DragDropEventArgs>(DraggableButton_DragInfo);
	this.DropQuery += new EventHandler<DragDropQueryEventArgs>(DraggableButton_DropQuery);
	this.DropInfo += new EventHandler<DragDropEventArgs>(DraggableButton_DropInfo);
	RadDragAndDropManager.SetAllowDrag(this, true);
	}
	void DraggableButton_DropInfo(object sender, DragDropEventArgs e)
	{
	throw new NotImplementedException();
	}
	void DraggableButton_DropQuery(object sender, DragDropQueryEventArgs e)
	{
	throw new NotImplementedException();
	}
	void DraggableButton_DragInfo(object sender, DragDropEventArgs e)
	{
	// Drag has completed successfully
	if (e.Options.Status == DragStatus.DragComplete)
	{
	e.Handled = true;
	}
	}
	void DraggableButton_DragQuery(object sender, DragDropQueryEventArgs e)
	{
	// An object is about the be dragged
	if (e.Options.Status == DragStatus.DragQuery)
	{
	e.Options.DragCue = RadDragAndDropManager.GenerateVisualCue(new Rectangle() { Width = 10, Height = 10 });
	// Set result to true
	e.QueryResult = true;
	e.Options.Payload = this;
	e.Source = this;
	e.Handled = true;
	}
	// Ask if it is OK to drop the target at the particular location
	if (e.Options.Status == DragStatus.DropSourceQuery)
	{
	e.QueryResult = false;
	e.Handled = true;
	}
	}
	}
	}

Any ideas why this blows initialization?

Specifically this is the error I get:

{System.Windows.Markup.XamlParseException: System.NullReferenceException: Object reference not set to an instance of an object.
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.Initialize()
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.OnAllowDragChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
   at System.Windows.DependencyObject.RaisePropertyChangeNotifications(DependencyProperty dp, Object newValue, Object oldValue)
   at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean allowReadOnlySet, Boolean isSetByStyle, Boolean isSetByBuiltInStyle)
   at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value)
   at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value)
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.SetAllowDrag(DependencyObject obj, Boolean value)
   at SimpleDragPOC.DraggableButton..ctor() [Line: 0 Position: 0]
   --- Inner Exception ---
Object reference not set to an instance of an object.
 ---> System.NullReferenceException: Object reference not set to an instance of an object.
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.Initialize()
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.OnAllowDragChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
   at System.Windows.DependencyObject.RaisePropertyChangeNotifications(DependencyProperty dp, Object newValue, Object oldValue)
   at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value, Boolean allowReadOnlySet, Boolean isSetByStyle, Boolean isSetByBuiltInStyle)
   at System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp, Object value)
   at System.Windows.DependencyObject.SetValue(DependencyProperty dp, Object value)
   at Telerik.Windows.Controls.DragDrop.RadDragAndDropManager.SetAllowDrag(DependencyObject obj, Boolean value)
   at SimpleDragPOC.DraggableButton..ctor()
   --- End of inner exception stack trace ---
   at System.Windows.Application.LoadComponent(Object component, Uri resourceLocator)
   at SimpleDragPOC.Page.InitializeComponent()
   at SimpleDragPOC.Page..ctor()}

[Miroslav]

Hi Eric,

The exception arises from the fact that the Initialization of the DragDrop requires the root visual of the application to be present. When you set this in the constructor of the button:

RadDragAndDropManager.SetAllowDrag(this, true);  

it gets called in the constructor of the root Page, so it does not exist yet. It is best if this line is put in the OnApplyTemplate override or the Loaded event handler.

Also, Unfortunately the Button is one of the controls that captures the mouse on MouseDown. Capturing the mouse means that only the button could ever receive mouse events. These mouse events are handled by the button and not availabe to the DragDrop (or any other control). The limitation is mention in the Online Docs as well:

http://www.telerik.com/help/silverlight/raddraganddropmanager-structure.html

Also if you are looking to add drag/drop functionality to controls, it is not necessary to extend them. The attached properties can be set with Styles and the Handlers can be added to any of the roots of the items as well.

I will be happy to help you with further details or implementation / usage questions.

Best wishes,
Miroslav
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Eric]

I see. That makes sense.

Actually, I would like to see an example that did work through extending controls. All of the examples I saw worked this way. Can you direct me to an example like that.

How do I know if the control captures the mouse or not? Is there a list somewhere - that includes the "in-the-box" controls and your controls? That would be helpful.

-Eric

[Miroslav]

Hi Eric,

You can find drag-drop examples in the forums:

Drag to a panel:
http://www.telerik.com/ClientsFiles/105201_GridDragDropIdea.zip

Grid to TreeView:
http://www.telerik.com/ClientsFiles/109361_DragDropGridToTreeView.zip

Draft for help for DragDrop:
http://www.telerik.com/ClientsFiles/109360_RadDragDrop_Help_First_Draft.zip

Also, there is the CarConfigurator demo which uses DragDrop - you can find it your client.net account, more iformation is available here:

http://blogs.telerik.com/valentinstoychev/posts/08-11-22/Silverlight_Samples_source_code_available.aspx

I am sorry that currently there are fewer examples, we are currently working on them. You are welcome to suggest examples that you will like to see.

There is no list of controls that capture the mouse, this depends on the implementation. For the default controls: As far as I know all ButtonBase descendants capture the mouse, but this may not be exhaustive. I will try to create a list with the default controls that do this - thanks for the suggestion.

Best wishes,
Miroslav
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.