6

在以下示例中,无论何时更改 Grid 大小,剪切区域大小都会保持为以绝对坐标表示的大小。

<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>
4

2 回答 2

4

放入Grida 的内部Viewbox并更改大小Viewbox而不是Grid.

<Viewbox>
    <Grid Clip="M10,10 L10,150 L150,150 L150,10 Z" Width="200" Height="200">
        <Rectangle Fill="Red"/>
    </Grid>
</Viewbox>
于 2011-05-10T20:53:30.013 回答
1

另一种方法是使用元素而不是属性语法定义剪辑路径,然后在剪辑上使用与整个元素相同的转换,例如:

<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>
于 2013-08-05T15:02:08.580 回答