如何在例如Ellipse中繪制基本體？

Question

我有一個橢圓形，如圖所示。 我需要在給定的Ellipse內繪制一個圖元，如圖所示。

XAML：

<Ellipse
            Width="300"
            Height="200"
            Fill="Yellow"/>

圖片：

更新：看到我有用戶控制。 本質上，這是一個橢圓形的基礎。 另外，在給定的Ellipse中必須有一些圖元。 另外，我需要通過Bindings分別隱藏/公開那些基元。

主要問題是：只需嘗試將UC放入MainWindow中，看看會發生什么。 基本體將離開它們的坐標。 另外，如果我增加/減小UC本身的大小，它將無法通過適當的方式進行擴展。

<UserControl
    x:Class="Painting_test.UC_Ellipse"
    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:local="clr-namespace:Painting_test"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="300"
    d:DesignWidth="300"
    mc:Ignorable="d">
    <Grid>


        <Ellipse
            Width="200"
            Height="200"
            Fill="Yellow"
            Stroke="Black" />
        <Path x:Name="Bridge"
            Width="34.5"
            Height="69.5"
            Margin="115.5,127,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Data="M149,127 L115.5,195.5"
            Fill=" Yellow"
            Stretch="Fill"
            Stroke="Black" />
        <Path x:Name="Nose"
            Width="38.5"
            Height="1.008"
            Margin="115.5,195.5,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Data="M115.5,196.492 L153,196.5"
            Fill=" Yellow"
            Stretch="Fill"
            Stroke="Black" />
        <Rectangle x:Name="SquareEye"
            Width="24"
            Height="24"
            Margin="103.984,118,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Fill="Yellow"
            Stroke="Black" />
        <Ellipse x:Name="CircleEye"
            Width="24"
            Height="24"
            Margin="169,118,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Fill="Yellow"
            Stroke="Black" />

    </Grid>
</UserControl>

Answer 1

您需要使用Canvas而不是Grid作為容器，並且需要使用Canvas Left / Top而不是Margin ，如下所示：

<Viewbox 
        Stretch="Uniform" 
        HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch">
    <Canvas Width="200" Height="200">
        <Ellipse
            Canvas.Left="0"
            Canvas.Top="0"
            Width="200"
            Height="200"
            Fill="Yellow"
            Stroke="Black" />
        <Path x:Name="Bridge"
              Width="34.5"
              Height="69.5"
              Canvas.Left="65.5"
              Canvas.Top="63"
              HorizontalAlignment="Left"
              VerticalAlignment="Top"
              Data="M149,127 L115.5,195.5"
              Fill=" Yellow"
              Stretch="Fill"
              Stroke="Black" />
        <Path x:Name="Nose"
              Width="38.5"
              Height="1.008"
              Canvas.Left="65.5"
              Canvas.Top="145.5"
              HorizontalAlignment="Left"
              VerticalAlignment="Top"
              Data="M115.5,196.492 L153,196.5"
              Fill=" Yellow"
              Stretch="Fill"
              Stroke="Black" />
        <Rectangle x:Name="SquareEye"
                   Width="24"
                   Height="24"
                   Canvas.Left="53.984"
                   Canvas.Top="68"
                   HorizontalAlignment="Left"
                   VerticalAlignment="Top"
                   Fill="Yellow"
                   Stroke="Black" />
        <Ellipse x:Name="CircleEye"
                 Width="24"
                 Height="24"
                 Canvas.Left="119"
                 Canvas.Top="68"
                 HorizontalAlignment="Left"
                 VerticalAlignment="Top"
                 Fill="Yellow"
                 Stroke="Black" />
    </Canvas>
</Viewbox>

之前：

后：