Question

让我们假设，我们有以下矢量图像由两条路径组成：

<Path Data="M 0 0 L 4 0 L 4 8 L 0 8 Z" Fill="Black" />
<Path Data="M 4 0 L 8 0 L 8 8 L 4 8 Z" Fill="Black" />

最重要的事实是，这个图像应该是16x16单位（尽管事实上，实际图像只覆盖了8x8的方形区域）。

我希望图像缩放到所需的大小 - 例如，我想将它放在大小为32x32的地方（然后，绘制的正方形应为16x16大小）。我该怎么办？

更难的部分是，我希望图像驻留在资源中。这可以通过以下方式解决：

<Canvas Width="16" Height="16" x:Key="MyImage">
    <Path Data="M 0 0 L 4 0 L 4 8 L 0 8 Z" Fill="Black" />
    <Path Data="M 4 0 L 8 0 L 8 8 L 4 8 Z" Fill="Black" />
</Canvas>

(...)

<ContentPresenter Content="{DynamicResource MyImage}" />

但这并不能解决缩放问题。如果可能的话，我想要一个不涉及使用各种Transform的解决方案。

Answer 1

如果您希望将其大小调整到任意大小，请将其放在Viewbox Stretch="Fill"。

<Viewbox Stretch="Fill" x:Key="MyImage">
    <Canvas Width="16" Height="16">
        <Path Data="M 0 0 L 4 0 L 4 8 L 0 8 Z" Fill="Black" />
        <Path Data="M 4 0 L 8 0 L 8 8 L 4 8 Z" Fill="Black" />
    </Canvas>
</Viewbox>

这会将内容扩展到Viewbox的大小。

如果您需要不同的拉伸行为：System.Windows.Media.Stretch

Answer 2

我相信你可能对WPF中的矢量图形有错误的印象。虽然确实因为WPF使用矢量图形，它可以平滑地缩放这些图形，但应该注意它们不能自我缩放。

因此，您的Path对象中有a list of instructions that describe how to recreate an image using graphics primitives，但它没有调整大小的能力。要调整职责大小，您有两种选择：使用ScaleTransform或使用ViewBox（来自MSDN上的链接页面）：

<Path Data="M10,100 C 60,0 100,200 150,100 z" 
    Fill="{StaticResource linearGradientBackground}"
    Stroke="Black"
    StrokeThickness="2">
    <Path.RenderTransform>
        <ScaleTransform ScaleX="3.0" ScaleY="3.0" />
    </Path.RenderTransform>
</Path>

...

<ViewBox Stretch="Uniform">
    <Path Data="M10,100 C 60,0 100,200 150,100 z" 
        Fill="{StaticResource linearGradientBackground}"
        Stroke="Black"
        StrokeThickness="2">
    </Path>
</ViewBox>

在WPF中缩放矢量图像

2 个答案: