Creating a mouse drag done observable with Reactive Extensions
- by juharr
I have the following
var leftMouseDown = Observable.FromEvent<MouseButtonEventArgs>(displayCanvas, "MouseLeftButtonDown");
var leftMouseUp = Observable.FromEvent<MouseButtonEventArgs>(displayCanvas, "MouseLeftButtonUp");
var mouseMove = Observable.FromEvent<MouseEventArgs>(displayCanvas, "MouseMove");
var leftMouseDragging = from down in leftMouseDown
let startPoint = down.EventArgs.GetPosition(displayCanvas)
from move in mouseMove.TakeUntil(leftMouseUp)
let endPoint = move.EventArgs.GetPosition(displayCanvas)
select new { Start = startPoint, End = endPoint };
which when I subscribe to it will give me the start point of the drag and the current end point. Now I need to do something once the drag is done. I was unsuccessful in attempting to do this completely with RX and ended up doing
leftMouseDragging.Subscribe(value=>
{
dragging = true;
//Some other code
});
leftMouseUp.Subscribe(e=>
{
if(dragging)
{
MessageBox.Show("Just finished dragging");
dragging = false;
}
});
This works fine until I do a right mouse button drag. Then when I click the left mouse button I get the message box. If I only do a left button drag I get the message box, and then clicking the left mouse button doesn't produce the box. I'd like to do this without the external state, but if nothing else I'd at least like for it to work properly.
FYI: I tried making dragging volatile and using a lock, but that didn't work.
EDIT
It turns out my problem was with a right click context menu. Once I got rid of that my above code worked. So, now my problem is how to I get to have the context menu and still have my code work. I assume the Context menu was handling the left mouse click and that somehow caused my code to not work, but I'm still puzzling it out.
