在Silverlight XAML中剪切旋轉的矩形

Question

我想剪裁一個旋轉的矩形，與我可以剪裁縮放的矩形的方式類似。下面是一些簡單的代碼：

<Canvas> 
    <!--first example: clipping (transparent yellow) correctly clips scaled rectangle --> 
    <Rectangle Fill="Red" Width="200" Height="200" Canvas.Left="20" Canvas.Top="20"> 
    <Rectangle.Clip> 
     <RectangleGeometry Rect="0, 0, 200, 100"> 
     <RectangleGeometry.Transform> 
      <ScaleTransform ScaleX="0.5" ScaleY="0.5"/> 
     </RectangleGeometry.Transform> 
     </RectangleGeometry> 
    </Rectangle.Clip> 
    <Rectangle.RenderTransform> 
     <ScaleTransform ScaleX="2" ScaleY="2"/> 
    </Rectangle.RenderTransform> 
    </Rectangle> 
    <Rectangle Width="200" Height="100" Canvas.Left="20" Canvas.Top="20"> 
    <Rectangle.Fill> 
     <SolidColorBrush Color="Yellow" Opacity="0.5"/> 
    </Rectangle.Fill> 
    </Rectangle> 
    <!--second example: clipping (transparent yellow) incorrectly clips rotated rectangle --> 
    <Rectangle Fill="Red" Width="200" Height="200" Canvas.Left="20" Canvas.Top="250"> 
    <Rectangle.Clip> 
     <RectangleGeometry Rect="0, 0, 200, 100"> 
     <RectangleGeometry.Transform> 
      <RotateTransform CenterX="100" CenterY="100" Angle="0"/> 
     </RectangleGeometry.Transform> 
     </RectangleGeometry> 
    </Rectangle.Clip> 
    <Rectangle.RenderTransform> 
     <RotateTransform CenterX="100" CenterY="100" Angle="45"/> 
    </Rectangle.RenderTransform> 
    </Rectangle> 
    <Rectangle Width="200" Height="100" Canvas.Left="20" Canvas.Top="250"> 
    <Rectangle.Fill> 
     <SolidColorBrush Color="Yellow" Opacity="0.5"/> 
    </Rectangle.Fill> 
    <Rectangle.RenderTransform> 
     <RotateTransform CenterX="100" CenterY="100" Angle="0"/> 
    </Rectangle.RenderTransform> 
    </Rectangle> 
</Canvas> 

在我可以通過縮放（縮小）的剪切區域裁剪經縮放（擴大）的矩形的第一個例子。在第二個例子中，我想做類似的事情 - 通過某種方式操縱紅色矩形剪輯的Transform對象來保持由黃色矩形表示的裁剪區域。這應該不難，但我看不到它。感謝您的任何建議。

Answer 1

此：

<Grid Background="Yellow" Canvas.Left="400" Canvas.Top="50" ClipToBounds="True" Width="200" Height="100"> 
    <Rectangle Fill="Red" Width="200" Height="200"> 
     <Rectangle.Clip> 
      <RectangleGeometry Rect="0, 0, 200, 100"> 
       <RectangleGeometry.Transform> 
        <RotateTransform CenterX="100" CenterY="100" Angle="0"/> 
       </RectangleGeometry.Transform> 
      </RectangleGeometry> 
     </Rectangle.Clip> 
     <Rectangle.RenderTransform> 
      <RotateTransform CenterX="100" CenterY="100" Angle="45"/> 
     </Rectangle.RenderTransform> 
    </Rectangle> 
</Grid> 

會給你這樣的：

[紅色矩形是一樣的，從你的榜樣，只是刪除Canvas.Top/Canvas.Left setter方法]

那是你在找什麼？

編輯：

對不起，沒有注意到Silverlight標記。

試試這個：

<Grid Background="Yellow" Width="200" Height="100"> 
    <Grid.Clip> 
     <RectangleGeometry Rect="0, 0, 200, 100"/> 
    </Grid.Clip> 
    <Rectangle Fill="Red" Width="200" Height="200"> 
     <Rectangle.Clip> 
      <RectangleGeometry Rect="0, 0, 200, 100"> 
       <RectangleGeometry.Transform> 
        <RotateTransform CenterX="100" CenterY="100" Angle="0"/> 
       </RectangleGeometry.Transform> 
      </RectangleGeometry> 
     </Rectangle.Clip> 
     <Rectangle.RenderTransform> 
      <RotateTransform CenterX="100" CenterY="100" Angle="45"/> 
     </Rectangle.RenderTransform> 
    </Rectangle> 
</Grid> 

相同的視覺結果KaXaml。