如何在 WPF 中的圆中创建一个带孔的圆? [英] How to create a circle with a hole in a circle in WPF?

问题描述

我创建了一个 UserControl，它是一个环形，通过叠加 2 个圆圈，小圆圈是空白的，第二个圆圈后面是彩色的.

在我的 WPF 应用程序中，我想放置几个环，但小圆圈确实隐藏了其他环.我想看透它并捕获鼠标事件以用于其他环后面的环，否则它不是真正的环.可能吗?

我为小椭圆尝试了 OpacityMask，正如对

例如:

<路径.数据><CombinedGeometry GeometryCombineMode="Xor"><CombinedGeometry.Geometry1><EllipseGeometry RadiusX="75" RadiusY="75" Center="75,75"/></CombinedGeometry.Geometry1><CombinedGeometry.Geometry2><EllipseGeometry RadiusX="50" RadiusY="50" Center="75,75"/></CombinedGeometry.Geometry2></CombinedGeometry></Path.Data></路径>

然后 IsHitTestVisible="False" 应在需要时防止鼠标干扰.

I have created a UserControl which is a ring by superposing 2 circles the small circle being blank and the second behind the smallest being colored.

In my WPF app, I want to put several rings but the small circle does hide other rings. I'd like to see through it and also capture mouse event for ring behind other rings otherwise it's not real rings. Is it possible ?

I tried OpacityMask for small ellipse as pointed by answer to http://social.msdn.microsoft.com/forums/en-US/wpf/thread/551201d1-c5b3-4e17-ae63-625cfbb8bcc4 but still can't see ring behind hole:

<UserControl x:Class="MyUserControls.MyRing"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="150" d:DesignWidth="150" SizeChanged="UserControl_SizeChanged">
    <Grid Height="150" Name="Grid" Width="150" MouseMove="ellipse1_MouseMove">
        <Ellipse Fill="Red" Height="150" Width="150" HorizontalAlignment="Left" Margin="0,0,0,0" Name="ellipse1" Stroke="Black" VerticalAlignment="Top"  >
            <Ellipse.OpacityMask>
                <RadialGradientBrush>
                    <GradientStop Color="#FFB94444" Offset="0.496"/>
                    <GradientStop Color="#00FFFFFF" Offset="0.491"/>
                </RadialGradientBrush>
            </Ellipse.OpacityMask>
        </Ellipse>
        <Ellipse Fill="White" Height="100" Width="100" Margin="25,25,25,0" Name="ellipse2" Stroke="Black" VerticalAlignment="Top" />       
    </Grid>
</UserControl>

解决方案

It looks like you already found your answer (a few years ago), but for anyone else looking to do this, you may want to check out CompositeGeometry:

http://msdn.microsoft.com/en-us/library/ms751808.aspx#combindgeometriessection

Such as:

<Path Fill="Red" Stroke="Black">
    <Path.Data>
        <CombinedGeometry GeometryCombineMode="Xor">
            <CombinedGeometry.Geometry1>
                <EllipseGeometry RadiusX="75" RadiusY="75" Center="75,75" />
            </CombinedGeometry.Geometry1>
            <CombinedGeometry.Geometry2>
                <EllipseGeometry RadiusX="50" RadiusY="50" Center="75,75" />
            </CombinedGeometry.Geometry2>
        </CombinedGeometry>
    </Path.Data>
</Path>

Then IsHitTestVisible="False" should prevent mouse interference, when needed.

这篇关于如何在 WPF 中的圆中创建一个带孔的圆?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！