wpf绘制圆环，实现图片镂空

一、使用Path构建复杂图形

Path所构建的图形由Data属性来定义，其属性的类型为Geometry(几何类)，通过Path可以构建更加复杂的图形。想创建一个圆环，一种做法是使用两个圆形构建，另一种做法就是使用Path，可以直接绘制出圆环。

<Window x:Class="Creg.ShieldCutterSystem.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Creg.ShieldCutterSystem"
mc:Ignorable="d"
Title="测试" Height="393.174" Width="614.334">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Canvas>
<!--使用两个圆形叠加出圆环，但要受到其所有容器的限制-->
<Ellipse Fill="Blue" Height="200" Canvas.Left="50" Canvas.Top="80" Width="200"/>
<Ellipse Fill="#FFF9F9F9" Height="120" Canvas.Left="90" Canvas.Top="120" Width="120"/>
</Canvas>
<Canvas Grid.Column="1">
<Path Fill="Blue">
<Path.Data>
<GeometryGroup>
<!--Center为圆心的坐标，RadiusX、RadiusY分别为X、Y两轴的半径-->
<EllipseGeometry RadiusX="100" RadiusY="100" Center="150,180"/>
<EllipseGeometry RadiusX="60" RadiusY="60" Center="150,180"/>
</GeometryGroup>
</Path.Data>
</Path>
</Canvas>
</Grid>
</Window>

运行



由于第一种做法是一种“虚假”的圆环，所以，当给两个圆环所在的Canvas添加背景时，第一种做法的圆环不能出现“镂空”的效果，但第二种可以，为两个Canvas添加如下的背景图片：

<Canvas.Background>
<ImageBrush ImageSource="Images/test.jpg"/>
</Canvas.Background>

运行



参考https://www.cnblogs.com/DragonInSea/archive/2009/06/16/1504417.html/