如何创建排除椭圆/矩形区域的全屏覆盖WPF控件？

嘿，这个需求我之前做WPF项目时刚好实现过！用Path来打造这种“带洞”的覆盖控件完全是正确思路，不过你当前的代码还需要调整几个关键地方才能达到预期效果，我来一步步给你捋清楚：

要实现覆盖整个区域但排除特定形状的效果，核心是借助GeometryGroup的FillRule属性。默认的EvenOdd填充规则会自动判断几何图形的重叠区域：当一个点被路径包围的次数是奇数时，它会被视为图形内部；偶数次则视为外部。我们只需要先画一个覆盖整个控件的大矩形，再叠加要排除的椭圆/矩形，重叠部分就会被“挖掉”啦。

我把你的代码补全并优化了，直接就能用：

<!-- 记得在资源里添加我们需要的转换器 -->
<Window.Resources>
    <local:RectConverter x:Key="RectConverter"/>
    <local:CenterConverter x:Key="CenterConverter"/>
</Window.Resources>

<!-- 带挖洞效果的Path控件 -->
<Path Name="ShowcasePath" StrokeThickness="1" Stroke="Black" Fill="LightBlue" IsHitTestVisible="True">
    <Path.Data>
        <GeometryGroup FillRule="EvenOdd">
            <!-- 1. 覆盖整个控件的矩形，自适应控件大小 -->
            <RectangleGeometry>
                <RectangleGeometry.Rect>
                    <MultiBinding Converter="{StaticResource RectConverter}">
                        <Binding ElementName="ShowcasePath" Path="ActualWidth"/>
                        <Binding ElementName="ShowcasePath" Path="ActualHeight"/>
                    </MultiBinding>
                </RectangleGeometry.Rect>
            </RectangleGeometry>

            <!-- 2. 要排除的椭圆，这里绑定到控件中心 -->
            <EllipseGeometry>
                <EllipseGeometry.Center>
                    <MultiBinding Converter="{StaticResource CenterConverter}">
                        <Binding ElementName="ShowcasePath" Path="ActualWidth"/>
                        <Binding ElementName="ShowcasePath" Path="ActualHeight"/>
                    </MultiBinding>
                </EllipseGeometry.Center>
                <EllipseGeometry.RadiusX>100</EllipseGeometry.RadiusX>
                <EllipseGeometry.RadiusY>50</EllipseGeometry.RadiusY>
            </EllipseGeometry>

            <!-- 如果要排除矩形，替换上面的椭圆为这段代码 -->
            <!-- <RectangleGeometry Rect="150,100,200,100"/> -->
        </GeometryGroup>
    </Path.Data>
</Window>

上面的绑定需要两个简单的转换器，用来动态计算矩形范围和椭圆中心：

// 转换宽高为Rect的转换器
public class RectConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        if (values.Length == 2 && values[0] is double width && values[1] is double height)
        {
            return new Rect(0, 0, width, height);
        }
        return Rect.Empty;
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

// 转换宽高为中心Point的转换器
public class CenterConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        if (values.Length == 2 && values[0] is double width && values[1] is double height)
        {
            return new Point(width / 2, height / 2);
        }
        return new Point(0, 0);
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

• FillRule="EvenOdd"：这是实现挖洞的核心，一定要加上！没有它的话，两个几何图形会直接叠加，达不到排除区域的效果。
• IsHitTestVisible="True"：这个属性会让挖掉的区域不响应鼠标点击，完美符合“覆盖整个区域但排除特定形状”的交互需求。
• 自适应大小：用绑定和转换器的方式，能让Path自动适配父容器的大小，比写固定值灵活得多。如果不需要自适应，直接给RectangleGeometry.Rect写固定值比如Rect="0,0,400,300"也可以。

这样调整后，你的Path就能实现覆盖整个区域，同时排除掉你指定的椭圆或矩形区域啦！

内容的提问来源于stack exchange，提问作者Vijay Nirmal