WPF线路问题

Question

我尝试制作一个非常简单的红色X按钮，类似于鼠标悬停在X上以关闭Google Chrome标签页。 Line控件似乎尊重其底部和右侧的边界，但是从顶部和左侧突出它们，我不确定如何修复它（除了给它们看似任意的边缘以迫使它们提交）...我有以下XAML：

<Grid Background="Black">
    <Ellipse Height="15" Width="15" Fill="Red" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    <Line X1="0" Y1="0" X2="10" Y2="10" HorizontalAlignment="Center" VerticalAlignment="Center" Stroke="White" StrokeThickness="1" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/>
    <Line X1="0" Y1="10" X2="10" Y2="0" HorizontalAlignment="Center" VerticalAlignment="Center" Stroke="White" StrokeThickness="1" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/>
</Grid>

第一个问题是线从左上角到右下角：

我选择了显示边界框的线条。注意该行如何从左上方的椭圆（及其边界框）中戳出，但是在右下方的内部。难道这些行为不应该是一致的，要么是要么停止，要么两者都停留在他们的边界内？

第一行至少穿过边界框的角落中心，但第二行最终向上和向左移动：

它们似乎都尊重底部和右边的边界，但是从顶部和左边的边界突出，这导致它们偏离中心。关于我能做些什么让他们以我想要的方式行事的任何想法？提前谢谢。

Answer 1

不知道为什么线条上限只对右侧和下侧的线条边界有贡献，但作为一种解决方法，您可以绘制以画布为中心的所有内容：

<Grid Background="Black">
    <Canvas HorizontalAlignment="Center" VerticalAlignment="Center">
        <Path Fill="Red">
            <Path.Data>
                <EllipseGeometry RadiusX="7.5" RadiusY="7.5"/>
            </Path.Data>
        </Path>
        <Path Data="M-5,-5 L5,5 M-5,5 L5,-5" StrokeThickness="1"
              Stroke="White" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/>
    </Canvas>
</Grid>