Drag Drop Operations for browser based WPF Applications

by the3factory 3/16/2008 10:42:00 PM

Using the code

To use the code, simply unzip the file, start the project, compile and run the application.

There are two interesting things I had to figure out in order to make the application work in a browser: making sure that that the picture of the cursor is visible and adopts a shape that we want. Both are implemented in ListView1_MouseMove callback for ListView1.MouseMove event.

To make the cursor visible we simply do:

                   Mouse.SetCursor(Cursors.Hand);

There is a problem that remains, however: I wanted the cursor to become a rectangle and there were no rectangle shapes among Cursors enumeration. And to top it all you cannot use a bitmap image for a cursor in an XBAP partial trust application. To get around this problem I made the cursor to be a semi-transparent rectangle visible only for the duration of the drag operation:

            <Rectangle
Name="CursorRectangle"
Height="10"
Width="20"
Visibility="Hidden">
<Rectangle.Fill>
<SolidColorBrush Color="Blue"
Opacity="0.35"/>
</Rectangle.Fill>
</Rectangle>

The following code ensures that the cursor rectangle does not move outside of the ListView control boundaries:

                Point p = e.GetPosition(ListView1); // get the location of the mouse pointer
// get the boundaries of the ListView control (the cursor should not 
// be allowed to go beyond those boundaries
Rect bounds = VisualTreeHelper.GetDescendantBounds(ListView1);
// set the vertical coordinate of the cursor to 
// coincide with the current mouse vertical coordinate
// as long as we are still within the boundaries of the 
// ListView control
if ( (bounds.Top < p.Y) && (bounds.Bottom > p.Y))
{
Canvas.SetTop(CursorRectangle, p.Y);
}
// set the vertical coordinate of the cursor to 
// coincide with the current mouse horizontal coordinate
// as long as we are still within the boundaries of the 
// ListView control
if ((bounds.Left < p.X) && (bounds.Right > p.X))
{
Canvas.SetLeft(CursorRectangle, p.X);
}