防止事件冒泡:WPF& RX

时间:2010-11-26 23:57:02

标签: wpf events system.reactive event-bubbling

我有一个小的WPF应用程序在画布中绘制一些点然后跟踪鼠标移动鼠标在任何点内部发生在画布上的鼠标上。我的问题是如何防止点内的mouseDowns冒泡到画布。我希望画布mouseDown观察者只在mouseDowns发生 outside 点时才会触发,并且当mouseDown观察者只在mouseDowns发生在点内时触发。

这是我构建可观察链的技术,显示如果DownInAndTrackWrtObservable的第三个参数为真,我在触发mouseDown事件中设置EventArgs.Handled属性:

private IObservable<BasedVector> DownInAndTrackWrtObservable(
    UIElement hitTestElement, 
    UIElement trackWrtElement,
    bool handleItP = false)
{
    var hitObs = hitTestElement.GetLeftMouseDownObservable();

    var trackObs = from mDown in hitObs
                   let mDownP = mDown.EventArgs.GetPosition(hitTestElement)
                   from mMove in trackWrtElement.GetMouseMoveObservable().
                       TakeUntil(trackWrtElement.GetLeftMouseUpObservable())
                   select new {D = mDown, P = mDownP, M = mMove};

    if (handleItP)
        trackObs.Subscribe(e =>
            e.D.EventArgs.Handled = true);

    return from obs in trackObs 
           select new BasedVector
           (
               tail: obs.P,
               head: obs.M.EventArgs.GetPosition(trackWrtElement)
           );
}

然后,我在两个地方设置处理程序,一个跟踪点击和点,并在画布中拖动

DownInAndTrackWrtObservable(ellipse, canvas1, handleItP:true).Subscribe(bv =>
{
    PointMouseDownTextBox.Text =
        String.Format("Point {2} MouseDown({0:G}, {1:G})", bv.Tail.X, bv.Tail.Y, ellipse.Uid);
    CanvasMouseMoveTextBox.Text =
        String.Format("Canvas MouseMove({0:G}, {1:G})", bv.Head.X, bv.Head.Y);
});

DownInAndTrackWrtObservable(canvas1, canvas1).Subscribe(bv =>
{
    CanvasMouseDownTextBox.Text =
        String.Format("Canvas MouseDown({0:G}, {1:G})", bv.Tail.X, bv.Tail.Y);
    CanvasMouseMoveTextBox.Text =
        String.Format("Canvas MouseMove({0:G}, {1:G})", bv.Head.X, bv.Head.Y);
});

麻烦的是,当点中发生mouseDown时,仍会检测到Canvas mouseDown,如第二个处理程序所示。但我不希望因为设置Event.Handled属性而发生这种情况。顺便说一句,如果我在hitObs上设置Event.Handled而不是在trackObs上设置,则点内部的点击都不会被检测到。 这是完整的应用程序及其XAML(请“添加引用”到System.coreex,System.Reactive和System.Interactive)

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Shapes;

namespace WpfTest
{
    public static partial class UIElementExtensions
    {
        public static IObservable<IEvent<MouseButtonEventArgs>>
            GetLeftMouseDownObservable(this UIElement uiElement)
        {
            return Observable.FromEvent<MouseButtonEventHandler, MouseButtonEventArgs>(
               h => new MouseButtonEventHandler(h),
               h => uiElement.MouseLeftButtonDown += h,
               h => uiElement.MouseLeftButtonDown -= h);
        }

        public static IObservable<IEvent<MouseButtonEventArgs>>
            GetLeftMouseUpObservable(this UIElement uiElement)
        {
            return Observable.FromEvent<MouseButtonEventHandler, MouseButtonEventArgs>(
               h => new MouseButtonEventHandler(h),
               h => uiElement.MouseLeftButtonUp += h,
               h => uiElement.MouseLeftButtonUp -= h);
        }

        public static IObservable<IEvent<MouseEventArgs>>
            GetMouseMoveObservable(this UIElement uiElement)
        {
            return Observable.FromEvent<MouseEventHandler, MouseEventArgs>(
               h => new MouseEventHandler(h),
               h => uiElement.MouseMove += h,
               h => uiElement.MouseMove -= h);
        }
    }

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            Draw();
        }

        private static double scaleCanvasPerWorld = 150D;
        private static Point offsetInCanvas = new Point(15D, 15D);
        private static Point worldOrigin = new Point();
        private static Point WorldToCanvas(Point worldPoint)
        {
            // Difference of two points gives a System.Drawing.Vector, which has operator overloads.
            var result = ((worldPoint - worldOrigin) * scaleCanvasPerWorld + offsetInCanvas);
            return result;
        }
        private static Point CanvasToWorld(Point canvasPoint)
        {
            var result = ((canvasPoint - offsetInCanvas) / scaleCanvasPerWorld);
            return (Point)result;
        }

        private void DrawPoint(Point worldPoint)
        {
            var ellipse = new Ellipse();
            ellipse.Stroke = System.Windows.Media.Brushes.Black;
            ellipse.Fill = System.Windows.Media.Brushes.Black;
            ellipse.HorizontalAlignment = HorizontalAlignment.Center;
            ellipse.VerticalAlignment = VerticalAlignment.Center;
            ellipse.Width = 12;
            ellipse.Height = 12;

            var canvasPoint = WorldToCanvas(worldPoint);
            ellipse.SetValue(Canvas.LeftProperty, canvasPoint.X);
            ellipse.SetValue(Canvas.TopProperty, canvasPoint.Y);

            DownInAndTrackWrtObservable(ellipse, canvas1, handleItP: true).Subscribe(bv =>
            {
                PointMouseDownTextBox.Text =
                    String.Format("Point {2} MouseDown({0:G}, {1:G})", bv.Tail.X, bv.Tail.Y, ellipse.Uid);
                CanvasMouseMoveTextBox.Text =
                    String.Format("Canvas MouseMove({0:G}, {1:G})", bv.Head.X, bv.Head.Y);
            });

            canvas1.Children.Add(ellipse);
        }

        private class BasedVector
        {
            public Point Tail { get; set; }
            public Point Head { get; set; }
            public Vector Vector { get; set; }
            public BasedVector(Point tail, Point head)
            {
                Debug.Assert(tail != null);
                Debug.Assert(head != null);

                this.Tail = tail;
                this.Head = head;

                this.Vector = head - tail;
            }
        }

        private IObservable<BasedVector> DownInAndTrackWrtObservable(
            UIElement hitTestElement,
            UIElement trackWrtElement,
            bool handleItP = false)
        {
            var hitObs = hitTestElement.GetLeftMouseDownObservable();

            var trackObs = from mDown in hitObs
                           let mDownP = mDown.EventArgs.GetPosition(hitTestElement)
                           from mMove in trackWrtElement.GetMouseMoveObservable().
                               TakeUntil(trackWrtElement.GetLeftMouseUpObservable())
                           select new { D = mDown, P = mDownP, M = mMove };

            if (handleItP)
                trackObs.Subscribe(e =>
                    e.D.EventArgs.Handled = true);

            return from obs in trackObs
                   select new BasedVector
                   (
                       tail: obs.P,
                       head: obs.M.EventArgs.GetPosition(trackWrtElement)
                   );
        }

        private void Draw()
        {
            var controlPoints = new Point[]
            {
                new Point(0D, 0D),
                new Point(0D, 1D),
                new Point(0.5D, 1D),
                new Point(1.5D, 0D),
                new Point(2D, 0D),
                new Point(2D, 1D),
            };

            controlPoints.Run(DrawPoint);

            DownInAndTrackWrtObservable(canvas1, canvas1).Subscribe(bv =>
            {
                CanvasMouseDownTextBox.Text =
                    String.Format("Canvas MouseDown({0:G}, {1:G})", bv.Tail.X, bv.Tail.Y);
                CanvasMouseMoveTextBox.Text =
                    String.Format("Canvas MouseMove({0:G}, {1:G})", bv.Head.X, bv.Head.Y);
            });
        }
    }
}

和XAML

<Window x:Class="WpfTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Height="350" Width="522">
    <Grid Height="313" Name="grid1" Width="500" >
        <Canvas Height="237" HorizontalAlignment="Left" Margin="0,75,0,0" Name="canvas1" VerticalAlignment="Top" Width="500" Background="#00000000" />
        <StackPanel Height="52" HorizontalAlignment="Left" Margin="12,12,0,0" Name="stackPanel1" VerticalAlignment="Top" Width="200">
            <TextBox Height="23" Name="CanvasMouseDownTextBox" Width="186" BorderBrush="Blue" />
            <TextBox Height="23" Name="PointMouseDownTextBox" Width="186" BorderBrush="Blue" />
        </StackPanel>
        <StackPanel Height="52" HorizontalAlignment="Left" Margin="211,12,0,0" Name="stackPanel2" VerticalAlignment="Top" Width="200">
            <TextBox Height="23" Name="CanvasMouseMoveTextBox" Width="186" BorderBrush="Blue" />
        </StackPanel>
    </Grid>
</Window>

非常感谢任何建议

2 个答案:

答案 0 :(得分:1)

尝试使用此代码来处理hitObs上的事件作为同一Observable链中的副作用:

var hitObs = hitTestElement.GetLeftMouseDownObservable().Do(e => e.EventArgs.Handled = handleItP);

同时删除替换的if (handleItP)

您尝试的另外两种方式是使用单独的订阅,该订阅可以抢占您的主要订阅,或者在其他处理程序已经收到活动之后设置在链中处理得太晚。

答案 1 :(得分:1)

这不是一个Rx问题,而是一个事件冒泡问题。

如果我正确理解您的问题,我建议您根据OriginalSource属性过滤事件,以确保最初引发事件的元素是有问题的元素(而不是子元素)。 / p>