如何在xaml WPF中绘制此形状?

时间:2019-04-18 09:07:45

标签: wpf

我必须在XAML中绘制此形状。我怎么画这个?

shape

我尝试过了,这没关系,但是不能拆分两种颜色

      <Path Grid.Column="1" Fill="Red">
                                            <Path.Data>
                                                <GeometryGroup FillRule="EvenOdd">
                                                    <EllipseGeometry Center="5,0" RadiusX="5" RadiusY="5" />
                                                    <RectangleGeometry Rect="0,0 5 80" />
                                                    <RectangleGeometry Rect="5,0 5 80" />
                                                    <EllipseGeometry Center="5,80" RadiusX="5" RadiusY="5" />
                                                </GeometryGroup>
                                            </Path.Data>
                                        </Path>

2 个答案:

答案 0 :(得分:4)

您可以在Canvas中使用两个这样的路径:

<Canvas>
    <Path Fill="Yellow" Data="M0,0 A5,5 0 0 0 5,5 L5,75 A5,5 0 0 0 0,80Z"/>
    <Path Fill="Red" Data="M5,5 A 5,5 0 0 0 10,0 L10,80 A5,5 0 0 0 5,75Z"/>
</Canvas>

有关详细信息,请参见Path Markup Syntax

答案 1 :(得分:1)

有几种方法。也许最简单的方法是用两个Grid元素覆盖黄色和红色部分来创建一个Ellipse

<Grid Width="50" Height="200">
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid Background="Yellow" />
    <Grid Background="Red" Grid.Column="1" />
    <Ellipse Width="50" Height="50" Fill="White" Grid.ColumnSpan="2" VerticalAlignment="Top" Margin="0,-25,0,0" />
    <Ellipse Width="50" Height="50" Fill="White" Grid.ColumnSpan="2" VerticalAlignment="Bottom" Margin="0,0,0,-25" />
</Grid>

enter image description here