如何使裁剪几何与目标一起缩放？答案

【问题标题】：How to make clipping geometry scale with the target?如何使裁剪几何与目标一起缩放？
【发布时间】：2011-08-22 19:14:42
【问题描述】：

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

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

【问题讨论】：

这确实引出了一个问题：最初的规模是多少？网格可以开始是基于屏幕等的任何大小，但几何图形具有固定大小。需要建立一个初始规模。那时，我会编写一个继承自网格的自定义面板，添加一个 dep.支柱。用于初始规模，并安排挂钩呼叫；没有“代码隐藏”，而是一个自定义控件。
是的，我意识到，关于规模，现在。使用 Stretch=Fill 将 Grid 替换为 Rectangle 以达到与 Path Stretch=Fill 相同的效果。虽然没有帮助。我正在寻找的解决方案是在控件模板中使用，而不是如何编写自定义控件。

标签： wpf geometry clip

【解决方案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>

【讨论】：

Viewbox 似乎没有缩放网格。事实上，它根本没有显示出来。窥探显示 Viewbox.RenderSize == 0,0。另外，不确定调整 Viewbox 的大小有什么帮助？
当您剪辑网格时，您似乎已经考虑了一些大小。将Grid.Width 和Grid.Height 设置为该大小。然后viewbox就会知道它有多大。

【解决方案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>

【讨论】：