Question

在以下示例中，每当更改网格大小时，剪切区域大小保持不变，因为它以绝对坐标表示。

<Grid Clip="M10,10 L10,150 L150,150 L150,10 Z">
    <Rectangle Fill="Red"/>
</Grid>

是否有可能以某种方式剪切区域，以便裁剪几何图形与剪切对象一起缩放？

不接受代码隐藏解决方案，因为这将在控件模板中使用。此外，为了清楚起见，示例中的区域是简单的形状。实际使用的区域是复杂且不对称的形状。

编辑：

看起来我必须更加具体。这是剪切，它是ProgressBar的自定义控件模板的一部分。缩放外部网格时，PART_Indicator矩形不会缩放其剪裁区域。正确的构图是网格尺寸为200x200时。

<Grid>
    <Path Name="PART_Track" 
          Data="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
          Fill="AliceBlue" Stretch="Fill"/>

    <Rectangle Clip="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
               Stretch="Fill"
               Name="PART_Indicator" Fill="Red" 
               Height="100" VerticalAlignment="Top"/>

    <Path Name="Border" Data="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
          Stretch="Fill" StrokeThickness="3" Stroke="Black"/>
</Grid>

更新： Rick提供了很好的建议，但我需要时间来了解如何使用它。这是最终的代码。

<Viewbox StretchDirection="Both" Stretch="Fill" >
    <Grid>
        <Path Name="PART_Track" 
              Data="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
              Fill="AliceBlue" Stretch="Fill"/>

        <Border Clip="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
                Height="200" VerticalAlignment="Bottom">
            <Rectangle Name="PART_Indicator" Fill="Red" VerticalAlignment="Bottom" 
                       Height="40"/>
        </Border>

        <Path Name="Border"
              Data="M100,0 A100,100 0 1 0 100,200 A100,100 0 1 0 100,0 Z"
              StrokeThickness="3"
              Stretch="Fill" Stroke="Black"/>
    </Grid>
</Viewbox>

Answer 1

将Grid放在Viewbox内并更改Viewbox的尺寸，而不是Grid。

<Viewbox>
    <Grid Clip="M10,10 L10,150 L150,150 L150,10 Z" Width="200" Height="200">
        <Rectangle Fill="Red"/>
    </Grid>
</Viewbox>

Answer 2

另一种方法是使用元素而不是属性语法定义剪切路径，然后在对整个元素应用时对剪辑使用相同的变换，例如：

<Grid.Clip>
    <PathGeometry FillRule="Nonzero" Transform="{Binding Path=MatrixTransform, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}">
        <PathFigure StartPoint="715, 96.3333" IsClosed="True" IsFilled="True">
            <PolyLineSegment IsStroked="False">
                <PolyLineSegment.Points>
                    <Point X="1255.2526" Y="540" />
                    <Point X="426.3333" Y="1342.3333" />
                     <Point X="64.66666" Y="7356.6666" />
                </PolyLineSegment.Points>
            </PolyLineSegment>
       </PathFigure>
   </PathGeometry>
</Grid.Clip>

如何使目标剪裁几何尺度？

2 个答案: