如何使图像与窗口大小成比例显示？答案

【问题标题】：How can I get images to display in proportion to the size of the window?如何使图像与窗口大小成比例显示？
【发布时间】：2014-01-22 18:50:50
【问题描述】：

我在 WPF 中显示了一个 333x 344 像素的图像，无论窗口大小如何，它始终显示相同的大小。图像位于停靠面板内，但将停靠面板更改为网格并没有帮助。

我怎样才能得到它与窗口大小成比例？

<Window>
<ScrollViewer>
<ItemSontrol>
<Usercontrol>
<Grid>
<DockPanel>
<Image/>
</DockPanel>
</Grid>
</Usercontrol>
</ItemSontrol>
</ScrollViewer>
</Window>

或

<ItemSontrol>
<Usercontrol>
<Grid>
<Grid>
<Image/>
</Grid>
</Grid>
</Usercontrol>
</ItemSontrol>

编辑：下面没有固定大小。图像周围的 DockPanel/Grid 可以替换为任何其他布局面板。其他无法更改。

img.Stretch = Stretch.None

【问题讨论】：

能否请您发布您的窗口的 XAML 代码？
移除滚动视图
@thumbmunkeys 不能那样做。还有一些其他的网格对窗口来说太大了，需要一个滚动查看器。

标签： c# .net wpf image xaml

【解决方案1】：

将图像嵌入ViewBox 并确保其父级将其大小限制为相应的窗口（如Grid）

【讨论】：

【解决方案2】：

从 xaml 代码中的图像中删除宽度、高度、垂直对齐和水平对齐属性。

【讨论】：

【解决方案3】：

ItemsControl 的默认ItemsPanel 是StackPanel，它限制了项目在“堆栈”方向上使用的空间（默认为垂直）。如果您将Stretch 设置为Fill，您可能会看到它拉伸以填充水平空间。一种解决方案是将面板模板更改为网格：

<ItemsControl>
    <ItemsControl.ItemsPanelTemplate>
        <ItemsPanelTemplate>
            <Grid />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanelTemplate>

    <UserControl>
        ...
    </UserControl>
</ItemsControl>

但在这种情况下，使用 ItemsControl 根本没有意义，因为您正在用单个项目填充整个区域。 UserControl 现在是项目集合中的第一个项目，任何其他项目都将堆叠在网格的顶部（除非您将行/列定义添加到面板模板网格并在项目）。您是否尝试为列表项创建背景或容器？在这种情况下，您可能应该定义 ItemsControl 的 ControlTemplate。

【讨论】：