使用TranslateTransform时，画布上的WPF XAML剪切椭圆

Question

当我在WPF中运行此代码时，它给了我1/4的圆。 当删除ClipToBounds标签时，我得到了我的整个圈子。
1.为什么在渲染之前进行裁剪？
2.如何在保持剪裁的同时解决该问题？

<Canvas ClipToBounds="True">
    <Ellipse Canvas.Left="-10"
             Canvas.Top="-10"
             Width="20"
             Height="20"
             Fill="LightSeaGreen"/>
    <Canvas.RenderTransform>
        <TransformGroup>
            <ScaleTransform ScaleX="4.8"
                            ScaleY="4.8"
                            CenterX="0"
                            CenterY="0"/>
            <TranslateTransform X="48"
                                Y="48"/>
        </TransformGroup>
    </Canvas.RenderTransform>
</Canvas>

Answer 1

1. 为什么在渲染之前进行裁剪？

   • 不是。
     从这里您可以看到：
     
     您的Ellipse呈现完美。 ClipToBounds="True"是您可以从Canvas看到的废墟：
     
     

2. 我如何解决此问题，同时保持裁剪？

   • 这是一个广泛的问题。 您的问题来自以下事实：您将Ellipse放置在Canvas之外（ Canvas.Left="-10" Canvas.Top="-10" ），然后对其进行了裁剪。 请说明您的目标是什么，我会尽力帮助您。

Answer 2

此行为是设计使然。 教科书（《 计算机图形学：原理与实践-第三版》 ）的ClipToBounds以一种令人困惑的方式介绍了ClipToBounds ，使其看起来像是本书后续示例的一部分。 实际上，他们没有使用ClipToBounds="True" 。 您可以通过从http://sklardevelopment.com/graftext/ChapWPF2D/下载他们的实验包来进行验证。

为了说明这一点，下面是其中一个示例的实际源代码：

<Canvas
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  Name="ClockCanvas" >

    <Ellipse
       Width="20.0" Height="20.0"
       Canvas.Left="-10.0" Canvas.Top="-10.0"
       Fill="lightgray"/>

</Canvas>

请注意，画布上没有ClipToBounds="True" 。